Actually, the basics are not hard to learn, many even call it methodical appliance of common sense. The rules and principles introduced in this article are no shortcut to a perfect design, but if you follow them your new website, mobile app or giant-sized excavator should be easy to use. Consciously or sub-consciously, these rules are part of everyday work for all user experience designers.
The Eight Golden Rules of Interface Design
Based upon Ben Shneiderman’s Designing the User Interface (1987) and Jacob Nielsen’s Ten Usability Heuristics (1995), I have listed The Eight Golden Rules of Interface design (in Shneiderman’s original order) adding my own insight as to how they affect web and application design today.
1. Strive for consistency
In other words, use all elements across your site or application consistently. For example a certain style of button should always do the same thing; the same kind of selection element should be used for the same functionality, and navigation should function logically, going deeper in hierarchy, not jumping to different sections. (I will return to this.)
You should also consider that if there are well-known user experience design conventions for your chosen platform, then it just might be wiser to follow them, instead of creating your own, no matter how brilliant. (Games make a notable exception, but then you should follow game design conventions instead of platform conventions.)
2. Enable frequent users to use shortcuts
Quick links are good on an information-heavy site. Not all users use the web alike and all content owners consider their own bits the most important on any given site. Instead of crippling the logical navigation structure with too many main level items, create a quick links element for those most often used pages. You can even personalize these links to suit different users and user groups.
3. Offer informative feedback (Shneiderman), Match between system and the real world & Visibility of system status (Nielsen)
Don’t keep the users guessing; tell the user what’s happening. Don’t use system language to describe what the system is doing. Instead, tell the user clearly and plainly what’s happening both on the background and when they perform an action. For example, show the progress on multi-page processes and indicate where in the navigation the user is when they arrive to a new page.
4. Design dialog to yield closure
Again, the less the users have to guess the better. When a purchase process is finished, remember to display a “Thank you” message. Let the user know that she has done all that’s needed, the purchase order is now in the system and she can navigate elsewhere on the site with ease of mind.
5. Offer simple error handling (Shneiderman), Error Prevention (Nielsen)
Users hate errors, and even more so hate the feeling that they themselves have done something wrong. You can help them overcome these situations as fast and easily as possible. For example, don’t make the user start from the beginning or clear all form contents when they make an error in one field.
Or better yet, prevent the possibility of user errors altogether by validating input before submitting and then, following to the third rule, offer informative feedback. Do not offer dynamic links to pages without content (e.g. empty search results).
6. Permit easy reversal of actions, User Control and Freedom (Nielsen)
Shneiderman puts it nicely “This feature relieves anxiety, since the user knows that errors can be undone; it thus encourages exploration of unfamiliar options.”
In applications this refers to the undo functionality, but on the web it could mean for example that removing items from shopping cart should not require going to another page. Of course the same goes both ways: if the user removes something by mistake, it would be nice to have a list of recently removed items for easy re-adding.
7. Support internal locus of control
The user wants to be in control, and trust that the system behaves as expected. It could be even said that users don’t like surprises – at least when they break the consistency of functionality on the site.
One of my biggest pet peeves is when the designer breaks this rule by creating a navigation that instead of adhering to the site hierarchy throws the user unexpectedly to different sub-sections or even worse, different sites. (I told you I was going to return to this.)
8. Reduce short-term memory load (Shneiderman), Recognition rather than recall (Nielsen)
As Nielsen says, recognizing something is easier than remembering it. Use iconography and other visual aids such as themed coloring and consistent placement of items to help the returning users find the functionalities.
In multi-step processes, keep the important information from previous steps visible throughout the process so the user does not have to think and recheck what selections she made in previous steps before she proceeds.
In navigation, users can easily remember four different choices and with minimal effort up to seven or eight. Anything more and most users have to read and re-read the navigation to find what they were looking for.
A bonus: Fitts’ Law – more than a rule, it’s the law
An even older scientific principle for design is Fitts’ Law, proposed by Paul Fitts in 1954. It deals with rapid movement of pointing devices and the size of the target, basically mouse movement or fingers on a touch device. The longer the distance and the faster the movement, the larger the size of the target should be.
In practice Fitts’ Law dictates that elements that are assumedly used after each other should be close together. (At least as long as Shneiderman’s first rule of consistency is not broken by putting the same element in overly different places on different pages.) If you have to put them on different sides of the screen, consider their size.
Breakin’ the law
Only once you know the rules by heart, can you consider breaking them. And, if you actually do decide to break the rules, you should be aware of the repercussions your choices have on your users.
The one guideline I try not to break comes from combining the first and seventh rules of Shneiderman: user interfaces should function consistently and predictably.
