The A to Z of UX - H is for Heuristics - Part 1: 10 UX principles to assess user interface design

Darren Wilson



Heuristics are a well established and accepted list of UX principles used to assess how well a user interface has been designed for its intended purpose.


“They are called ‘heuristics’ because they are broad rules of thumb and not specific usability guidelines.”

They have been in use for many years by UX practitioners and were more formally authored in the ‘90s by Jakob Nielsen and Rolf Milich. They have been recently updated with minor changes and are as relevant now as they were then.



A heuristic evaluation is what happens when an expert, or set of experts, reviews a product, with the likely result being a list of usability issues that need to be addressed.


Such an evaluation should support, rather than replace, user testing as part of the Human-Centred Design process.


Both are equally important and each will unearth crucial information for the UX designer and product owner.



An expert review can follow a heuristic evaluation, where heuristics have already been established. As a result, expert reviews may be less formal than a heuristic evaluation.



There are 10 guiding principles to consider when either when designing a new, or assessing an established user interface.



1. Visibility of system status

“The design should always keep users informed about what is going on, through appropriate feedback within a reasonable amount of time.”

Description


People like to be aware of what is happening so they can take control and make informed decisions. More and more, they expect this status content to be immediate and up to date.


Knowledge of system status is particularly important following a user action so that the feedback loop can be closed.


As humans, we have less patience for latency than ever before. However, communicating clearly and transparently will build trust and confidence in the user.


Being consistent with this strategy, creating predictable outcomes will further enrich the sense of trust.


‘Visibility’ is a red herring, in that feedback could, and should, be provided via different sensory channels. So it can be felt, heard and/or seen by the user.


How to achieve it

  • Provide clear and concise information to the user regarding system status.

  • This can be done visually (an icon and/or text), audibly or through haptics .

  • To improve accessibility, several feedback strategies may be applied.

  • Eliminate system latency and let the user know if an activity is in progress.


Examples

  • Loading content or downloading a file

  • Storage full

  • Sent email confirmation swoosh

  • Button press (graphical, haptic, audible)

  • Empty list or shopping basket

  • Mobile notification icons / battery / Wi-Fi signal



iPad desktop with app notification feedback, app install progress and core system information
iPad desktop with app notification feedback, app install progress and core system information


Money supermarket add a little humour and a human touch to indicate status and prevent abandonment by stipulating that the hard bit is over and done with, while displaying the completion state percentage
Money supermarket add a little humour and a human touch to indicate completion state and prevent abandonment



2. Match between system and the real world

“The design should speak the users' language. Use words, phrases, and concepts familiar to the user, rather than internal jargon. Follow real-world conventions, making information appear in a natural and logical order.”


Description


When people interact with a system, particularly for the first time, they will have preconceptions of how it might work based on previous experiences and knowledge of other systems.


By hooking on to those previous experiences and associated familiarities, it’s possible to increase the usability of the interface you are designing for.


Implementing strategies and stereotypes the user will recognise from previous experience, will also aid the user in understanding what they need to do next.


When control behaviour aligns to the user expectations - known as natural mapping - it becomes easier to learn and remember for the next time.


The very essence of Human-Centred Design is that the human is at the core of what we are designing. As designers, we need to understand that things which seem perfectly intuitive for us, may not be for our users.


Terms, phrases, icons, interactions and sounds should be familiar to the user to increase learnability.


Using jargon, acronyms and abbreviations that are ambiguous and confusing should be avoided. Clear, concise terminology should be used instead. This increases confidence and the user will feel good as a result.


How to achieve it

  • Use language that users understand and do not require a dictionary or voice assistant.

  • Don’t make assumptions that content and behaviour you find intuitive will be automatically understood by your users.

  • Carry out user research to better understand your users and what they find familiar.

  • Perform competitor analysis to understand stereotypes that users may be familiar with. But don’t replicate it if it’s not intuitive.


Examples

  • Vehicle Seat / Climate controls (digital or analogue)

  • Oven hob controls (matching the spatial position of hob burners)

  • Use of skeuomorphism for digital controls and functions such as the computer trash can


Bentley Continental Seat Positioning Controls that map to the physical structure of the seat
Bentley Continental Seat Positioning Controls, which map to physical seat structure

Image Credit - Autocar


Volvo XC60 Digital Climate Controls that have a graphic of a human to indicate where air will flow to
Volvo XC60 Digital Climate Controls, which map air flow to the human body

Image Credit - Autocar


iOS storage area for deleted content, which looks like a waste paper bin, and also has separate graphical states whether it is empty, or not
iOS icon for deleted content looks like a waste paper bin, and has different graphics whether it is empty or not


3. User control and freedom

“Users often perform actions by mistake. They need a clearly marked ‘emergency exit’ to leave the unwanted actio