Hot answers tagged

66

I hate it when a modal dialog appears asking me to confirm an action and the only way I can confirm that, yes, this is the record I want to delete, is to view the information underneath the immovable dialog. I usually have to cancel, double check, then click again. Or, consider this scenario: Hey Mr. Team Leader, there's this case I'm working on and ...


46

Usually the downsides outweigh the upsides i.e. usually the answer is "no" Here are some of the typical considerations with movable modal dialogs. Note that some of these verge on implementation issues, but I've included them anyway because they all have usability impact: Moving the modal requires a lot of cognitive load. The user has to find the ...


34

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 ...


25

Not according to Microsoft. Use title-style capitalization, without ending punctuation. Source: Microsoft Guidelines for Windows, section about error messages.


22

I would say that this often leads to an unwanted drag and drop action. What if this window for example has a small scrollbar, you want to scroll to the bottom of the page and you accidentally miss the scrollbar? You would drag the window down and you might need to reverse this action. Why is it uncommon that windows can be moved by clicking anyway in the ...


19

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 ...


17

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 ...


17

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 ...


16

My answer would be to synopsis the question of the modal form, so with the question being: You are leaving the question with unsaved changes The title would be: "Unsaved Changes" It's a pattern I've seen and used regularly, it's brief and informative.


15

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:


13

The title bar isn't always the only spot to that can be used to drag the window, (these days some windows can be dragged by parts of their background, but it's rare) but it's the oldest and most established and common convention. It originated in the early WIMP UIs, the Smalltalk systems from the 70s and 80s. If you study the way the above windows were ...


13

The "OK" button has the wrong word. It should be a "Continue" button, as this is what's required of the user. The user is being asked to acknowledge they're aware of the nature of the warning, and that they'll be continuing without a current reload/refresh of the data. It is not OK that the data didn't load, so there's a needless cognitive dissonance ...


12

This is actually not always true. In some cases the default behavior of most apps would be to allow to drag windows by empty space. An example is KDE. See the screenshot: KDE's default Oxygen widget style has window decoration visually merged with window contents. Thus, to make feel match look, the theme also by default allows to drag windows from all ...


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

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 ...


11

Exporting data can be more time consuming Ultimately it depends on how your users feel about it but exporting data requires users to think more and can add friction to their work flow. If I could only choose one option or the other I would go with option 1, however, export to Excel sounds like a very useful function so consider the following example. Show ...


10

This area is normally giving you information on the type of question being asked (at least in my experience), so the question mark feels like the dialog is questioning itself. I'm a "Save Changes" dialog... or am I?


10

The Windows OS provides the (optional) title bar and control box, as well as a mechanism for OS users to organize their application windows (re-positioning, minimizing, maximizing, closing). From the perspective of the Windows OS, the title bar is the user's API for these operations. Everything else in the window is "content" that is under the control of ...


9

Great question. I've been thinking a lot about "confirmless deletes" because of a behavioral issue with models that is outlined here. In short, most users actually intend to delete an item when they initiate the interaction, so throwing up a traditional confirmation is annoying most of the time. I totally agree with Lauren's answer on the basic ...


7

Inline not Modal Inline edit is to be preferred at all times. The user keeps context, have the ability to use information related and narrow to the edit and the user don’t have to focus on a new UI. It is the same, simple, easy and straightforward process where the flow of work can be kept. Modal dialogue breaks the users’ context and it takes time for the ...


7

As a general principle what you want to achieve is clear, easy, self-explaining, etc... ways for your users to interact with your application. In this type of modal an "OK" or "Close" modal would be pretty equivalent since they don't have to make a decision about something, it's just an short and simple informative message about something that has already ...


7

Use more specific language in your CTAs Perhaps you've got a style guide that might prohibit this, but part of the existing problem is that the microcopy is typically generic. Leave the buttons in the task modal as [Save] and [Cancel]. Restrict so that it's only possible to save from the task modal. Use more natural language instructions in the Confirm ...


6

In my experience, modal windows are best used to present clear interactions that the user either: needs to do (e.g. resolve an alert) has chosen to do (e.g. open a photo gallery). Resolving that interaction should close the modal, and there should already be a control in place that does that. This is because modal windows interrupt the user flow and ...


6

When deciding between a modal and inline entry, consider what is communicated to the user by your choice: Inline Blank Entry "You're going to be doing this a lot, so we don't want it to be a big deal." "Don't worry too much, this is easy to fix if you make a mistake." "We expect you to enter multiple items." Modal Dialog "Please focus. This is too ...


6

A lot of the challenge you're dealing with stems from the complexity of communicating and managing the relationship between the two windows (form and calculator). Ultimately, it looks like the calculator is there to assist with the form, so you may want to consider removing the "two windows" part of the problem altogether. Just have the calculator slide ...


6

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 ...


5

Modal windows are quite common nowadays so the user might not but surprised to see something like that appear. The content of the modal window is more important than the pattern itself. If the content is an action, it is a common pattern to use ellipsis (aka suspension points). If the content is just information and long, you should just use a simple ...


5

Yes, there is extensive research on this question available in the literature on usable security, and they have found that users do indeed become jaded. This is an important challenge for making security usable: sometimes developers think, if in doubt, just throw in another warning dialog; but the research literature shows that this is a bad idea. ...


5

Microsoft conducted a lot of testing into the User Account Control (UAC) between Windows Vista (when it was introduced) and Windows 7. They have a post about this on their msdn blogs: We have learned from our customers participating in the Customer Experience Improvement Program, Windows Feedback Panel, user surveys, user in field testing, and in house ...


5

Dialog boxes are needed. In the old HCI thinking, a user interface is essentially a dialog between a human, and a computer. However, handling of the dialog boxes can become habitual. The typical example is Word or any similar document editor: when you close an unsaved document, usually, you don't want to save it. In those exceptional times when you actually ...



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