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 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
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
Image Credit - Autocar
Image Credit - Autocar
3. User control and freedom
“Users often perform actions by mistake. They need a clearly marked ‘emergency exit’ to leave the unwanted action without having to go through an extended process.”
Description
Many of us live in a world where we are time-poor. We have so many things to do with not enough time in which to do them.
Some actions may have little or no consequence, such as pressing the wrong character on a keyboard or hitting the wrong link on a website.
Others can have greater implications, such as sending an email too early or deleting important information.
We tend to do rush jobs and/or multi-task in an attempt to complete them faster than they should do. Subsequently, we are more likely to make mistakes.
In every interface, it is essential to be able to perform a graceful exit or remedial action. Having an ‘emergency exit’ permanently available reassures users that they remain in control, whatever may go wrong.
This is where the undo and redo buttons come into their own. They are an easy solution to return to a safe place, having found themselves in an uncomfortable or tricky situation.
In creative tools, such as Adobe Illustrator and Sketch, the ability to undo and redo gives designers greater freedom to explore ideas and ditch them if the result doesn’t match their vision.
The back button in browsers and cancel buttons on confirmation dialogues also provide the same confidence.
Dialogues can be frustrating though, and Google has implemented a more frictionless technique, which allows users to undo if there is a problem. If not, then the action is silently acknowledged.
How to achieve it
Have dedicated undo and redo functions available for previous interactions and easy return to the desired state
Enable a cancel function for ongoing processes or interactions
Ensure these functions are visible and labelled clearly
Examples
Undo delete
Undo/redo the last function or number of functions
Cancel a download
4. Consistency and standards
“Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform and industry conventions.”
Description
Consistency is fundamental to good UX design. It helps users learn and predict what’s going to happen.
It builds confidence from users in the things we create.
There are two types of consistency to be considered:
Internal consistency corresponds to consistency traits within the current product experiences, or family of product experiences (MS Office, Adobe CC).
External consistency, however, relates to conventions and stereotypes that have been seen that users may be familiar with elsewhere, i.e. from industry or product type.
Applying both types of consistency well can lead to increased levels of learnability and ease of use, while also reducing workload.
How to achieve it
Create and enforce a set of design rules or a style guide for all designers to follow.
Depending on the size of the project, consider more detailed pattern libraries (such as those for iOS and Android).
Include requirements for visual content, type behaviour and interaction, type of feedback and the style of language used.
Examples
Placement and execution of common elements such as product navigation and toolbars
Style guides for visual elements, behaviours and interactions
Conventional keyboard shortcuts such as Ctrl / Command Z for undo
5. Error prevention
“Good error messages are important, but the best designs carefully prevent problems from occurring in the first place. Either eliminate error-prone conditions, or check for them and present users with a confirmation option before they commit to the action.”
Description
People make mistakes all the time. It’s human nature!
There are two distinct types of error, which need to be accounted for:
Slips - Silly, unconscious errors that people make often when not paying attention. They intend to do one thing and end up doing another, often similar, action. Slips occur more frequently in expert users, as they divert less attention to what have now become automated tasks.
Mistakes - These are more conscious errors, which arise from users’ perceived expectations and mental models not mapping to the actual system behaviour.
If errors can happen, they will. So be prepared for them and design your system to try to eliminate them from happening in the first place.
When they do, help the user by providing clear and consistent feedback to diagnose and remedy the problem.
How to achieve it
Recognise where and why errors may happen
Use preventative measures, if the error cannot be eradicated
Where possible, erroneous actions should be reversible - implement an easy redo mechanism
Only highlight errors that have an impact on the user
Be supportive rather than critical, guiding the user along the correct path
Use affordances that people are familiar with
But don’t give feedback when not needed..
Examples
Constrained product selection when shopping
Reminder to attach a file to an email on sending
Shopping basket visualisation
Password entry guidelines
Spelling errors
Inline form feedback for errors
6. Recognition rather than recall
“Minimize the user's memory load by making elements, actions, and options visible. The user should not have to remember information from one part of the interface to another. Information required to use the design (e.g. field labels or menu items) should be visible or easily retrievable when needed.”
Description
There are two ways in which we access memory to retrieve information:
Recognition - occurs when a person or thing you see is instantly recognised as it is familiar and perhaps something we see frequently. We find this easy as it doesn't require much effort.
Recall - is when need to access less frequently, or rarely used pieces of information such as names or numbers, which may be locked deep in our memory bank. Accessing those deeper parts of our memory requires more cognitive effort and is more tiring.
It may be good for a quiz to ask open-ended questions that need us to open the vaults in the memory bank (vs multiple choice questions, which at least give you the key) but it’s not recommended for user interface design.
Good user interface design ensures that important content is easily discoverable and requires minimum cognitive effort.
How to achieve it
Information architecture and menu system that meets users expectations
Use visual cues to create an association to specific information
Display Inline feedback or contextual information as appropriate
Provide a help mechanism, particularly for more complex tasks
Limit content which the user needs to have memorised in the first place
Surface or make it easy to find content that has been viewed previously
Examples
Password entry hints and tips
Contextual text matching, such as finding the correct Rail station
Provide a help mechanism, particularly for more complex tasks
Recently clicked / viewed items
7. Flexibility and efficiency of use
“Shortcuts — hidden from novice users — may speed up the interaction for the expert user such that the design can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.”
Description
As users, we are all different. We have our own personal ways of doing things as well as when and how we do them, which are all based on levels of skill and experience as well as how we’ve been taught.
As designers, we need to cater for all types of user and ensure that the experience is intuitive and compelling for all of them at different times.
How to achieve it
Create memorable shortcuts for frequently-used functions, and/or complex tasks
Allow those shortcuts to be user-configurable by the user
Personalise the experience by tailoring content for the person viewing it
Contextually display content depending on what task is being completed
Offer ‘onboarding’ and ‘scaffolding’ to continually help users to improve and become more proficient and efficient
Examples
Provision of shortcuts, ideally customisable
Accelerators in Search Engines
Use of a help mechanism, particularly for more complex tasks
Scaffolding UX, which educates and informs users to know more
8. Aesthetic and minimalist design
“Interfaces should not contain information which is irrelevant or rarely needed. Every extra unit of information in an interface competes with the relevant units of information and diminishes their relative visibility.”
Description
There is often debate between UX and UI about what content should be shown, and how it should be represented.
The optimal resolution is finding the balance when any visual elements that are displayed either aid the usability and/or contribute a positive addition to the overall user experience. If it does neither, then it should be removed.
Removal of superfluous content allows the user to focus on the primary task and for any content that is shown to sing.
It’s also important to think about all types of users, some of whom may struggle with lots of colours (particularly striking) in a small space and small text.
How to achieve it
Only display content that adds something to the experience
This relates to static and dynamic elements
Apply white space to create focus on particularly important elements
Use colour to aid intuition as well as enhancing the aesthetic
Clear and bold calls to actions with intuitive labelling
Examples
Google Home Page
Android Auto
Air BnB website
Apple iOS
Spotify mobile application
9. Help users recognise, diagnose and recover from errors
“Error messages should be expressed in plain language (no error codes), precisely indicate the problem, and constructively suggest a solution.”
Description
Related to principle 5, if errors do occur, then the system should assist the user to demonstrate what has happened and what to do next. In plain and simple language with clear and concise instructions.
Users can more easily forgive when the error is recoverable and they understand exactly what is required of them.
How to achieve it
Recognise where and why errors may happen
Use preventative measures, if the error cannot be eradicated
Be useful and only highlight errors that have an impact on the user
Avoid jargon and use clear, concise language
Make it obvious what the solution is and what the user needs to do next
Only display when useful
Examples
Displaying excess characters while still allowing the user to edit
Forgot to attach file reminder
No email subject title reminder
10. Help and documentation
“It’s best if the system doesn’t need any additional explanation. However, it may be necessary to provide documentation to help users understand how to complete their tasks.”
Description
The best systems don’t need a manual or quick start guide to allow us to operate them.
However, there are situations where the provision of help content can facilitate the user to have an enhanced experience and have a better understanding.
This help may be generic in first use experience, or contextual concerning a specific problem the user may encounter.
Content within the experience that is directly accessible may also be of assistance. These may come in the form of documents, videos or tutorials.
Any such content should be jargon-free, easy to read, correct and up to date.
How to achieve it
Consider an onboarding mechanism to introduce users to the experience
Use software updates to introduce new features and interactions
Have a search facility to allow the user to look for content
Implement contextually sensitive support to assist the user with the right information at the right time
Use machine learning to provide hints and tips to the user if they aren’t accessing key features or using the system efficiently (but be aware if this support is constantly dismissed)
Examples
Use of Augmented Reality
Integrated, onboarding sequence to aid set up and first use experience
Coachmarks support when using a new app, or there have been new additions and/or changes
Image Credit - Agentur Graustich
Now that you have an understanding of what Heuristics are, in Part 2 I shall look at what it takes to apply these in a UX evaluation.
Further Reading
Get in touch with the author
Darren Wilson, Managing Director at UXcentric
darren@uxcentric.co.uk
07854 781 908
cisco distribution switch price from Cisco act as the power sources in your digital Internet of Things (IoT) landscape. They provide the energy needed to fuel the interconnected devices that make up your IoT ecosystem.