The "10 Laws of UX" are design rules for making user experiences that are effective and easy to use. These principles are widely accepted and followed by designers and developers in various fields. Below we’ve identified the 10 laws of UX and how to implement them:
1. Hick's Law
Hick's Law, is a principle in psychology and user experience design that describes the relationship between the number of choices and the time it takes for a person to make a decision. It states that the time it takes for a person to make a decision increases with the number of choices available.
Hick's Law emphasises the importance of reducing complexity and cognitive load for users by limiting the number of choices or options available at any given time. By providing users with fewer options, you can streamline the decision-making process, improve user satisfaction, and increase the likelihood of successful interactions.
How to Implement
Simplify navigation: When designing menus, navigation bars, or any interface that involves choices, aim to minimise the number of options. Presenting users with a concise and organised set of choices helps them locate the desired option more quickly.
Categorise and prioritise options: If you have a larger number of choices, consider categorising them into logical groups. This way, users can narrow down their focus and select from a smaller set of options within a specific category. Additionally, prioritise the most commonly used or important options to facilitate quicker decision-making.
Disclose Options Progressively: Rather than overwhelming users with a multitude of options upfront, consider using progressive disclosure techniques. Start with a limited set of options and provide additional choices as users move deeper into the interface or express their specific needs. This approach helps users maintain a clear mental model and reduces decision-making complexity.
Utilise default options: By pre-selecting a recommended or commonly chosen option, you can simplify the decision-making process for users who may not have strong preferences or who prefer a hassle-free experience.
2. Law of Proximity
Gestalt principle of proximity states that elements that are close to each other are perceived as related. By placing related elements near each other, you can create visual associations and make it easier for users to understand the relationship between different parts of the interface.
How to Implement
Group related information: By placing related elements in close proximity to each other, you can visually communicate their relationship and create a sense of unity. For example, in a form, grouping form fields and labels together helps users understand that they are connected and should be filled out together.
Create a visual hierarchy: Proximity can be used to establish a visual hierarchy within a design. Elements that are closer to each other are perceived as more related than those that are farther apart. By strategically organising and spacing elements based on their importance or relationship, you can guide users' attention and highlight key information.
Group your navigation elements: Placing related navigation items close to each other makes it easier for users to understand the structure and find what they are looking for. Additionally, separating unrelated or secondary options through spacing helps reduce confusion.
Categorise: When displaying content, arranging related items together based on their topic or category can enhance readability and comprehension. Interfaces that present lists, grids, or cards, where grouping related items creates a clear structure and aids in scanning and finding desired content.
Call-to-action placement: When designing call-to-action buttons or links, positioning them in close proximity to relevant content or instructions increases their visibility and encourages users to take action. Placing a button adjacent to a related headline or description can make the desired action more apparent.
3. Law of Similarity
Elements that share similar visual characteristics, such as shape, size, colour, or texture are perceived as related. Utilising this law helps to group similar elements together and differentiate them from others, improving visual hierarchy and user comprehension.
This similarity can be used strategically in UX design to communicate relationships, create visual hierarchy, and guide users' attention.
How to Implement
Include groups in your composition: By using similar visual elements, you can group related items together and differentiate them from other elements. This helps users quickly understand the structure and organisation of a page or interface.
Lean on differences: You can use differences in similarity to create a visual hierarchy. Elements that are more similar to each other can be perceived as a group, while an element that stands out as dissimilar can draw attention and indicate importance.
Use icons: Icons that share similar visual attributes can be associated with a specific category or function. For example, using similar colours or shapes for icons that represent related actions or concepts helps users understand their meaning.
Ensure consistency: Consistency in visual attributes across different screens or sections of an application can reinforce the mental model of users and make it easier for them to navigate and understand the interface.
4. Fitts's Law
Fitts's Law states that the time it takes to reach a target depends on the distance to the target and its size. The principle suggests that designers should make interactive targets larger and place them closer to the starting position to enhance usability and improve the overall user experience.
By leveraging this principle, UX designers can create more efficient and user-friendly experiences that reduce cognitive load and enhance user satisfaction.
How to Implement
Make buttons bigger: Enlarging the size of interactive elements reduces the margin of error and makes it easier and faster for users to select them. This is particularly important for touch-based interfaces on smartphones and tablets. Larger targets also benefit users with motor impairments or those using input devices with limited accuracy, such as a stylus or a mouse.
Scrutinise button placement: By considering the distances between interactive elements, designers can strategically place frequently used or important targets closer to the starting position, enabling users to access them quickly.
Consider gesture-based interactions: Gestures that require larger, sweeping movements can be more challenging and time-consuming than gestures that involve smaller, precise movements.
5. Jakob's Law
Jakob's Law highlights the importance of aligning with users' expectations by following established design patterns and conventions. The law states that users spend most of their time on other websites and platforms, so they form expectations based on those experiences.
It is important to note that while Jakob's Law recommends following established conventions, it does not discourage innovation or creativity in design. However, any deviations from established patterns should be well-considered and should not hinder usability or confuse users.
How to Implement
Lean on established compositions: Users are more likely to feel comfortable and quickly understand how to interact with a website or application when it adheres to familiar design patterns and conventions. Consistency across different parts of an interface and across similar applications contributes to a better user experience.
Go orthodox with header design: Organising navigation menus, buttons, and other interactive elements in a way that aligns with common practices helps users navigate and find what they need more easily. On desktop, placing the logo in the top-left corner, using recognisable icons, and having a clear hierarchy are examples of following established patterns. For mobile, include a hamburger to signpost navigation.
Create predictable forms: When designing forms, it is beneficial to follow conventions for labelling, input types, and placement of form elements. Users expect certain interactions and behaviours based on their prior experiences. Deviating too much from established form patterns can lead to confusion and frustration.
Place content where the user would expect it to be: Jakob's Law also applies to the structure and presentation of content. Users are accustomed to certain content layouts and expect to find specific information in particular locations. For instance, users often anticipate finding contact information in the footer, and they expect the main content area to be in the centre or left-aligned.
6. Law of Prägnanz
Also known as the Law of Good Figure, people tend to perceive and remember complex objects as simpler and more organised versions. This law emphasises the importance of creating clear, simple and visually distinctive designs that can be easily understood and remembered.
Applying the Law of Prägnanz in branding and visual identity design helps create memorable and recognisable symbols, logos, and icons. By simplifying complex ideas into distinctive and coherent visual representations, you can make a lasting impression and establish a strong brand identity.
How to Implement
Keep it simple: Users are more likely to understand and engage with interfaces that present information and visual elements in a simple and straightforward manner. By eliminating unnecessary complexity, reducing clutter, and using clear and concise language, you can enhance usability and make it easier for users to comprehend and navigate the interface.
Incorporate visual cues: Applying the Law of Prägnanz helps create a clear visual hierarchy in your designs. By using visual cues such as size, colour, contrast, and whitespace, you can guide users' attention and emphasise the most important elements or actions. This helps users quickly grasp the structure and purpose of the interface.
7. Law of Visibility
The Principle of Visibility is based on the idea that users should be able to easily perceive and understand the state, location, and availability of different elements within an interface. It emphasises the importance of providing clear and intuitive visual cues to guide users' interactions and help them make informed decisions.
How to Implement
Establish clear affordances: Buttons should appear clickable, links should be distinguishable, and input fields should be recognisable as areas for text input. By designing elements with clear and appropriate affordances, users can quickly understand how to engage with them.
Provide users with feedback: Providing timely and meaningful feedback to user actions is crucial for visibility. When users interact with an element, such as clicking a button or submitting a form, they should receive clear feedback indicating that their action has been recognised and processed.
Adopt indicators: Using progress bars, loading spinners, or status icons can inform users about ongoing processes or indicate completed actions. Indicators such as checkmarks or warning symbols can help users quickly understand the status of a task or the validity of entered information.
Implement intuitive design: Your interface should follow consistent visual and interaction patterns. This will allow the user to develop mental models and expectations based on their prior experiences.
8. Law of Consistency
Users appreciate consistency and expect similar functionality and appearance across different parts of an interface or different applications. Maintaining consistent design patterns, interactions, and terminology throughout the user experience fosters familiarity, reduces confusion, and improves efficiency.
How to Implement
Use consistent visuals: Visual consistency involves using consistent design elements such as colours, typography, icons, and layouts throughout the interface. By applying consistent visual styles, users can quickly recognise and understand the purpose and function of various elements, fostering a sense of familiarity and reducing cognitive load.
Use consistent interaction: Ensure similar interactions and behaviours are implemented consistently across the interface. Using consistent interaction patterns for buttons, links, and navigation elements helps users understand how to interact with them and what to expect in terms of the outcome.
Use consistent structures: Structural consistency focuses on maintaining a consistent information architecture and layout across different screens or sections of an interface. By organising content and functionality in a consistent manner, users can easily navigate through the interface and find what they need without confusion or frustration.
Use consistent language: Consistent use of terminology throughout the interface helps users understand and interpret information consistently. This includes labels, menu items, error messages, and other text-based content.
Use industry conventions: Users have pre-existing mental models based on their experiences with other applications or websites. Align with these conventions, so you can make your interface more intuitive and familiar to users. This will reduce the learning curve and increase usability.
9. Law of Feedback
Users need feedback to understand the outcome of their actions. Providing timely and meaningful feedback, such as visual, auditory, or haptic cues, informs users about the result of their interactions and helps them make informed decisions.
By incorporating the Law of Feedback into your UX design, you can create a more user-centric experience by keeping users informed and engaged. Feedback helps users understand the outcome of their actions, minimises uncertainty, builds confidence, and contributes to a positive and efficient user experience.
How to Implement
Include immediate feedback: Users should receive feedback promptly after they perform an action. Whether it's clicking a button, submitting a form, or completing a task, providing immediate feedback reassures users that their action has been recognised and is being processed. This feedback can be visual, auditory, or haptic, depending on the context.
Ensure feedback is clear: Feedback should be clear and easily perceivable. Visual cues, such as animations, changes in colour or shape, or highlighting, can indicate that an action has been successfully completed or that an error has occurred. Auditory feedback, such as system sounds or notifications, can also be used to reinforce the feedback.
Ensure feedback has context: Feedback should be relevant to the specific action or interaction. Convey meaningful information to the user. For example, if a user submits a form and encounters an error, the feedback should clearly indicate which fields require correction and provide helpful instructions on how to resolve the issue.
Provide error and validation feedback: When users make mistakes or encounter errors, it is important to communicate the problem in a clear and understandable manner. Your error messages should explain the issue and provide guidance on how to rectify it, helping users correct their errors and continue their workflow.
Provide progress feedback: For actions that take time to complete, such as file uploads, data processing, or loading screens, it is essential to provide feedback on the progress or status of the task. Progress bars, loading spinners, or percentage indicators can inform users that their action is being processed and help manage expectations.
Provide confirmation feedback: When users successfully complete an action or task, giving confirmation feedback assures them that their action was successful. This can be in the form of visual cues, success messages, or a redirection to the appropriate next step.
10. The Pareto Principle
The Pareto Principle, also known as the 80/20 rule or the law of the vital few, is a principle that originated in economics but has been applied to various fields, including user experience (UX) design. The principle suggests that roughly 80% of the effects or outcomes result from 20% of the causes or inputs. It's important to note that the 80/20 split is not always exact, and the specific ratios may vary.
However, the underlying concept remains valuable in helping UX designers prioritise their efforts and resources effectively to maximise the impact of their work on user satisfaction and overall product success.
How to Implement:
Focus on the most important features: The Pareto Principle encourages prioritising the features or functionalities that provide the most value to users. By identifying the 20% of features that contribute to 80% of the user needs or goals, you can allocate your design resources and efforts effectively.
Identify the critical user: Applying the Pareto Principle to user research helps in identifying the critical user needs or pain points that require immediate attention. By focusing on the most significant user requirements, you can develop solutions that have the greatest impact on user satisfaction and usability.
Prioritise content: In content-heavy interfaces, the Pareto Principle suggests that a small portion of the content is likely to be the most relevant or frequently accessed. By identifying and prioritising that 20% of content, you can ensure it receives appropriate prominence and visibility, allowing users to access the most important information easily.
Prioritise bug fixes: The Pareto Principle can also be applied when addressing software bugs or user-reported issues. By addressing the top 20% of bugs that are causing the majority of user frustrations or functionality problems, you can improve the overall user experience significantly.
Identify key performance issues: Applying the Pareto Principle to performance optimisation involves focusing on the critical 20% of performance issues that are causing the majority of delays or bottlenecks. By addressing those key performance factors, such as page load times or responsiveness, you can enhance the overall user experience.
In Conclusion
Remember that these laws are not rigid rules, but rather guidelines to inform and improve your design decisions. They can be adapted and interpreted based on the specific context and requirements of your project.
Designer Frank Chimero said, "People ignore design that ignores people." A platform that doesn’t consider the user’s needs will fail. Although its important to know and understand how to implement the listed UX Laws, no design process is complete without taking a step back from your work to consider your users; their goals, their challenges, and their motivations.
Working with experienced UX Designers, like the Maverick Communications Design team, will help you identify where potential user issues lie, so your finished design will improve your site's user experience, making it more effective and easier to use.