Hot answers tagged

138

Yes. There is a very simple, effective heuristic that adjusts to the preference of each user. Place a check box in the warning message dialog that says: Don't show this message again Which can be improved further by stating where that dialog can be reenabled.


67

v1 I would suggest that the play button stays the same as it always has - a triangle to begin then a pause once playback begins. But, once playback has started, a new button appears like this: The circle encapsulating the easily recognisable play triangle is pointing in an intuitive direction: anti-clockwise, implying that we are going back in time. The ...


61

These are Confirmation messages - Windows have a fairly detailed page on their guidelines. The whole of that page is pretty useful but here's some excerpts (emphasis mine): Confirmations are most useful when the action requires the user to make a relevant and distinct choice that can't be made later. That choice often involves some element of risk that ...


43

A Facebook or Google+ sign-in method can actually encourage people to sign-up at all. Most users value the uncomplicated experience they get when signing up via Google+ or Facebook. Hiding this option behind another click will make this valuable option invisible and prevent sign-ups by "lazy" users.


42

Be a voter > Vote now Christopher Bryan and Gregory Walton (2011) conducted a study for understanding if using a noun or verb statement have an influence on user motivation. According to the results of their study, participants in noun group expressed significantly more interest, 62.5%, in registering vote than participants in the verb group, 38.9%. ...


36

Checkboxes are often used instead... For these kinds of togglable, mutually exclusive options. For example: But if you prefer buttons... A check mark inside the buttons provides a better toggle affordance, and is also more color-blind friendly: Radio buttons can also be used here for the exclusive buttons, but they (a) require an additional 3rd ...


36

No. I had no clue what the icon meant. Maybe it's location dependent, but here in Belgium movie tickets don't look like that. Without a broader context it's hard to judge, but it seems you're trying to solve the wrong problem. If you need the hover state to convey some important information, i.e., what action this button will perform, you've already ...


36

I would consider two things here: Visual connection to action Common standard implementation To the first point - visual connection: If you see an arrow that points up, you expect something to happen in that direction. You will automatically look up, not down. So every action that goes to a different direction will feel alien, detached. So this argument ...


32

A button should show what will happen when it is next clicked - not point to something else. When the button above a closed menu is clicked, the content will drop down - so the should point down (to where the content will appear) When the button above an open menu is clicked, the content will move up into the button - so the arrow should point up.


30

IEC 60417 is a standard for symbols to put on electrical devices (TVs, VCRs, washing machines, MRIs etc.) and ISO 7000 collects these. Each costs around 100 bucks, but there is a free preview PDF. It’s the closest I could find that would standardize the common playback controls like play ▶️, pause ⏸, play/pause ⏯, stop ⏹, fast forward ⏩, rewind ⏪, skip/next ...


29

No, it would seem not, as W3C states 1.4.3 Contrast (Minimum): The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following: (Level AA) Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1; Incidental: Text or images of text that are part of an ...


29

you can use a restart / reset button, here's an example from YouTube, the leftmost button


28

I'm surprised nobody brought up the Mac OS X shut down dialog. It presents you with an "Are you sure?" window, but has a timer so that if the user walks away, expecting the computer to have shut down, it will while still allowing the user time to cancel.


25

Why not merge the done and next buttons? This layout still allows a user to continue without being finished with the page, but requires less clicks.


25

There are a few reasons: Robot defense. Content sites (e.g. news sites) sometimes use these buttons to provide a rudimentary defense against content scrapers. By showing only part of the content they prevent scrapers from loading the page and parsing the article. This is obviously very crude, but it is still effective. Affirmation of user intent. ...


25

You should NOT rely on hover states. Even if you’re not developing a responsive website, now that we have touch devices, the days of relying on hover states to imply "interactability" are gone. I think you have 3 options here: 1. As long as you don't have other animations, subtle movement is all you need to draw attention to the UI elements—and a user will ...


24

NNG Has a great article on Making Clickable Elements Recognizable specifically for images: Ensure smaller images enlarge when clicked. Make all elements (e.g., picture, icon, text) that are associated with each other clickable. Doing so increases the target size and improves the probability of capturing an intended click. Avoid multiple calls to ...


20

I would join button 1 and button 2. Then you can have the one that is selected be a different shade than the other (for example, 'yes' is selected in the example below. When 'no' is selected it will become blue and 'yes' will become white). This will show that those two are mutually exclusive. Then for buttons 3 & 4, I would use the same 'on' and ...


20

Are you restricted to using an angled corner? If not, a box would be much more simple & sleek. Otherwise if you are stuck using the angled corner, aligning to the top right rather then center is probably your best bet!


18

Arrows pointing in our reading direction (right or down) point forwards. Buttons should indicate what happens when clicked. The arrow on a dropdown button should point right or down as it indicates new content will be visible once clicked. Once the dropdown has been opened, clicking the button again should close it. Therefore the arrow should point upwards ...


17

A few reasons why this is a bad idea. Cannot Copy User cannot copy the text of the button. This breaks the expected functionality of the browser – being able to select and copy text. New Information When user is going for the button, he already has an expectation of what it is going to do. Making the contents of the button change upon hover, introduces ...


15

Ideally from a pure UX perspective there shouldn't be such a checkbox at all. It is an unnecessary extra click. Users should be able to just click next and it is naturally assumed they are done. However, I assume that this is a box that exists for some sort of compliance reason? Its one of those "Yes I have read everything here and fully agree with it thus ...


14

There are 3 cases. The destructive action Do you want to delete this file? Don't. Just do the action, and display a confirmation snackbar (non-blocking small widget somewhere where it is visible but not in the way of operating) that allows to cancel (then, either delay the action, or make sure you can revert it easily). The question can only be ...


12

One option you may try is to make the dark area variable, depending from the number of digits. This way the dark area will also work as a visual cue, indicating the magnitude of the number.


12

As you have pointed out, the double click is not a standard behaviour that your users are familiar with in the situation you are describing. It's not good practice to use non-standard interactions where you could use a standard one. Irreversible actions (such as deletion) are usually followed up with a 'sanity check' like "Are you sure? [Yes] [No]".


11

It could be default and everybody would understand it, although it's not completely correct, because once the user interacts with the button (for example, it's pressed), then s/he may miss which status was the default. Also, some applications have buttons with different statuses on load (for example, ACTIVE status) , so for that button, the default would be ...


11

You have a primary and secondary action. Details is the primary action, delete is the secondary action. What you could do is move the delete function into the window that contains edit/information. This has the added advantage of cleaning up your listing layout. This will only work if delete is a fairly uncommon function and the use case is something like ...


11

These images simply don't look like navigation (as you admit) and won't be perceived as such. Users just don't expect oddly shaped images to be clickable. I don't think there is any magic solution to overcome that. It may be worth rethinking your design in order to better conform to user expectations rather than trying to put a band-aid on the problem. ...


11

Movement might provide you with an option. The human eye is so attuned to it that it need only be subtle. On completion of the page load you could consider a rolling increase in image size and shadow depth on each image, across the chevron from right to left. This would draw a user attention in without having to "feel" the site. You then apply the same ...


10

3 small action buttons on the left-hand side of each row With a LTR languages, one can assume users will first inspect the row (starting from the left) and only then decide to take action. So placing the buttons on the left side is somewhat counter-flow. 3 small action buttons on the right-hand side of each row Pros: Buttons are easily ...



Only top voted, non community-wiki answers of a minimum length are eligible