In GUI, there are different icons which we can use in message dialogs such as (Warning, Exclamation, Error, Information ...). My general question is the application of each of them. But my specific question is when I want to request the user to do something before he can proceed further.

For example, he must select a check box before clicking the button. Or he must click another button to perform an action so he be able to do the action....

Which icon I should use on the message dialog to notify the user? Information? Warning? Error? ...

  • Uh... Shouldn't this be a question for GraphicDesign.SE? I mean, this is about presentation of content isn't it? – Ordous Dec 4 '14 at 19:00
  • Its about meaning of messages, not presenting contents, anyway I saw many related tags to this question. – Ahmad Dec 4 '14 at 19:01
  • I just feel as SE sites are increased, the ambiguity that which is for which increases, I even never heard about the sites you mentioned, also this site itself is most ambiguous one, there are questions about bugs to oop to gui to ... – Ahmad Dec 4 '14 at 19:13
  • Make sure you also read this answer to a related question: your current question looks like you don't understand very well the implications of message boxes on user experience and their low value. – Arseni Mourzenko Dec 4 '14 at 19:15
  • Depending on which platform you are designing for, there might be a guide that outlines how dialogs should look. E.g. OS X, iOS, GNOME, and KDE all have a “Human Interface Guideline”, while Android and Windows have resources with less catchy names. E.g. if you're following Google's Material Design guidelines, you should rethink whether you need a dialog at all, and if you do, you shouldn't use an icon. – amon Dec 4 '14 at 20:06

Wait, you mean you're showing the message box before the user clicks the button that requires something checked first?

The answer is no icon at all, because there should be no message at all. Don’t try showing a message box to instruct users on something they need to do next in another window. That requires users to dismiss the message then try to find what the heck it was talking about in the window below. It also will appear for users who already know what they need to do, which is annoying and contributes to users ignoring message boxes.

Instead, make it apparent what has to be done by the design of the underlying window. For example, if users can easily figure out by studying the window that a check box must be checked before clicking the button, then simply disable the button until something is checked.

If it’s not easy to figure out, make it easy to figure out. Put the check boxes closer to the (disabled) button so they’re associated by proximity. Put a “* Required” label on a border that surrounds the check boxes. Add text below the (disabled) button that says “Choose your x’s first” (which disappears when the user checks a box).

Consider automation. Break your UI up into smaller windows linked as a wizard to enforce input in a required order. Check some boxes by default, so the user is almost never faced with trying to click the button before anything is checked. If there is only one check box to check, delete it, and automatically perform whatever action it performs in the background when the user clicks the button (followed by whatever the button normally does).

  • I absolutely agree with this answer: Don't pester the user with dialogs, instead guide the user with an obvious flow. However, I think OP is using a workflow “User fills out form → user submits → display dialog because required field was missing → user fills out field → user submits → application starts working”. That's not quite as bad as presenting a dialog up front, but it's still not good UX. – amon Dec 4 '14 at 20:38
  • @Amon: If the user tried to do something that couldn't be done (e.g., submits before completing the required field), then it's an error and the icon is an error icon (this assumes that disabling the submit button is a bad idea -there are situations). Thanks re the links -fixed. – Michael Zuschlag Dec 4 '14 at 20:54
  • Actually, now that I look it up, the Windows UX Interaction Guidelines recommend no icon at all in message boxes for minor input problems. It's not worth getting alarmed over. – Michael Zuschlag Dec 4 '14 at 21:20
  • @MichaelZuschlag: I disagree. It's not an error, it's just a state that needs to be rectified. The user didn't do anything wrong, it's the software that isn't prepared for real world data. Users shouldn't be made to feel like they are stupid, and telling them they made an error or omitted an entry in data entry is the same as telling them they are stupid. Simply inform them of the situation and let them decide how to deal with the information. If you use an error icon for data entry and also for real, serious errors, the user will be conditioned to take all errors lightly. – Bryan Oakley Dec 4 '14 at 21:21
  • @Oakley: Look it up in the Windows UX Interaction Guidelines. The "error" icon does not mean anyone or anything did anything wrong. I admit that I (and Microsoft) am ambivalent about using the scary red icon for minor problems, but I think it comes down to indicating whether there is something the user has to attend to in order to continue or not. That's an important distinction. That's the difference between an error and an information icon. You can't rely on users reading the message to know if something needs attention. User won't read something if they think they don't have to. – Michael Zuschlag Dec 4 '14 at 21:35

Roughly speaking, there are four choices: info, warning, error and question. They may go by different names in different toolkits, and there may be variations of each type (fatal error vs non-fatal error, for example). In my opinion, almost all dialog boxes should be "info", because that's what they are -- they are informing the user of something. That, or "question" if they are asking a question. Even if the information is "hey, you entered the wrong information", that's not an error, that's information.

The only time a warning should be used is if the user is about to do something that is irreversible or dangerous and should be warned. Even then, it's better to design your app so that nothing is irreversible or dangerous and avoid warning dialogs completely. As a user, you should almost never, ever see warnings in a well designed app.

Error icons should only be used when the program is at fault, never for when the user is at fault. If the user types a letter into a number field, that's not an error, they just need to be informed that the app requires a number. An error is when the computer runs out of memory, or the database is corrupt and the program must exit.

In the specific case mentioned in your question, you should use an information image unless the dialog is asking the user a question (in which case you might want to use a question mark). You're informing the user of a requirement of the application.

  • In my specific occasion, should I use information or warning? – Ahmad Dec 4 '14 at 19:00
  • @ahmad: information. Though, the actual answer is "be consistent with what the other parts of your app do". If it's a new app, information, definitely. But if you're working on an existing application with existing dialogs, be consistent. – Bryan Oakley Dec 4 '14 at 19:07
  • I agree the word "error" should be avoided in messages and documentation because it can be taken to mean the user is at fault. However, I also think it's important for the user to easily and immediately recognize when there's a problem (as opposed to getting some other information). That's what the so-called error icon means, according to the Windows UX Interaction Guidelines, so that's how it should be used. It doesn't matter who's "at fault." – Michael Zuschlag Dec 4 '14 at 21:10
  • 1
    your answer and comments by @MichaelZuschlag all have some points. Maybe disabling button is the better idea. but information icon to me is when something has been done successfully and we inform the user about the situation. Then by seeing it the user is not ready to find that something has been gone wrong. Warning also means a choice! to proceed in spite of the subsequent issues or not. Then the only thing remains is Error! – Ahmad Dec 5 '14 at 7:04

If you want to request the user to perform some action before he/she can proceed then you should use the exclamation mark icon. It draws the attention of the user without being overly dramatic. An error or warning symbol might be interpreted negatively (blaming the user), but an exclamation mark is more neutral while still demanding attention.

In general:

  • Warning: Should be used in the scenario where an action may have irreversible consequences if the user chooses to proceed. E.g. Warning, if you proceed with format you will lose all data on the disk, do you wish to continue?
  • Error: Should be used for genuine error situations only. E.g. File upload failed, or connection to host was lost
  • Exclamation: Should be used when conveying information that requires the attention of the user, i.e. you need them to pay attention to it, because an action from them is required. E.g. the .NET error provider control for forms also uses an exclamation mark to draw attention to fields containing values that have failed validation.
  • Information: Should be used when conveying general information that does not have any urgency (a user can still get along fine using the application if they don't bother to read the message).
  • Thank you, just I feel C# Winform lacks some icons, the exclamation and warning icons are the same, it was nice if you could put some icon in your answer. Moreover I think it also needed a success icon to be distinguished from information icon! – Ahmad Dec 5 '14 at 14:04
  • Very true. In WPF I always use a green tick icon for success, but Winforms standard message box is limited, and I don't think they thought it through as well as they could have. You can always roll your own winforms dialog and use your own set of more appropriate icons. I prefer to do that. – Franchesca Dec 5 '14 at 14:13

The most obvious choice for me here would be a Check mark icon.

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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