Principles of UX Design
My disclaimer is that the “current state” of things depends very much upon each individuals’ perspective. As an “ever aspiring UX designer”, my mode of learning ebbs and flows and weaves in and out of material. As an abstract/creative and not a linear/sequential, I’ve found Medium to be a wonderful place for me to collect my thoughts on a subject. This particular musing has to be about design principles and, though there are many — has to be specifically on… usability.
All the Rage
A gentleman by the name Jakob Nielsen, with the help of Rolf Molich, developed a set of usability principles nearly thirty years ago. Nielsen later solidified them into what is now known as the 10 Usability Heuristics for User Interface Design. The history and back story is beautifully available elsewhere. I wanted to dissect the 10 myself, here and now, for you and for me.
Now, I know there are other design principles categorized and associated with UX design, you know them: spacing, alignment, color, yadda-yadda-yadda, and on and on. They are all so very relevant here, now, and elsewhere; but, what I like about Nielsen’s 10 is they provide a measure that is so much more than just other rules, principles, or guidelines within UX Design.
A Measure
Design is not binary but the on and off, ‘if applies’, ‘doesn’t apply’, consistent with other UX design principles seem to me as only a preface to applying Nielsen’s 10 within the heading-to-launch process. Yet, we know that Nielsen’s 10 are not the sole deliverer of success but rather, they offer a poignant prelude to that very potential. As you know, we all agree that the ultimate measure is the sheer number in user-adoptability a.k.a virality. But, we also love and enjoy every step and measure of design because it offers relevance and reliability toward an otherwise unpredictable shoot for customer acceptance.
Applying the principles gets us heading in the right direction. So…
Onward We Must Go!
The Name Itself
Although together they are known as the “10 Usability Heuristics for User Interface Design”, each is a principle that is rich enough to stand on its own. But being introduced to the set can seem complicated if you don’t know what the word Heuristics means. Well, Wikipedia says that…
A heuristic technique, or a heuristic, which is Ancient Greek for ‘I find, discover’, is any approach to problem-solving or self-discovery that employs a practical method that is not guaranteed to be optimal, perfect, or rational, but is nevertheless sufficient for reaching an immediate, short-term goal. Where finding an optimal solution is impossible or impractical, heuristic methods can be used to speed up the process of finding a satisfactory solution. Heuristics can be mental shortcuts that ease the cognitive load of making a decision.
Examples that employ heuristics include using trial and error, a rule of thumb or an educated guess.
In short, using the word ‘heuristics’ is a way of declaring that there is no one-size-fits-all solution. UX Design and Interaction Design is not an exact science but can come really close when all the practical methods which have been developed over the years are applied. Principles, such as Nielsen’s 10, are not some set of hard-and-fast rules but they certainly are, like others, helpful and beneficial.
Nielsen’s 1st of 10 “Visibility of System Status”
I like to think of this first ‘heuristic’ as the… “what is going on?” principle. In everyday life, you can hear the car engine running, you can feel the train moving, and see the microwave display counting down. Life’s products have conditioned us extremely well. We have been conditioned to have an expectation. A wanting to know that something is happening is a deep-rooted demand we have developed; it’s become a need!
I personally enjoy status bars; they engage me as if I am watching a race. I dislike those rotating symbols that merely informs something is happening but refuses to indicate when it started or whence it will end.
Aurora Harley provides this definition:
“The visibility of system status refers to how well the state of the system is conveyed to its users. Ideally, systems should always keep users informed about what is going on, through appropriate feedback within reasonable time.”
How ‘well’ suggests a linear scale or range of informing. Its a measure :-)
Yet we are left to consider what constitutes being ‘within reasonable time’…?
Luckily for us, Mr. Nieslen has much more to share with the world…!
And we thank him!
Nielsen’s 2nd of 10 “Match System with Real World”
Like number 1, the 2nd heuristic is easy to understand and offers a gift of clarity to which we already should be aware. Just in case you might find this list of heuristic more like rules, I care to cue another wonderful article by our beloved guru, but please return:
A Principle for the User
Nielsen’s 2nd heuristic principle states:
The system should speak the users’ language, with words, phrases, and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.
This principle is in place not because of a characteristic or expectation of the user, as in the first principle, but because designers can potentially fall into the pitfall of designing for themselves. This is a big No-No! This is explained very well in another one of the Nielsen Norman Group’s wonderful articles titled — “You are Not the User”.
Nielsen’s 3rd of 10 “User Control and Freedom”
It may sound obvious that users should be given control, and it is — obvious. However, in the light of providing some great experience, we as designers ought to remember that the user will want to feel in control. Nothing generates greater frustration in life than feeling a loss of control.
This perhaps does not come intuitively to designers because of the excitement we are hoping and expecting our designs to create. Why is this so difficult to understand that a principle must be coined? Well, its because not all designed experiences in life yield to this principle. For example…
Recall the last time you were on a roller-coaster. As you neared the top of the big plummet, the excitement of what was going to happen — you were about to go over the edge and it felt inevitable. For every child, or adult, who has ever gotten to that point and wished they could stop the ride and throw it into reverse there is the 3rd heuristic principle. The acceptance and thrill that comes in many other aspects of life and enjoyment just doesn’t have a place in the digital space. Although some of life’s events do happen the way rollercoasters do and feature similar social constructs that seemingly prevent derailment, the use of technology is more intimate and more individualized. Experiencing a new app is not a group event. Stopping the roller-coaster that everyone else is also on and have waited in line for has social ramifications, but an app plays by different rules. So, as designers, it is incumbent to provide the user with all the navigation and control options we can and that they, as user, have come to expect.
Nielsen’s 4th of 10 “Consistency and Standards”
Every designer wants their design to be a star even if they are just going for simplicity or minimalism. The accolade for good design drives innovation and a deep-seated desire to develop the unique. But the urge to create a star must be balanced with its intended user’s sense of familiarity.
Being unique and original must strick a balance with that which is common and familiar in order to reach the user where they are. By meeting them where they are, you can greet them at their spot of comfort only later to lull them into greater delight, see the 7th heuristic principle.
Great designs are almost entirely often defined by how well they accomplish getting their users to this spot of comfort.
Nielsen’s 5th of 10 “Error Prevention”
Careful design prevents problems from occurring in the first place. By coddling the interface with confirmation options, designers can create unnoticeable situations of ease where tedious error-prone conditions of data-entry and selection present themselves. Embedded stop-gaps can reduce the frustration of users often encountered when faced with completing difficult tasks. Numerous input fields on a single page pose the danger of having to search for where the misstep occurred. Error messages, clear instructions, and input validation can prevent needless page-scrolling and error-hunting.
In her article, Page Laubheimer, states that there are two types of errors: slips and mistakes. Slips, she characterizes as entering unintended text, misspelling some input, or inadvertently taking a step in the wrong direction. Mistakes, on the other hand, she suggests are not perhaps immediately recognized but rather happened upon because of some erroneous thinking on the part of the user. With such a deep path to explore in both directions, suffice it to say that our biggest bargaining chip towards user-acceptance is in an offering of a conquerer to these critical barriers which can come in the form of an error prevention strategy.
If you’re really good at designing for it…
No one will ever notice!
Nielsen’s 6th of 10 “Recognition rather than Recall”
While an exploration of how our minds work as it relates to memory could very well explain the need for the 6th principle, I’d much rather focus on the reward aspect that comes from both recognition and recall. Remembering a place, person, or thing, after some thought and effort have been put forth, can be very rewarding; perhaps, it is an example of delayed gratification.
Similarly, discerning between objects can also provide great satisfaction. The difference between the two is the effort exhausted. The 6th principle’s foundation is based on the ease of use. Like error proofing, good design that is easily recognizable in its delivery of function will not call attention to itself. And like the 4th heuristic principle, a familiarity not demanding of a discerning mental effort will gladly be more accepted over others less familiar.
Nielsen’s 7th of 10 “Flexibility and Efficiency of Use”
What we are dealing with are two types of users: the novice and the advanced. All novices are new and learning and we must design to make their learning experience seem as effortless as possible.
All advanced users were once novices and became advanced users once they had mastered the presentation. If we, as designers, do not offer another level of ease to delight these advanced users, their advanced familiarity will develop into a burden.
We can delight them with hidden shortcuts that will reward them for achieving their advanced status and familiarity.
Nielsen’s 8th of 10 “Aesthetic and Minimalist Design”
As suggested in our discourse of the 4th principle, every designer wants their design to be a unique star though they say they are focused on simplicity and minimalism. The realization that there is a prodigious fight for space and that every element is in dire competition for its life — pitted against its fellow elements, is a battle as designers we must calm. The ideal of bringing harmony to this battle for existence gives birth to an existential ideal of simplicity. Simplicity welcomes space and space is the offspring of minimalism. An uncrowded presentation shines on the user an unencumbered experience and therefore an unencumbered mind. We offer freedom to our users when we provide simplicity. Having room to grow and discover is a principle of nature and the ingredient required to thrive.
Nielsen’s 9th of 10 “Help the Recovery from Errors”
The 9th principle comes so late in the game. For if a designer will endeavor to strictly apply the principles of the 3rd and 5th order, namely the principles of — User Control and Freedom(3rd) and Error Prevention (5th), this 9th principle will have a contextually soft and clearly marked landing within the developer’s, as well as the designer’s, mind. To have users arrive at an error is an atrocity in the first right. But, to miss the opportunity to prepare for such a hard-fought-to-avoid condition seems 100% negligent. Be that as it may, there are occurrences that shamefully present themselves and as designers we out to have a clear plan to enable the user to recognize, diagnose, and recover from errors.
It is a fool of a designer who believes that the error is the fault of the user. Our effort is not for them to learn but to enjoy. And they cannot enjoy if their journey is rife with error messages. We must design paths for them over, around, through, and past such encumbrances.
Nielsen’s 10th of 10 “Help and Documentation”
The Alamo of user assistance is the help-documentation that is made available to the users. The requirement of this principle is well documented and accurately portrayed by the following excerpt from Mr. Nielsen’s article:
Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.
The realization that a presentation will be inadequate without a clearly marked path to the nth degree and an accompanying explanation for even the smallest of features should come as no easy burden to the designer. Truly, in designing it is quite valuable to see the end from the beginning. Being aware of and including a healthy respect for the need for help-documentation within the design process is the most efficient way to bring its development full-circle. Making all design efforts compatible with the interests and vision of users, and stakeholders alike, certainly require help-documentation that is intuitive and easily comprehended.
In Summary
Jakob Nielsen’s 10 general principles for interaction design are:
#01: Visibility of system status
#02: Match between system and the real world
#03: User control and freedom
#04: Consistency and standards
#05: Error prevention
#06: Recognition rather than recall
#07: Flexibility and efficiency of use
#08: Aesthetic and minimalist design
#09: Help users recognize and recover from errors
#10: Help and documentation
Associated Videos
The noble Nielsen Norman Group, ‘a UX research and consulting firm trusted by leading organizations worldwide to provide reliable guidance on user experience’ has provided 10 videos briefly describing each of Nielsen’s 10.
Cause
This article was motivated and created in conjunction with a discovery assignment given during an Helio Training UI/UX Design Bootcamp in 2020.
References
Images: Ruler Photo by Charles Deluvio / George Washington Crossing the Delaware / ‘1 gram’ created by the author using Sketch / Stopwatch / ‘Backwards-Stop-Forwards’ created by the author using Sketch / Rollercoaster Photo by Chris Slupski / Scale Photo by Elena Mozhvilo / Woman Holding a Light Photo by Jorge Flores / River Photo by Jessica Furtney / Hurdles Photo by John Cameron / The Alamo Photo by Matthew T Rader / Photo Machine Photo by Crawford Jolly
