21 laws of UX to create compelling designs
What are the “laws of UX”?
Jon Yablonski came up with a set of 21 UX principles in a book called, Laws of UX.
He identified and explained principles in design theory that designers can use when creating interfaces.
They shed light on the psychology behind how users interact with digital products.
This article takes each law of UX and gives you a quick and easy overview of each.
1. Aesthetic-usability effect
The aesthetic-usability effect is a phenomenon in which people tend to prefer things that are more aesthetically pleasing, even if they are less functional.
It’s not that people will think to themselves, well it looks nice so I don’t mind about the use, but they will unconsciously overlook any problems.
As a result, designers can hide and prevent issues in usability from being detected.
This effect is also known as the "aesthetic-usability bias" or "aesthetic-usability heuristic."
2. Doherty threshold
The Doherty threshold is the optimal response speed between a person and a computer in order to keep the user engaged.
When the two interact at a pace of <400ms, productivity increases as neither computer nor person has to wait for the other.
One method to utilise this is animation to show when results or content are loading. It engages people and makes them less likely to leave.
It’s been found that intentionally adding a delay to results being displayed can instil a sense of trust in the user.
3. Fitt’s law
Fitt’s law is where the call-to-action, button, or target you want users to interact with is accessible in relation to distance and the size of the target.
For example, you’ll want to make sure that the target area is large enough for people to easily interact with and in an easy and accessible place to reach. You also want to ensure that there’s adequate spacing between target areas.
4. Goal-gradient effect
The goal-gradient effect is the principle that as a person gets closer to their goal, the more they speed up to reach it.
This can be used as a motivator to encourage users to complete a task. For example, a progress bar can help encourage users to complete a necessary step, such as filling in a questionnaire.
5. Hick’s law
Hick’s law states that the more choices, or more complex of a choice, a person has to make, the longer it will take for them to come to a decision.
We’ve probably all experienced this in action. For example, Netflix has so many available options these days, how many times have you gone on there intending to find something to watch and end up wasting the majority of the time browsing.
To overcome this, minimise choices to users when you want them to make a decision, or if something is complex, break it down into manageable tasks.
6. Jakob’s law
Jakob’s law identifies that users like to use sites they recognise, so you should design your site to work similarly.
This is because people will have built a set of expectations on how a product will work and will transfer this knowledge over.
It saves people time by not having to re-learn how to interact with a site. As a designer, you can focus on delivering a better experience than the competition, rather than a new one.
7. Law of common region
Users group elements and make sense of them in a single topic, when within a defined boundary.
This helps create structure and for people to understand the relationship between different elements and sections. It can speed up the process for people to know which areas they want to interact with.
There are different ways to create this, such as adding a defined background to different elements or including a border.
8. Law of proximity
When different elements are next to, or near each other, people tend to group them.
This is a similar concept to the law of common region but without the need for a boundary.
The use of proximity allows people to make sense of and understand content faster.
By putting similar elements near one another, the use of whitespace, and headings, the UX law can be easily utilised.
9. Law of Prägnanz
People will interpret complex images in their most simple form. This is because it requires less cognitive effort.
The human brain like simplicity and will make things easier for us by dumbing down intricate shapes and designs into a single form.
It allows for the easier processing of information.
This means that as a designer it doesn't make sense to go too elaborate. Keep things simple as it will be interpreted that way anyways.
10. Law of similarity
People will interpret similar elements as a whole, even when the elements are apart.
This can be put to good use by the designer. They can make use of shape, size, colour, and orientation to signify elements being related to one another.
For example, when presenting data, ensuring the numbers and figures are in the same colour can help people group these together and make sense of their meaning.
11. Law of uniform connectedness
Elements that are connected visually, will be understood as more related to one another than elements that have no connection.
By grouping elements together with the use of visual tools such as lines, shapes and colour people can understand that they are related.
For example, including an arrow between different shapes shows tells people that what they are viewing is most likely a process.
12. Miller’s law
The average person can retain just 7 items (give or take 2) in their working memory.
This demonstrates why attention is limited as people cannot retain vast amounts of information.
By knowing this, designers can work towards what is optimal for people when creating a site or digital product.
For example:
- Not overwhelming users with too many choices.
- Organise content into smaller sections.
- Don’t rely on short-term memory. Recognition and recall are much more reliable.
13. Occam’s razor
With regards to design, Occam’s razor states that when you have competing ideas which both promise good results, opt for what’s simplest.
It comes down to avoiding over-complicating things.
When designing something, look at what you can take away whilst keeping the message the same. Only then when you can remove no more, are you finished.
14. Pareto principle
80% of results can come from just 20% of the work.
This is a rule that comes into play in many industries.
To put it into practice, focus on the areas that will deliver the most benefit to your users.
One example of the Pareto Principle is a minimum viable product (MVP). An MVP is a product with just enough features to be usable by early adopters to then produce a final product. It focuses on what can be done that will achieve the most results.
Don’t waste time on “nice to haves” but focus on the core functions you need.
15. Parkinson’s law
Any task, if you allow it, can take up all of your time.
With regards to UI and UX, designers can ensure that interfaces help people complete a job within an appropriate amount of time.
There are different methods to achieve this. The use of auto-fill can come in handy here, such as filling in payment or login details.
By allowing this to happen you save time and improve the user experience.
16. Peak-end rule
People will judge their experience usually by the peak and end, rather than the overall average.
This identifies that when coming to the end of the user-experience journey, or the main point, that’s when you want to make sure you impress the most.
For example, the use of a nice animation or giving a deal to the user will help them recall the experience positively. Perhaps you want users to create an account, you may give them a surprise discount on their next purchase when they do so, but only reveal this at the end.
17. Postel’s law
Be liberal in what you accept from your users, but refrain from asking too much of them.
This is about taking everything into account that your user gives to you.
For example, getting users to fill out forms can be the main task for many designers.
Allowing room for error on the user’s side is Postel’s law in action. Perhaps they include a common spelling mistake or typo that typically AI wouldn’t recognise.
By making room for these errors and preempting them you’re being liberal in what you accept.
On the flip side, don’t make the form over long. Only capture what’s needed. This is the other action of Postel’s law.
18. Serial position effect
People tend to remember the first and last items in a series.
How do you put this to use? By placing the least important things in the middle, and the things you want people to remember the most at the beginning or end.
In practice, this could look like using CTAs at the bottom of the page, or some other action button at the start.
19. Tesler’s law
This is also known as The Law of Conservation of Complexity and states that within any system there will always be some level of complexity that can’t be reduced.
Accepting this can save time trying to out design all levels of complexity. This needs to be something that both user and provider acknowledge.
If not taken into account, the designer can simplify things to a point where it becomes abstract and no one is sure what is being conveyed.
However, an effort should be made so that the majority of complexity is taken on by the provider.
For example, if something is going to be more complicated than other tasks, explain using simple messages and use separate windows to avoid visual clutter.
20. Von Restorff effect
The Von Restorff effect states that in a series of similar objects, the one that differs the most is the one that will be remembered the most.
To take advantage of this, designers can ensure that the things they want to be remembered most are distinctive from the rest. However, it’s best not to over-rely on colour to do this alone. People who are colour blind might not be able to see the difference.
You also don’t want to go to town on a specific element, it could be mistaken for an ad.
21. Zeigarnik effect
The final UX law is the Zeigarnik effect. This states that people remember interrupted or incomplete tasks over completed ones.
This is because when you start a task it creates tension that is typically not alleviated until it’s complete.
To put this into practice, designers can include visual representations that show the incompleteness of a task to encourage people to finish them. This is where the use of a progress bar really comes into play.
For example, if you have a step count on a fitness watch it can show this as a ring or bar that doesn't complete until you reach that goal.
Conclusion
Each of these laws can prove very effective when creating a product or website that users will enjoy interacting with.
Your project will be in the safe hands of experts when shared with us. To see for yourself, look at these examples of work and try to match which UX law we’ve applied to each!