Design principles / 9 MIN READ
19 Psychological UI UX Laws
Psychology impacting design
From the original Fervor library. Examples may use older package versions.
Welcome to this tutorial on psychological design principles! In this tutorial, we will explore 29 powerful principles that can help you create more effective and engaging user interfaces. Understanding and applying these principles can improve the user experience, increase user satisfaction, and ultimately lead to the success of your designs.
Throughout the tutorial, we’ll provide explanations and examples of each principle, so you can gain a deeper understanding of how they can be applied in various design contexts. By the end of this tutorial, you’ll have a solid foundation in psychological design principles and be better equipped to create user interfaces that resonate with your target audience.
Let’s dive in and start discovering these fascinating principles!
-
Aesthetic Usability Effect
- This principle states that aesthetically pleasing designs are perceived as easier to use than less visually appealing designs.
- Example: Users are more likely to enjoy using an app with a visually pleasing interface and forgive minor usability issues.
-
Doherty Threshold
- This principle suggests that a system should respond to a user’s input within 400 milliseconds to maintain user engagement and productivity.
- Example: When a user clicks a button, the system should provide feedback (e.g., a loading animation) within 400 milliseconds to keep the user engaged.
-
Fitts’ Law
- This principle states that the time required to move to a target is a function of the distance to the target and the size of the target.
- Example: Making buttons larger and placing them closer to users’ fingers on mobile devices makes it easier and faster for users to interact with the interface.
-
Hick’s Law
- This principle states that the time it takes for a user to make a decision increases with the number and complexity of choices.
- Example: Simplifying navigation menus by reducing the number of options can help users make decisions more quickly and with less cognitive effort.
-
Jakob’s Law
- This principle suggests that users expect your website or app to function similarly to others they have used, so meeting those expectations can help users feel more comfortable and navigate more easily.
- Example: Using common design patterns, such as placing a search bar at the top of a webpage, can make it easier for users to find and use features.
-
Law of Common Region
- This principle states that elements that are visually grouped together are perceived as being part of the same group or related in some way.
- Example: Placing related buttons or menu items within the same container helps users understand their relationship and function.
-
Law of Prägnanz
- This principle suggests that people will perceive and interpret ambiguous or complex images in the simplest form possible.
- Example: Using clean and simple designs, with minimal visual clutter, can help users more easily understand and process the information on a webpage.
-
Law of Proximity
- This principle states that objects that are close together are perceived as a group or related in some way.
- Example: Grouping related form fields or menu items close together can help users understand their relationship and navigate more easily.
-
Law of Similarity
- This principle suggests that objects that look similar are perceived as being part of the same group or related in some way.
- Example: Using consistent styling for buttons or links that perform similar actions can help users quickly identify their function and relationship.
-
Law of Uniform Connectedness
- This principle states that elements that are visually connected are perceived as more related than elements that are not connected.
- Example: Connecting related elements with lines or borders can help users understand their relationship and navigate more easily.
-
Miller’s Law
- This principle suggests that the average person can only hold about 7 (plus or minus 2) items in their working memory at one time.
- Example: Limiting the number of options or pieces of information presented to users can help reduce cognitive load and improve usability.
-
Occam’s Razor
- This principle states that the simplest solution is usually the best, and designers should strive to eliminate unnecessary complexity.
- Example: Simplifying a user interface by removing extraneous elements or options can improve user comprehension and ease of use.
-
Pareto Principle
- This principle, also known as the 80/20 rule, suggests that 80% of effects come from 20% of causes, which can be applied to design by focusing on the most critical elements that have the greatest impact on user experience.
- Example: Prioritizing the most commonly used features and making them easily accessible can improve the overall user experience for the majority of users.
-
Parkinson’s Law
- This principle states that work expands to fill the time available for its completion, implying that setting constraints can help improve efficiency and focus.
- Example: Setting deadlines for design projects can help designers prioritize tasks and prevent feature creep, leading to more focused and efficient designs.
-
Postel’s Law
- Also known as the Robustness Principle, it states that designers should be conservative in what they send (output) and liberal in what they accept (input) to maximize compatibility and minimize errors.
- Example: Designing forms to accept various input formats (e.g., phone numbers with or without dashes) can improve user experience by reducing errors and frustration.
-
Serial Position Effect
- This principle suggests that users are more likely to remember the first and last items in a series, while items in the middle are more easily forgotten.
- Example: Placing important information or actions at the beginning or end of a list or sequence can help ensure users are more likely to notice and remember them.
-
Tesler’s Law
- Also known as the Law of Conservation of Complexity, it states that every application has an inherent amount of complexity that cannot be removed or hidden, so designers must find the right balance between managing complexity and maintaining functionality.
- Example: Breaking down complex tasks into simpler steps can help users complete tasks more easily, but designers must be careful not to oversimplify and compromise essential functionality.
-
Von Restorff Effect
- This principle states that items that stand out from their surroundings are more likely to be remembered.
- Example: Using contrasting colors or unique visual elements for important actions or information can help draw users’ attention and improve recall.
-
Zeigarnik Effect
- This principle suggests that people are more likely to remember uncompleted tasks than completed ones, so providing clear progress indicators and reminders can help users stay engaged and complete tasks.
- Example: Displaying a progress bar or checklist for multi-step processes can help users understand their progress and encourage them to complete the task.
Last 10 are chatGPT contributions
-
Law of Closure
- This principle states that people tend to perceive incomplete shapes or patterns as complete, filling in any gaps with their imagination.
- Example: Designers can use this principle to create minimalist logos or icons that rely on users’ perception to complete the image, making it memorable and visually appealing.
-
Cognitive Dissonance
- This principle suggests that people experience discomfort when they hold two contradictory beliefs or attitudes, often leading them to change one to resolve the inconsistency.
- Example: Designers can leverage cognitive dissonance in persuasive design, such as presenting users with information that contradicts their current beliefs or attitudes, encouraging them to reconsider their stance or take action.
-
Mere Exposure Effect
- This principle states that people tend to develop a preference for things they are repeatedly exposed to, as familiarity breeds liking.
- Example: Designers can use this principle to create brand recognition by consistently using the same colors, fonts, and design elements across all materials and touchpoints.
-
Anchoring Bias
- This principle suggests that people tend to rely heavily on the first piece of information they encounter when making decisions, known as the “anchor.”
- Example: In pricing and sales strategies, designers can present a higher price first (the anchor) before showing a discounted price, making the latter seem like a better deal.
-
Scarcity Principle
- This principle states that people perceive items or opportunities as more valuable when they are scarce or limited in availability.
- Example: Designers can use this principle to create a sense of urgency and exclusivity, such as by displaying limited-time offers, low stock indicators, or exclusive access to certain features.
-
Gestalt Principle
- This principle suggests that people perceive visual elements as a whole, rather than individual components, highlighting the importance of unified and coherent design.
- Example: Designers can use Gestalt principles, such as similarity, proximity, and continuation, to create visually cohesive interfaces that help users understand content and interactions more easily.
-
Reciprocity Principle
- This principle states that people feel a natural obligation to return favors or kindness, which can be leveraged in design to encourage user engagement or loyalty.
- Example: Offering users a free trial, valuable content, or exclusive benefits can create a sense of indebtedness, making them more likely to engage with or purchase from your product or service.
-
Social Proof
- This principle suggests that people tend to follow the actions or opinions of others, especially when they are uncertain about the correct behavior or decision.
- Example: Designers can incorporate social proof elements, such as user reviews, testimonials, or social media shares, to build trust and encourage users to engage with or purchase a product or service.
-
Decoy Effect
- This principle states that people’s preferences can be influenced by the presence of an asymmetrically dominated option (the decoy), making other options appear more desirable.
- Example: Designers can present a decoy option in pricing plans or product comparisons, making the target option more appealing and increasing the likelihood that users will choose it.
-
Loss Aversion
- This principle suggests that people tend to prefer avoiding losses over acquiring equivalent gains, as the psychological impact of losing something is generally greater than the pleasure of gaining something.
- Example: Designers can use this principle to motivate users through fear of missing out (FOMO) or by emphasizing potential losses rather than gains, such as highlighting the limited availability of an offer or the consequences of not taking action. / In conclusion, we’ve explored 29 psychological design principles that can greatly influence the effectiveness and user satisfaction of your designs. By understanding these principles and incorporating them into your design process, you can create more intuitive, engaging, and successful user interfaces.
Remember, the key to successful design is understanding your users and their needs. Always consider these principles in the context of your specific project and target audience, and don’t be afraid to test and iterate on your designs to find the best solutions.
Thank you for joining us in this tutorial. We hope you’ve found it valuable and that you’ll use these principles to create outstanding user experiences in your future projects. Good luck and happy designing!