Pine
AdobeStock 296039214

10 Usability Heuristics for User Interface Design You Should Know + Examples

Some like to call them rules, others laws, some observe them just as manners, or just a broad usability guide, but these 10 Nielsen Norman Usability Heuristics may just make or break your product.

Usability Heuristic #1: Visibility of System Status

1

This principle suggests that the system design should keep users informed about the outcomes of their interactions, with appropriate feedback in a reasonable timely manner. Thus empowering users to predict and plan their next steps. It’s this continuous communication between system and user that gives them a sense of control and ultimately helps create a sense of trust with your brand. 

Example – When you’re making a payment online, most systems usually give you feedback on how long it may take for the payment to go through, and also when you’re payment has gone through. 

Usability Heuristic #2: Match Between System & Real World

2

A user’s previous digital and real-world physical experiences shape their mental model of technology. So this principle states that for you’re system to succeed, it should first speak the language of your users, making use of familiar terms, words and phrases, not system jargon. Secondly, its design should follow real-world conventions, with information appearing in a natural and logical order. 

Tip: To acquire these insights, you should conduct thorough user research, so you build based on user reality, not personal assumptions. 

Example: You can look through the photo album on your digital device by swiping, an action very similar to the flicking through the physical version. The icon and terms used are also universal and straightforward, so users can favourite, share and delete images with little to no thought. 

Usability Heuristic #3: User Control & Freedom

3

This principle states that users sometimes select a state by accident, so to succeed, your system should provide them with a way to undo their actions, or “emergency exit”, with speed and ease. Making it easy for users to undo or redo an action creates a strong sense of control and freedom, giving users an excellent experience using your product.

Tip: Make sure all “emergency exits” are easy to find with appropriate labelling.  

Example: You’re browsing through your photos and accidentally tap the delete icon, but instead of removing your image directly, the system yields a pop-up notification to confirm the action before it goes through. 

Usability Heuristic #4: Consistency & Standards

4

Jakob’s law states that “People spend most of their time on websites other than yours”. So to reduce the cognitive load on users, your UI should be consistent and follow certain existing standards, ensuring predictability and learnability. 

Tips: Check out Apple‘s Human Interface Guidelines and Google‘s Material Design Guidelines are worth a read before you finalise a design system for your app. 

Example: The interface on cameras of mobile phone devices is consistent and standardised across the major players, from iPhone, Samsung or Huawei. 

Usability Heuristic #5: Error Prevention

5

Slips and mistakes are the two errors that are commonly made by people when using a product. when A slip error is caused by unconscious interaction, while a mistake is when there is a conscious error – a mismatch between your users’ intention and the design. According to this principle, the best-designed systems prevent errors from occurring, as opposed to providing notifications and messages after they’re done. 

Tips: To prevent them from happening, either eliminate error-prone conditions, especially the ones whose actions can be detrimental to the UX. Or alternatively, check them and give users the option to reverse before committing to the action.

Example: When you press the download button on the AppStore, you get a notification to confirm the download before it begins, and can cancel the download by pressing the centre of the circular download status indicator. On the Play Store, instead of notification before the download begins, you get the chance to stop the download by clicking the “X” button.


Usability Heuristic #6: Recognition Rather Than Recall

6

This principle suggests your interface design should display sufficient context-based help and make essential elements visible, easily accessible and retrievable, to promote recognition over recall, thus minimising the memory load on users and enhancing the overall experience.

Tip: Replace the long tutorials which force users to memorise, with context based-help that promotes recall. 

Example: The auto-suggest function on Google allows us to find what we are looking for, without having to engage our memory to recall the exact query/phrase.


Usability Heuristic #7: Flexibility & Efficiency of Use

7

According to this principle, flexible processes allow a user to carry out an activity in different ways, giving them the liberty to pick which method works best for them. Shortcuts are a way to speed up the interaction of the users; experts will know what shortcuts to use, while novice users will follow the script. Allowing for these tailored actions increases the desirability of your product for both groups of users.

Tip: Add tools, functionalities, features and accelerators to help users customise and tailor the overall user experience, and perform tasks more efficiently. 

Examples:  Most mobile devices utilise the buttons on their phones as a shortcut to accessing specific functionalities. On iPhone users can adjust their settings to personalise what the side button acts as a shortcut for. For most android devices, double-clicking the side button opens up the camera. In the case of Huawei, it’s the volume down button and the power button for Samsung.

Usability Heuristic #8: Aesthetic & Minimalist Design

8

Every bit of irrelevant information displayed on a user interface diminishes the visibility of anything relevant and important need to carry out a specific task. According to this principle, designers should aim to declutter, making sure the visual design focused on elements that facilitate the primary goals of users and removing unnecessary distractions. 

Tip: You have to strip your interface completely, prioritise what’s essential in the context of a user’s primary goal. 

Example: You have two examples of a payment system in the graphic above. The interface on the left-hand side has an abundance of unnecessary visual elements which are overwhelming and distracting. The interface on the right only displays relevant fields the user needs to complete the primary goal of making a payment. 

Usability Heuristic #9: Help Users Recognize, Diagnose, & Recover 

9

According to this principle, error messages should be easy to understand, recognisable, provide a precise indication of the problem, while also suggesting a route to potential solutions. 

Tip: Use simple language that is easy to understand and avoid using error codes or unnecessary characters that confuse. Also, if you want to make the message stand out, use visual aids like bold text, images and exclamation marks.

Example: The graphic above shows two interfaces at a password reset screen. The error message on the right is noticeable, easy to understand, gives users multiple routes to correct the error, from the option to reset their pin or to try again. 

Usability Heuristic #10: Help & Documentation

10

A well-designed system shouldn’t require any additional explanation; however, this principle states that in some situations, users may need extra help and documentation to execute specific actions. This type of information should be easy to search, focused on the task and concise.  

Tip – Display each of the concrete steps your user will need to complete a task as a list, making it easy to navigate and understand. All the points you include should take into account the pain points, emotions and context in which the person will use them. 

Example: You’re using your phone’s camera to scan a barcode of a product, instead of having to navigate elsewhere, you can access it tapping the ellipsis and clicking on the help button. 

End Note:

These usability principles aren’t guidelines, but some simple rule of thumbs which you can easily utilise to design interfaces and systems within your product that deliver a more memorable and enjoyable user experience overall.

Laura Brazay

Digital branding specialist with experience in social media strategy, and a background in Business Administration, who sees life in the full spectrum of colours. I spend my free time taking long walks exploring the city with my pup.

Add comment