User Interface Design Principles
A good User Interface needs to be clear, friendly, effective and attractive.
It should meet users' expectations and needs and also exceed some of these through innovation and accelerators.
1. Visibility of system status
Probably the two most important things that site visitors need to know are:
“Where am I?” and
“Where can I go next?”
The system should always keep users informed about what is going on through appropriate feedback in a reasonable time. Don’t keep the users guessing — tell the user what’s happening by displaying a progress bar and/or an estimate of the time it may take to load,
In the same time the user needs to get the appropriate information about the next step in his/her journey.
Example: A customer who needs to download a driver from a support website, might also need to refer to the Installation Guide for further assistance. Understanding the customer needs and helping him/her to easily find the guide will improve the customer journey.
2. Familiar labels and language
A website should speak the users' language, with words, phrases and concepts familiar to the user, rather than technical terms. Follow real-world conventions, making information appear in a natural and logical order.
3. User Control and Freedom
Users might choose system functions by mistake or change their mind and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. 'Undo' and 'Redo' functionalities are a necessity for every website.
This feature relieves anxiety, since the user knows that errors can be undone; it thus encourages exploration of unfamiliar options.
4. Consistency and Standards
Users should not have to wonder whether different words, situations, or actions mean the same thing. Do not confuse your user — keep words and actions consistent. Use “The Principle of Least Surprise.”
5. Error Prevention
Users hate errors, and even more they hate to redo the same action from scratch.
Prevent user errors by user-testing the interface to identify problem areas for typical users and re-designing it to more clearly communicate the consequences of users’ actions. When deleting information that may be difficult to recreate, offer users a confirmation to delete the data. Additionally, provide the ability to Undo actions that users could accidentally commit and, consequently, lose important information.
Here are some useful functionalities that will help with error prevention:
- Automatic detection of errors
- Clear error notifications
- Hints for solving the problem
6. Recognition over recall
As Nielsen says, recognizing something is easier than remembering it. Minimize the user’s memory load by presenting familiar icons, actions, and options whenever possible. Do not require the user to recall information from one screen to another. Use mouse-over tool tips to describe the functionality of icons which may be unfamiliar.
Example: On a web form, allow easy access to previously entered information, such as serial numbers, so the user does not need to recall the information or write it down.
7. Flexibility and Ease of Use
Novice and expert users use systems differently. The system should be easy and efficient to use by novices and experts alike. Provide 'accelerators' for expert users to more efficiently navigate your site to complete the most frequent tasks.
Example: An accelerator can be 'Search functionality' that allows the user to search for the requested content by using key words instead of scrolling.
8. Aesthetic and minimalist design
Avoid displaying excessive information and design elements, as they will visually compete with more relevant information on the screen.
Example: Background graphics can make viewing text difficult.
9. Support error recovery
Error messages should be expressed in plain language, precisely indicate the problem, and constructively suggest a solution.
10. Help and documentation
Even though it is better if the interface can be used without documentation, it may be necessary to provide help and documentation. Any help information should be easy to search and instructions should be easy to follow. It may be useful to provide video tutorials and examples for complex procedures or controls that are hard to locate.
Example:If on a webform there are a couple of fields that may be confusing to some users, it is appropriate to include “in-line help” of a link that opens a small help dialogue next to the form field. Alternatively, next to a form field text box or field label, provide users an example of how to input the information using the required formatting, such as entering a phone number as xxx-xxx-x.
Comments
Post a Comment