Unlimited WordPress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. UX

8 Usability Heuristics (Explained With Toasters)

Read Time: 5 mins

Today I have something really fun planned; we’re going to be looking at a toaster in so much more detail than you’ve ever looked at a toaster before! In doing so we’re going to go over 8 usability heuristics (in other words principles or rules) that are at the centre of good UX and interactivity design.

UI/UX Kits on Envato Elements

Before we dive in let me quickly tell you about Envato Elements; a library of creative assets all ready to use with simple commercial licensing. You’ll get unlimited access to UI kits, web templates, fonts, and other useful stuff for any designer.

Envato Elements is free for 7 days, no commitment. If you don't love it, cancel any time during your free trial and you won’t be charged.

Envato Elements free 7 day trailEnvato Elements free 7 day trailEnvato Elements free 7 day trail

8 Usability Heuristics

These usability heuristics were famously proposed by Jakob Nielsen almost 30 years ago. Let’s evaluate a toaster against these interaction principles and see how it fares.

1. Visibility of Status

This is all about keeping the user informed about what’s going on, in a clear and timely manner. In the case of this toaster, what might a user care about? They’d likely want to know whether the toast is actually toasting, and maybe when it’s going to be done.

We can see, when we press the lever down, that it stays down and that the coils within the toaster glow orange and begin to heat up.

glowing coilsglowing coilsglowing coils

In terms of addressing “when will the toast be done?” this toaster doesn’t actually do too well. Some models have a dial which works like a timer, going back to zero as time goes by, showing the user how much time is remaining. This attention to detail in interactive design can vastly improve the user experience.

2. System vs. Real World

Often this is talked about in terms of user interfaces, where we’re not actually talking about a physical product, but describing things in a design which mimic the physical world. A button, for example, which appears to be raised, as though it can be depressed.

We can actually talk about a couple of aspects of our toaster’s interactive design to which this applies. For example, when we press the lever down, the bread drops down with it, mimicking our movement.

depressing the lever on the toasterdepressing the lever on the toasterdepressing the lever on the toaster

3. User Control and Freedom

People often do things by mistake, so it’s important that the design allows users to undo an action or back out of something that is unwanted or unintended. My toaster gets an A+ in this category as it has a cancel button, super clear, right where you‘d expect to find it. So if I decide I’d prefer to use a different kind of bread, or I want to end the process early, I can.

cancel buttoncancel buttoncancel button

4. Consistency and Standards

People shouldn’t have to learn something new if it’s not absolutely necessary, so good UX follows industry and platform standards and doesn’t try to reinvent the wheel.

My toaster follows standards really well, but this one..not so much:

non-standard toaster uxnon-standard toaster uxnon-standard toaster ux

While the touch screen may seem cool at first, it’s likely less user-friendly. Users aren’t accustomed to interfacing with a touch screen in the context of toasting bread. I’ve used a toaster like this before and I remember I wasn’t looking for this tiny little start button—it took me a long time to figure out how to use it!

5. Error Prevention

Have you ever put your bread in a toaster, pushed down the lever, only to have it pop right back up? And then again? It probably didn’t take you very long to work out why: the toaster wasn’t plugged in! Instead of allowing you to walk away, thinking that your bread was toasting, the machine is designed to not let you do that, helping you avoid such a time-waisting error.

6. Recognition Rather Than Recall

Users shouldn’t have to remember something from one part of an interface to another. Clearly labelled buttons really help with this, and my toaster chooses descriptive labels rather than cryptic icons to show users what’s going on.

clear labelsclear labelsclear labels

7. Flexibility and Efficiency of Use

This is a big one. No two people are the same, so it’s important that designs are flexible and allow for customization and personalization. This is important for toasters because everyone has their own preference for how dark they like their bread toasted.

If I asked you to look at this dial and describe how many options users have for determining how dark they’d like their toast you’d probably say “seven”. But there’s actually infinite choices on offer here! The dial doesn’t just click from 3, to 4, to 5—you can set it in the middle, or just a hair past a whole number if you so choose. The options are endless, and this really matters! A win for the flexible dial.

labels on the diallabels on the diallabels on the dial

8. Aesthetic and Minimalistic Design

Okay, last one. Good user interfaces don’t contain information that’s irrelevant or rarely needed. They prioritize the essential, showing only what’s needed to help the user achieve their goal. This is the very definition of minimalistic design.

This toaster’s great because it’s fairly simple. We have extra options for bagel, defrost, and reheat. In my opinion reheat might not be totally necessary, but maybe some users need it.

The toaster shown below, however, goes a bit overboard. It has options for bread, bagel, waffle, English muffin, pastry.. In my opinion this is an example of too much, and could overwhelm the user.

too many optionstoo many optionstoo many options

Toast’s Done!

That’s it for our usability evaluation of this toaster, overall I give it an A minus. I really hope I have given you a good baseline understanding of these 8 usability heuristics, don’t forget to check out Envato Elements and subscribe to the Tuts+ Youtube channel!

More UX Fundamentals

Stay tuned for more UX fundamentals, and let us know in the Youtube comments what you’d like to learn next!

Advertisement
Did you find this post useful?
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.