202
Cancel might be too vague. I always like to be more descriptive when asking users to perform a quite destructive task. This often reduces any anxiety users might have.
download bmml source – Wireframes created with Balsamiq Mockups
Edit
As LightnessRacesinOrbit made me realise in the comments, mixing up buttons with links that act like buttons (or in ...
93
All of these UI components are containers/windows that show on top of the content you are currently viewing/interacting with. The different names are based on the attention they deserve, the context you're in, and how you can interact with them.
Alert - These messages need immediate attention. The window/container is usually locked, meaning you can't ...
75
It is about increasing the chance of the user having a look at the popup.
Task-completion mode
Users in task-completion mode are eager to fulfil their goal (eg, "Is the product/information/answer I'm after on this page?"). As such, they simply ignore anything irrelevant because it is an obstacle to their goal.
Obstacle placement
On-load pop-ups are ...
69
...but name buttons after what they actually do.
This might seem pedantic, but looking at the screenshot the "Select" button doesn't select the video, it confirms a previous selection, presumably by the user clicking one of the videos, etc.
You might want to use the verb that your application will perform, such as Edit, Delete, Play, etc. Or stick with OK /...
49
Have you considered giving the user an undo button instead? It reduces the cognitive overhead because no choice actually has to be made in the normal case and reduces the input from always having to do two actions (click cancel and then confirm/other) to only a single action when the user actually wants to cancel:
Wireframes made in Pencil.
35
If a popup confirmation is so uninformative that a user might need to move it out of the way to decide whether to proceed, then the problem is a bad popup, and allowing it to be moved is not solving the core problem.
Assuming you really do need a popup that comes before the action and fills the screen, to get an informed response from the user before ...
answered Jan 19 '16 at 14:01
user56reinstatemonica8
2,6461 gold badge13 silver badges24 bronze badges
30
A combo box has a specific interaction which has not changed for decades. Its interaction is aligned with a simple user goal - to select one or more items. Most users will expect this interaction. Note: A combo box does not have a pop-up - it is an expandable/collapsible list.
A tooltip has a completely different user goal - it is to provide additional ...
24
In general, I use the following guidelines for using modals:
Is it focused? Every time you throw a modal in front of a user, you're disrupting their workflow. Disruption isn't always bad. Sometimes that's what you want. But you have to realize you're doing that and use it for your benefit. Items within a modal should self-contained. A good rule of thumb is ...
22
They are distinct:
OK: Applies the changes and closes the dialog (or goes back to the previous location / one level up)
Apply: Applies the changes so the user can see / work with the results, but keeps the dialog open, ready for further modifications
Cancel: closes the dialog without applying any changes.
The "Close button" in the window title usually acts ...
21
You should have the buttons at the bottom right because:
The standard for modals is to have the buttons at the bottom, so it is likely where people will look for action buttons
It is a more natural visual flow reading in a Z pattern, and one that has become entrenched.
A button on the right is typical for a submit button as it has the feeling of moving ...
21
It may be redundant, but independently of this the real concern should be to evaluate if this redundancy is beneficial, harmful or neutral.
Different goals, different designs
Do you need a confirmation modal or just an informative one?
Confirmation: To start with you'd need a OK/Cancel pattern which will offer a clear binary option. You could avoid the X ...
20
It's a heated topic to be sure, but the best insight comes from understanding the usage and intent of a user clicking a link and specifically how this relates to the work at hand and what is going on in the user's mind (i.e. what they are trying to achieve by clicking the link and how that relates to their workflow).
In general, if a link results in leaving ...
20
Pop-ups are great. They're usually called modal dialogs because a user cannot do anything but complete the task in the popup. This is their primary functionality and they're better and clearer at that than most similar solutions. In OSX you also have what they call Sheets, but they're a lot less clear about the fact that you need to finish them before you ...
20
I recognize that the web leads to its own problems because it is platform independent, but if most of your visitors are Windows users than using Windows standards might make sense. Here is one page from Microsoft on UI design.
User testing would really be the best option in this scenario. This may be common knowledge to everyone here but I'd recommend the ...
19
If you are writing prose, a . (full stop) is there to show a the end of a sentence so that you know when the next one starts. If you only have one sentence, then it isn't strictly necessary for clarity. Hence, if it's a short notification message of only one sentence, you can leave it out.
That said you should keep to the style guides given for your ...
18
The idea behind this bar can be traced back to Gestalt's law of similarity which states:
Elements within an assortment of objects are perceptually grouped together if they are similar to each other.
This is why you shall see two columns in (a) and two rows in (b). The latter also demonstrates that colour wins over shape (in this specific example at least)...
18
A tenet of good user experience in software is system feedback. In this instance, the system should confirm it will no longer show you notifications... which is a good place to offer an undo option, as well as tell them where they can change their preferences.
For example:
18
They want you to subscribe.
Because subscriptions or email marketing gives pretty nice return on investment (ROI) most of the web admins use extreme measures to capture users attention to users can potentially subscribe.
Pop ups work well for increasing email subscriptions
They may be annoying but surprisingly, they work very well specifically for ...
17
Interrupting users is typically not good UX, something to keep in mind when you are asking them to rate your app. Having said that, I am typically OK with a one-time popup as a reminder. But if it shows up again I will mention it in my review.
Another idea to consider is an easy to remove banner at the top of the screen. That would encourage users to rate ...
17
Inline Field Validation
I would recommend to stay on the same-tab, with validation in-place (inline) like this example:
This is a common design paradigm now that web form internet users are accustomed to. I don't know why you'd need a pop-out or a new tab.
17
A tooltip without a close button lacks affordance on how to close it.
Therefore, users would want to close the tooltip but may not know exactly how. It's not evident that clicking anywhere else on the page will close it. This can cause confusion and even some novice users might leave the current website/app because they might change or mess something.
...
16
Simply ask your client if they are willing to lose users at this step in hopes of collecting more email addresses. A complete and thorough visit of the site may be worth less to them than having that email address or vice versa.
I also like to tack calls-to-action like this at the end of good content (a gallery, a video) that I feel engaged users are ...
16
First some personal appreciation, then some sources :
1) I think is less about the positive or negative than the flow in the process.
ex :
Do you want to save before leaving ? Yes / No
Is not good UX
Save before leaving ? Save / Leave without saving / Cancel
Is good UX
That is to say, most of the time a question which answer is Yes / No is not ...
16
In terms of mobile,
A mobile screen does not have the space to fix your problem by moving the popup. You can move the modal window and still not see the information you want to because it has limited space.
A popup usually covers the information below by a black overlay so that it stands out. Just moving the popup won't be enough then. You will have to get ...
14
Take a step back here, do you need that button at all?
The title of your dialog asks the user to "Select video", which they do by clicking straight on the video. Isn't that good enough? Do they really need to move their mouse all the way down to bottom right after this to click another button?
Now, if your workflow involves selecting multiple videos (I ...
11
The simple fact is that a popup draws a user's attention away from the page and makes them pay attention to the popup. If the content of the popup isn't necessary or more important than the page content, then it shouldn't be there. If it is more important, then it should.
So without any clear information about whether the popups are critical or not, we ...
11
Unless you already have a positive/negative position set out I would say whichever is more likely to be clicked on the right, due to a similar reason described here:
http://uxmovement.com/buttons/why-ok-buttons-in-dialog-boxes-work-best-on-the-right/
Some designers believe that putting the primary action on the left side before the secondary action is ...
11
They are different terms
Callout is an older term that dates to paper-based design before the web. Callouts are used in design to draw attention to or label something. Here are some callouts labeling the orientation of a part:
There are many ways to style callouts, but usually there is a line or an arrow to indicate the subject of the callout. Here are ...
11
Here's how...
See this dropdown effect for an example of how the Material Design physics can work for a popover. A similar schematic is:
The opacity fade, triangular callout indicator, and growth origin (top or center) are all valid options.
Here's why
Material Design guidelines don't specify popovers, but the specification of material properties ...
11
In the name of all internet users, I beg you not to use a pop-up advertisement.
Nobody likes pop-up advertisements. Nobody.
Okay, that's not entirely true. 95% of the internet doesn't like pop-up ads, according to the Nielsen Norman Group. They did a quite interesting study on the impact of advertisements on the User Experience.
Users not only dislike ...
Only top voted, non community-wiki answers of a minimum length are eligible
