Applying Psychology to UI Design: Improving Interfaces

From Critique to Redesign: A Case Study

The best way to understand how to propose improvements is to see it in action. We're going to watch a case study where a designer critiques an existing interface—the Delta SkyMiles page—and then walks through their redesign, explaining the rationale at each step.

This video is a perfect example of today's learning outcome. It demonstrates how to move from "this is confusing" to "this is confusing because it violates Hick's Law, and here is how we can fix it."

The key takeaway here is that every proposed change in the "after" design is a direct answer to a problem found in the "before" design, and each problem is framed by a design principle. This is the level of professional rationale you should aim for.

Your Toolkit for Justifying Improvements

To propose improvements like the one in the video, you need a toolkit of principles. These are not just abstract theories; they are practical lenses for evaluating a design.

1. Nielsen's 10 Usability Heuristics

A foundational toolkit in UX is Jakob Nielsen's 10 Usability Heuristics. Think of these as a "charter of user rights" for interface design. They are general principles, not specific rules, that help you identify usability problems.

Let's get a quick overview of these heuristics.

When you propose a design change, you can now anchor your reasoning in this established framework. For example: "I recommend we add a loading spinner (Visibility of System Status) so users know their request is being processed," or "I redesigned the icons to be more consistent across the app, adhering to the principle of Consistency and Standards."

2. The Growth.Design Psych Framework

Given your interest in Growth.Design, their core framework is an excellent tool for this task. It simplifies user behavior into a powerful equation based on behavioral economics.

The Net Perceived Value (NPV) formula is a beautifully simple yet profound model that aligns perfectly with your analytical background. It states that a user will take an action if the motivation to do so is greater than the friction involved.

This gives you two primary levers for proposing improvements:

1. Increase Motivation: Make the value proposition clearer, use more persuasive copy, show social proof, or create a sense of urgency (ethically!).
2. Decrease Friction: Simplify forms, reduce the number of steps, improve layout clarity, or use smarter defaults.

For example, you could propose: "To improve sign-up conversion, I suggest reducing the number of form fields from seven to three. This decreases friction, which increases the Net Perceived Value of creating an account."

Your Turn: Propose an Improvement

Now, let's put these concepts into practice. Your task is to analyze a UI, identify a flaw, and propose a justified design improvement. This exercise simulates the exact process of adding value as a freelance designer.

Your Task (25-30 minutes):

1. Select a UI:

   • Go back to the "Dark Pattern Audit" you did in the previous lesson and pick one of the problematic interfaces you found.
   • Alternatively, choose a screen from a website or app related to your bespoke gifting business (e.g., a competitor's product page, a contact form, or a checkout process).

2. Set Up Your Figma File:

   • Create a new page in your Figma file named "Design Improvement Proposal."
   • Take a screenshot of the original UI (the "Before") and place it on the left side of your canvas.

3. Analyze and Justify:

   • Below the "Before" screenshot, add a text box and write a brief analysis (2-3 sentences).
   • Identify the problem and name the principle it violates.
   • Example: "This form has too many fields, creating unnecessary friction for the user. It also violates the principle of Aesthetic and Minimalist Design by asking for non-essential information upfront."

4. Propose and Create:

   • On the right side of your canvas, create a simple wireframe or low-fidelity mockup of your proposed improvement (the "After"). Don't worry about perfect visuals; focus on structure and layout. You can use simple grey boxes, placeholder text, and basic shapes.
   • Below your "After" design, add another text box and write your rationale (2-3 sentences).
   • Explain your solution and link it back to a principle.
   • Example: "My redesign simplifies the form to only three essential fields, reducing cognitive load and friction. This increases the Net Perceived Value of signing up. Additional information can be collected later, following the principle of progressive disclosure."

This exercise is not just about making things look better; it's about making them work better and being able to explain why.

Conclusion

Today you've made a crucial leap from being a design critic to a design problem-solver. You've learned that effective design improvements are not based on subjective taste but on the deliberate application of psychological principles.

Key Takeaways:

• Proposing improvements is a core design skill. It involves analyzing a "before" state and creating a justified "after" state.
• Use established frameworks to justify your decisions. Referencing Nielsen's Heuristics or the Motivation-Friction model elevates your proposals from opinions to expert recommendations.
• Every design change should have a "why." Whether you're reducing friction, increasing motivation, or improving clarity, you must be able to articulate the user-centric and business-centric reasons for your choices. This is especially vital for freelancers who need to demonstrate value to clients.

Preview of the Next Lesson:
You now have a solid foundation in the core principles of UX psychology. In our next module, we will put these skills to a practical, real-world test. We'll kick off Module 6 by learning how to conduct a structured competitor UX audit, using your own gifting and events business niche as the case study. This will help you understand the competitive landscape and identify opportunities for your own future design work.