7 Laws of UX design — Making a designer’s life a bit easier.

An introduction to a few laws of UX Design

Anushka Sahore
6 min readOct 17, 2021

When UI/UX design is mentioned, people generally stereotype the profession as ‘making screens pretty’. But that’s not even close to reality. Just like in any other profession, there are laws and principles that define and govern a design decision. Any screen you see, every small element on it has its purpose of existence.

There are no hard-and-fast rules when it comes to creating a better user experience. But certain laws and principles based on recurrent human psychology and human behavior do help guide a designer towards a good and usable interface, for a better user experience.

Laws of UX is a collection of best practices that designers can consider when building user interfaces. — Jon Yablonski

UX is not (only) UI. Good design tends to follow a general set of principles, namely the Ten Principles for Good Design by Dieter Rams, that give designers general guidelines to work with. But for interface designers and user experience, there are certain laws that everyone should keep in mind while designing.

In this article, I have explored 7 laws and explained them with examples as per my perspective and understanding. Let us have a look;

1. Fitts’ Law

The time to acquire a target is a function of the distance to and size of the target.

Pop-up menu in figma pages
The pop-up menu in the Figma file

Fitss’ Law describes how long it takes for a user to move to and select a target. As the distance increases, so does the time to move towards the target, and as the size decreases, selection again takes longer. Pop-up menus are a better design as compared to dropdown menus since the selection of interactive elements becomes easier with less travel time as the cursor doesn’t have to move so far from its current position.

2. Hick’s Law

The time it takes to make a decision increases with the number and complexity of choices.

Simply described, the more options there are for users, the more time they will take to finalize their decision. The objective here is to try and simplify the decision-making process, not eliminate that process entirely. As a designer, keep things simple and at times highlight the main/desirable options to help the users make up their minds faster.

Sephora website — dropdown categories
Skincare category menu on Sephora website

If the website’s menus offered direct access to every link within their site, the users would get overwhelmed quickly. To avoid such mishaps, designers group menu items into high-level categories instead. These slowly expand as the users hover over the categories, and the sub-categories then take users where they want to go. Like in the above image, Sephora’s website has grouped some of the basic categories, like Brands, Skincare, Tools & Brushes, and Gifts among others, with subcategories visible only when hovered over the main categories. Not everything is just clustered together on one page to make things difficult to understand and find. Whenever in doubt, apply the KISS principle (Keep it Simple, Stupid).

3. Miller’s Law

The average person can only keep 7 (plus or minus 2) items in their working memory.

Miller’s Law directs us to use chunking to organize content into more manageable groups. Since people tend to remember small portions better than large sections, chunking helps users process, understand, and memorize more easily.

A great example would be phone numbers. Remembering just 1244987840 would be a task and pretty much time-consuming. But if you divide it into smaller groups, say 1244-987-840. Tell me if this is still difficult to memorize? I don’t think so.

Similarly, in digital interfaces, grouping or chunking makes it easier for the users to remember things for later use. Like, E-learning websites, etc.

4. Doherty Threshold

Productivity soars when a computer and its users interact at a pace (<400ms) that ensures that neither has to wait on the other.

Truth be told, we interact faster with systems that give us fast feedback. In today’s fast-paced world, if we do not get system feedback on the completion of a task/action then the trust starts shaking a bit. Is this website trustable? Or, did I actually press the tab?

Water in a test tube — animated loading screen gif
Animated loading screen gif

Animated loading/processing screens are one way to visually engage with the users. Another would be progress bars. They help make wait times tolerable, regardless of their accuracy.

5. Tesler’s Law

Tesler’s Law, also known as The Law of Conservation of Complexity, states that for any system there is a certain amount of complexity which cannot be reduced.

As much as designers would love to simplify processes and make them faster, some processes cannot be simplified to be more basic. There are definite complexities in a system, waiting to be assumed by either the system or the user. But it is our responsibility as the system to reduce the complexity of the users. It is always advisable to ensure as much as possible of the burden is lifted from users by dealing with inherent complexity during design and development.

Tabs to be filled mandatorily for hotels on Trivago

To book a hotel there are 4 basic data. (Destination name, check-in & check-out, and the number of rooms/guests). Without filling in these 4 information boxes, the process can not be completed and would not move forward. Remember not to simplify interfaces to the point of abstraction. Tasks that are mandatory would be there for the users to complete, our job is to make sure their experience is not compromised.

6. Zeigarnik Effect

People remember uncompleted or interrupted tasks better than completed tasks.

When you start working on something but do not finish it, thoughts of the unfinished work continue to pop into your mind even when you’ve moved on to other things. The Zeigarnik effect is used to grab the attention of the users in different ways, to the unfinished task.

LinkedIn profile section — profile completion progress bar
LinkedIn profile section — profile completion progress bar

This is the LinkedIn profile completion progress bar. The way this has been designed, LinkedIn asks users to complete their profile section by nudging them in the right direction every now and then. Where you leave certain tasks “incomplete” so that your internal process wants to complete them, but you also have that feeling reminding you they are incomplete.

7. Serial Position Effect

Users have a propensity to best remember the first and last items in a series.

When interacting with digital touchpoints or interfaces, the users shouldn’t be overwhelmed with information. And that is the reason why in the application navigation bar, the most important actions are placed on the left or on the right, introducing elements such as home or profile taking into account the serial position.

YouTube home page

This effect can be seen in action on any social media app, or even YouTube website here. The profile section is on the far right while all the categories are on the left side panel.

And with this ends the long list of laws. Mentioned above were a few of the many UX laws that are essential in order to develop better user experiences. To read about more UX laws, visit LawsofUX. I hope I helped you understand these laws a bit more clearly. Thank you for your time.

--

--

Anushka Sahore

UX Designer | Beginner writer with mostly articles showcasing current UI/UX learning journey.