0

On my UI, I want to have any option/icon so that user can show that this page can be copied or not e.g:

The sample that I have decided so far is that when user hovers over the page, "allow multiple copies" icon appear on the top of the page like below: enter image description here

When user clicks this icon, multiple copies of page becomes supported and a green tick mark appears with the icon showing that multiple copies are allowed for this page. enter image description here

Is there any better option other than giving user an icon on hover to decide that page can be copies or not?

EDIT: How to make this page back to "Un Copy-able" once user has allowed to make its copies?

3 Answers 3

1

Will this document shown as PDF preview? or HTML page? If it is PDF Preview, then I think you don't have any control to modify Adobe components.

If it is an HTML page then, I think you can have a pattern like page properties. In that you have bring on hide/show widget and provide the properties. If you don't have such flexibility, then try providing small a overlay properties (just like in PDF view on hover you will get a small icons like save, print, etc). There you can have a checkbox with a text message to make it multiple copies.

Either provide this on the top of the page or bottom of the page while viewing in the HTML.

enter image description here

2
  • So the check box with text can appear on hovering over the top boundary of page, right? Does this approach look correct?
    – Ayse
    Commented Apr 10, 2014 at 12:54
  • Yes. just for your convenience I am providing the screenshot of the idea in my below answers. Commented Apr 10, 2014 at 13:07
1

I suppose that you don't have space around your document, or don't want to use some. Then your only solution is to display the action button on the document.

You chose to show an icon on mouse hover, probably in order not to cover the document unnecessarily. This is fine but be careful as tablet touch screens don't have hover events.

Another solution is to have a sliding toolbar, that shows when clicking on a small icon. This spares space if you have more than one action button, but doesn't make much difference if you have only one.

Edit: if you need to unselect your option, you clearly need a toggle button or a checkbox. There are many ways to render this, it depends on your overall design.

2
  • What if I display this icon not only on hover but constantly?
    – Ayse
    Commented Apr 10, 2014 at 9:16
  • 1
    It is certainly better for touch screens. Isn't it covering important parts of your document?
    – Mart
    Commented Apr 10, 2014 at 9:46
1

If you are considering this design for multiple device support then I will agree with Mart, you will have to avoid the hover event since touchscreens wont have direct support for that.

Now that you have to provide the option I suggest that you can try the following

Provide the option in the context menu on the page (right-click) provided you want to let go of the conventional options on the page and customize if for your own application. On touchscreens you can achieve that by "prolonged touch" on the screen. The advantage that you have here is that if you want to accommodate even more options for the page (apart from copy enable-disable) you can do that as just another menu item.

You can also try a small persistent icon on the page (preferably the top-right corner - as you have used). Consider the tick that is shown in your screen as the icon used. Use a semi transparent icon which will be green when enabled and grey otherwise. The small size will effectively reduce the amount of content that you mask and keeping it semi transparent will always keep it subtle.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.