Laws of UX Design
… with real world examples
As a part of day 004 of 100 days of UX, I will be summarising my learnings from the laws of UX with examples in this blog.
Hick’s Law
The time it takes to make a decision increases with the number and complexity of choices.
To help users choose more quickly, Netflix made a list of Top 10 which lists shows/movies based on popularity and watch percentage in your region. (otherwise, we all know your food would get cold by the time you end up deciding what to watch *while eating*)
To simplify, apply the KISS principle (Keep it Simple, Stupid).
Fitts’s Law
The time to acquire a target is a function of the distance to and size of the target.
I recently started using Twitter. When I tried to tweet for the first time, the text confused me a lot, I thought it was part of the button but apparently the text is just to guide me. I find the buttons to be really small.
Solution: I should be able to tap on the text too to choose my tweet options.
Jakob’s Law
Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know.
Facebook officially rolled out “Reactions” to users worldwide which allowed users to get options between pre-defined emotions ranging from “Like”, “Love”, “Haha”, “Wow”, “Sad”, “Care”, and “Angry”.
LinkedIn, almost after 3 years later rolled out its own reactions ranging from “Like”,”Celebrate”, “Love”, “Insightful”, & “Curious”.
Law of Proximity
Objects that are near, or proximate to each other, tend to be grouped together.
When users completely miss a link, button, or piece of information even though it’s right in front of them, proximity (or rather, the lack of it) is often to blame.
For instance, when you open your mail: The “Unsubscribe” is presented at the bottom, same color as the rest of the text & far away from the main content and the most prominent calls to action. This placement makes it easy to & overlook and tricks users into thinking they can’t do anything about the mails they are receiving.
The Endowed Progress Effect doesn’t come alone
From a structural point of view, the act of completing a task with an endowed progress, is basically a process that the user goes through and can be split into 4 phases.
1. The start: the Zeigarnik Effect
The start or the trigger that makes the user take on the goal is initiated by the user’s own desire to complete an incomplete process. It’s called the Zeigarnik effect.
2. The body: the result of the Endowed Progress Effect
After the task has been triggered, the body of the process is basically the result of the endowed progress effect, where the users continue to advance throughout the process, influenced by the artificial advancement.
3. The end: the Goal Gradient Effect
As the progression towards the completion of the goal approaches the end, the efforts of the users will start to increase. Responsible for this behaviour is the Goal Gradient Effect.
4. The very end: the Goal Visualisation Effect
Making progress visible in any type of activity is essential for development and task completion. If we’re unable to see that we’re moving towards a goal, then we’ll likely give up. This is why visualising both the journey and our efforts is essential for stimulating goal-gradient behaviour.
For instance, as you decide to learn a language on . It breaks down the learning process into categories & sets a visual goal for each category. You are more inclined to increase your efforts when your goal is nearby & you end up reaching your goal in order to start the process all over again.
So that’s all for today!
Thank You for reading this article. I hope you liked it and found it helpful. Support me by following me and showing some love by hitting that clap button.
Sources
Kritika is a multi-disciplinary designer who graduated from NIFT Delhi with a degree in Knitwear Design & now focused on Product & UX Design. Her products are created from a place of intent, empathy, and passion. Feel free to reach out to her via LinkedIn or just say hey on Instagram! 😊
Portfolio- bit.ly/kritikaghangas
