HCI - Heuristics Flashcards
Visibility of System Status
Keeping users informed of what is happening on their device or with their UI.
E.g. loading bar, wifi symbol, battery life tracker.
Match Between the System and the Real World
Making sure that information is relayed in a logical order and in a language/way the user will understand.
E.g. familiar concepts. A shopping cart icon when purchasing items on a website is useful because match a cart with shopping.
User Control and Freedom
This heuristic states that a user should have a clear marker, button or way to go back, undo or redo their action. Users having control of certain aspects of the interface like filters when searching is also quite helpful.
E.g. wanting to go back to the previous page, accidentally deleting something.
Consistency and Standards
Staying consistent with your UI design so that users can easily navigate your site. Following basic internal and external consistency design standards.
E.g. users shouldn’t have to question simple aspects of your site like: “is this a link?” or “is this a button?”.
Error Prevention
This heuristic states that users often make two forms of errors, Slips and Mistakes. Error prevention is about guiding the user to help prevent them from making these errors and it’s about designing your UI in a way that is clear to the user so they don’t make mistakes.
E.g.
Offering suggestions (like Google when typing), helpful constraints and restrictions to help prevent slips. Using confirmation pop ups for when the user accidentally clicks the wrong thing.
Using design choices the user will understand so that they don’t make mistakes. Understanding the users possible expectations.
Recognition Rather Than Recall
This heuristic states that you should minimise the user’s memory load by using minimalist designs, not cluttering your UI with unnecessary info or objects. Users should be able to easily recognise what an element is instead of having to try and remember it.
The user also shouldn’t have to remember one part of dialogue from a previous section if it’s being used in an upcoming section as well.
Helpful info like instructions should be visible, easily found and easily retrievable when necessary.
E.g. users immediately know which button to press at an elevator to go where they need because they recognise the physical appearance of the buttons.
Flexibility and Efficiency of Use
Giving more experienced users the ability/option to be more efficient by using accelerators (shortcuts).
E.g. keyboard shortcuts/commands (CTRL + z = undo), macros, app accelerators.
Also: “recent documents” in word and Google drive. A search engine suggesting what you might be searching for and or giving you FAQs.
Aesthetic and Minimalist Design
This heuristic states that you shouldn’t unnecessarily clutter up designs, products and dialogue which can confuse the user.
E.g. old TV remotes having heaps of unused buttons compared to newer TV remotes that have a few buttons and a menu on the TV screen which you cycle through with the buttons.
Help Users Recognise, Diagnose, and Recover From Errors
This heuristic states that you should clearly inform users when they’ve made an error or when an error has occurred. Inform them what the error is and offer them a solution to the error.
E.g. after sending an email, Gmail gives you a temporary option to unsend the email. When something lags out a page on a site, the browser tells the user that the page is unresponsive and suggests either waiting for the page to respond or reloading the page.
Help and Documentation
Help and Documentation States that it’s better if a system can be used without documentation. However, you should provide help in areas that users might find useful.
E.g. sites, apps or browsers predicting what you might be searching for and suggesting FAQs. Having popovers that you can click to search for something in the field you’re looking in when you’re typing into an input box.
