Trusted answers to developer questions
Trusted Answers to Developer Questions

Related Tags

ui/ux

What are Nielsen's Usability Heuristics?

All-In-N

1. Visibility of system status

The first of Nielsen’s 10 Usability Heuristics, this heuristic refers to how well the state of the system is conveyed to the user.
Appropriate and timely feedback to the user increases the user’s trust in the system. For example, consider a button on a webpage. If a user does not know that a button has been clicked, they may click on button repeatedly unless they receive a cue indicating that it has already been clicked. This cue could be a color change, an audio playing, or both.

2. Match between system and real-world

Nielsen’s second heuristic stresses the importance of using language and concepts that are familiar to the user. Since familiarity induces comfort in users, this second heuristic makes the system easy to learn; thus, making the user’s experience with the system more enjoyable. Having said that, it is important to always keep in mind the user’s understanding of the language and/or concepts used in the system design. This understanding will not always be the same as yours. So, proper user research must be done to understand the user.

An example of using familiar concepts is the use of red color for errors and warnings. Because we humans are accustomed to seeing red colored signals for alarms in the real world, the mapping of red to “warning” or “danger” is natural and easily learned. This is why, “Warning!” seems much more alarming than, “Warning!”, even though both say the same thing.

3. User control and freedom

The ability to cancel or undo actions gives humans the confidence to further explore a system, which increases their trust in it. It also keeps users from getting stuck in an unwanted state or feeling frustrated.
There are several controls (like undo and close) that allow users to move back to a previous system state.
However, it is important that:

  1. The result of using any of these controls meets the user’s expectations. For example, a user who clicks on the back link of a webpage would expect to return at the webpage they arrived from.
  2. Using the browser/phone’s inbuilt controls, instead of the links in the webpage/app, does not result in an unexpected action.

4. Consistency and standards

The fourth heuristic is a guide to making easy and learnable systems.
Users, on a daily basis, interact with a number of systems that operate under some set standards and conventions.

Imagine clicking on the Home button and not landing on the home page.

When different words and phrases are used for similar situations, it can disturb the prior set mental models of the users. It is also important to maintain consistency in the layout of the webpage or the mobile application. For example, in an online shopping site, users would expect the shopping cart icon to be in the top right corner because that is the industry standard; therefore, placing it elsewhere would increase the user’s cognitive load and result in frustration.
To ensure that industry standards and conventions are met, big companies often allow their designers and developers to use design systems, like material.io, and reuse design components and patterns.

5. Error prevention

Nielsen’s fifth heuristic for usability stresses that the system design, not the user, is to blame for errors that occur when the system is in use.
There are some general guidelines to prevent errors, both conscious and unconscious. These are:

  1. Do not assume that the user’s mental model aligns with yours.
  2. Include helpful constraints. In situations where there are clear rules that define the acceptable input, it is often good to restrain the user to only valid inputs.
  3. Offer Suggestions. In most cases, offering contextual suggestions greatly reduces the possibility of an error.
  4. Choose good default values. This is another way to offer helpful suggestions, especially when the task is repetitive.
  5. Use a forgiving format. Expecting the user to enter information in a very strict format can often lead to errors. Instead, allow input in a format that is easily scannable for humans, and process it into the required format in the backend.

6. Recognition rather than recall

It is important to minimize the user’s memory load when using an interface. For this purpose, contextual visual cues should be used to help the user navigate the system. Having context appropriate cues reduces the need for the user to recall something from memory, thus reducing the overall cognitive load. An example of this is the suggested and recently viewed items in the personalized homepages for most online shopping sites.

7. Flexibility and efficiency of use

Novice and expert users of a system have different needs. Expert users often prefer shortcuts that novice users would consider complicated. For instance, consider the keyboard shortcuts for the ‘select text’ command. An expert user would find it much more time efficient than selecting the text using their mouse. However, a novice user might find the shortcut difficult to remember and would prefer an alternate method.
To make the system flexible and efficient for different types of users you can have:

  1. Multiple methods to accomplish the same task according to user preference.
  2. Accelerators, like keyboard shortcuts, hidden from inexperienced users that speed up the process for advanced users.

8. Aesthetic and minimalistic design

Imagine going to a website for a specific book and getting bombarded with a thousand others that do not align with your interest. Such a situation may force the user to go to other platforms that show them what they are looking for by asking them for their interests and customizing accordingly.
Aesthetic and minimalistic interfaces only show relevant information, and they make use of negative space to maximize the importance of available content. Most websites with minimal interfaces keep their homepage as simple as possible so that users can immediately see what is going on.

Minimalism is the act of showing elements based on their relevance to a specific section of a system.

9. Help users recognize, diagnose, and recover from errors

The occurrence of errors stops the flow of action, often causing users to leave if the errors are not fixed in a timely manner.
We already discussed in heuristic #5 that it is important to prevent errors from happening in the first place with error prevention techniques, but this does not completely stop the occurrence of errors as, even in a system with very good error prevention mechanisms, users can make mistakes. Therefore, is the designer’s responsibility to create easily comprehendible error messages and easy guidelines to help users recover from the mistakes.
Good error messages are politely phrased and do not blame the users for making mistakes; instead, they assure them that it was the system that ran into problems. Good error messages also include constructive advice on how to resolve them. For instance, “refresh the page”.

10 Help and documentation

Ideally, a website should be usable without any help or documentation, but when users run into unwanted problems there should be a way out. This is why clear documentation, that is easy to discover, helps users. However, it is not just beginners who need help and documentation; with new features and updates, every expert also becomes a beginner who will need help to understand. Help and documentation can show up in in various forms such as FAQ’s, Videos, Chatbots, help center numbers, etc.

RELATED TAGS

ui/ux
RELATED COURSES

View all Courses

Keep Exploring