Zatheo web design and SEO agency logo
a

Web Design

Creative web design for generating new leads, bookings or sales.

Ecommerce Web Design

Creative ecommerce web design for generating new leads, bookings or sales.

Landing Page Web Design

Creative an impression and convert those customers with an effective landing page to support any campaign

All SEO

Know you need SEO services but not sure what kind, just explore our SEO services and we’ll steer you in the right direction

Technical SEO

Build the foundation of your website and organic growth

Onsite SEO

Generate more organic traffic with targeted efficient onsite SEOย 

Local SEO

Look beyond just SERPS and reach the audiences in your locale improve your localised visibility

Ecommerce SEO

Creating an ecommerce store is the beginning, getting your products found with targeted Ecommerce SEOย 

Link Building

Generate that online reputation that your business needs to smash competitors out of the water.

M
3

Web Design

Web Design

Creative web design for generating new leads, bookings or sales.

Ecommerce Web Design

Creative ecommerce web design for generating new leads, bookings or sales.

$

Landing Page Web Design

Creative an impression and convert those customers with an effective landing page to support any campaign

3

SEO

All SEO

Know you need SEO services but not sure what kind, just explore our SEO services and we’ll steer you in the right direction

Technical SEO

Build the foundation of your website and organic growth

Onsite SEO

Generate more organic traffic with targeted efficient onsite SEOย 

Local SEO

Look beyond just SERPS and reach the audiences in your locale improve your localised visibility

Ecommerce SEO

Creating an ecommerce store is the beginning, getting your products found with targeted Ecommerce SEOย 

Link Building

Generate that online reputation that your business needs to smash competitors out of the water.

Written by: Mike Dunkling

Founder & Digital Marketing Director

 

UX Design: The Science of Crafting Seamless Digital Experiences

User Experience Design (UX Design) isnโ€™t just about aestheticsโ€”itโ€™s about how people interact with digital products. Whether you’re working on an e-commerce website, app design, or mobile design, applying key design principles will make or break the user experience.

Over the years, researchers like Bluma Zeigarnik, George A. Miller, Ray Hyman, Hedwig Von Restorff, and Jon Yablonski have studied human memory, cognitive effort, error rates, and response times to create design laws that improve usability, engagement, and conversion rate.

In this guide, weโ€™ll break down the 16 unbreakable laws of UX and how you can apply them to e-commerce sites, app design, and real-world interface design to improve the checkout flow, action buttons, form fields, and interactive elements of your digital products.


1. Aesthetic-Usability Effect: Why Attractive Products Seem More Functional

๐Ÿ“Œ What It Means:
Users perceive visually pleasing designs as being more user-friendly and functional, even if they aren’t.

๐Ÿ’ก How to Apply It:
โœ… Use visual design elements that create a positive experience
โœ… Design clean, well-spaced, and padded targets for interactive elements
โœ… Apply color psychology to enhance emotional responses

๐Ÿ” Example: Appleโ€™s sleek, minimalist app design makes complex tasks feel effortless, even when decision increases.


2. Doherty Threshold: The 400ms Rule for Response Times

๐Ÿ“Œ What It Means:
When a system responds within 400ms, users stay engaged. Anything slower? Mental effort increases, and frustration builds.

๐Ÿ’ก How to Apply It:
โœ… Optimise page speed for e-commerce websites and app design
โœ… Use progress indicators for complex images or complex tasks
โœ… Reduce task time by minimising unnecessary clicks

๐Ÿ” Example: Googleโ€™s search results load instantly, setting a benchmark for response times.


3. Fittsโ€™s Law: Bigger & Closer = Faster Clicks

๐Ÿ“Œ What It Means:
The time to click a target size depends on its distance from the cursor and size of the interactive element.

๐Ÿ’ก How to Apply It:
โœ… Make action buttons big targets with proper edge placement
โœ… Reduce travel time by placing key actions near user focus areas
โœ… Follow guidelines for target size to reduce error rates

๐Ÿ” Example: E-commerce sites position the shopping cart in the top right because familiar patterns increase decision-making speed.


4. Goal-Gradient Effect: Keep Users Motivated

๐Ÿ“Œ What It Means:
People work harder as they approach task completion. Unfinished tasks keep users engaged.

๐Ÿ’ก How to Apply It:
โœ… Use progress bars in checkout flows and form fields
โœ… Show completion rewards for interrupted tasks
โœ… Break long tasks into smaller, digestible steps

๐Ÿ” Example: LinkedInโ€™s profile completion meter encourages users to finish their profiles.


5. Hickโ€™s Law: Reduce Complexity of Choices

๐Ÿ“Œ What It Means:
More menu options = slower decisions. Too much complexity leads to decision paralysis.

๐Ÿ’ก How to Apply It:
โœ… Limit choices in menu elements using linear menus or contextual menus
โœ… Use progressive disclosure to simplify interactive elements
โœ… Minimise mental models required for decision making

๐Ÿ” Example: Amazon suggests a few recommended products rather than overwhelming users with complex choices.


6. Jakobโ€™s Law: Users Expect Familiar Patterns

๐Ÿ“Œ What It Means:
Users prefer interfaces that work like ones they already know.

๐Ÿ’ก How to Apply It:
โœ… Use design patterns that align with user expectations
โœ… Keep e-commerce checkout flows intuitive
โœ… Maintain familiar application icons to reduce cognitive effort

๐Ÿ” Example: Every shopping cart icon is in the top rightโ€”because changing it would create confusion.


7. Serial Position Effect: First & Last Matter Most

๐Ÿ“Œ What It Means:
People remember the first and last items in a sequence best.

๐Ÿ’ก How to Apply It:
โœ… Place key actions at the start and end of a user journey
โœ… Use visual hierarchy to highlight essential design choices

๐Ÿ” Example: Landing pages start with strong headlines and end with compelling CTAs.


8. Zeigarnik Effect: Why Unfinished Tasks Stick in the Mind

๐Ÿ“Œ What It Means:
People remember incomplete tasks better than completed ones.

๐Ÿ’ก How to Apply It:
โœ… Use cliffhangers in onboarding flows
โœ… Implement progress indicators to encourage task completion

๐Ÿ” Example: Netflixโ€™s โ€œContinue Watchingโ€ feature reminds users of unfinished tasks.


9. Law of Common Region: Grouping Elements for Clearer UX

๐Ÿ“Œ What It Means:
Humans naturally perceive objects within the same boundary as related. If elements share a visual container, users assume they belong together.

๐Ÿ’ก How to Apply It:
โœ… Use boxes, containers, or shaded backgrounds to visually group related elements
โœ… Ensure form fields and labels are clearly separated
โœ… Use contextual menus to keep related menu elements within a designated area

๐Ÿ” Example: Dashboard UIs use rectangular menus and card layouts to visually separate different data points, reducing mental effort and improving readability.


10. Law of Proximity: Reduce Cognitive Effort in Scanning

๐Ÿ“Œ What It Means:
Objects that are closer together are perceived as being related.

๐Ÿ’ก How to Apply It:
โœ… Place labels directly above or next to form fields for better usability
โœ… Group related buttons to make them feel connected
โœ… Ensure checkout flow elements are visually connected to reduce confusion

๐Ÿ” Example: E-commerce checkout pages keep the billing address and payment fields close together, reinforcing their relationship.


11. Law of Prรคgnanz: Simpler = More Memorable

๐Ÿ“Œ What It Means:
The human brain simplifies complex images into the easiest form to process. This principle, rooted in Gestalt psychology, ensures designs remain digestible and effective.

๐Ÿ’ก How to Apply It:
โœ… Use minimalist UI elements that avoid unnecessary complexity
โœ… Ensure icons and visual elements represent their function clearly
โœ… Reduce ambiguous imagesโ€”users should instantly understand their purpose

๐Ÿ” Example: The Google logo is minimal, yet instantly recognisableโ€”proving that the simplest form is often the most effective.


12. Zeigarnik Effect: Why Unfinished Tasks Stick in Users’ Minds

๐Ÿ“Œ What It Means:
Users remember incomplete tasks better than completed ones. This concept, first identified by Bluma Wulfovna Zeigarnik, highlights the power of interruption in UX design.

๐Ÿ’ก How to Apply It:
โœ… Use progress indicators to encourage users to finish a process
โœ… Implement checklists in onboarding flows to keep users engaged
โœ… Create a sense of urgency by showing unfinished steps in shopping carts

๐Ÿ” Example: Netflixโ€™s โ€œContinue Watchingโ€ feature leverages this principle to pull users back into unfinished content.


13. Law of Similarity: Consistency Builds Trust

๐Ÿ“Œ What It Means:
Users group similar visual elements together. Consistent design elements improve clarity and navigation.

๐Ÿ’ก How to Apply It:
โœ… Keep action buttons and menu labels uniform across the site
โœ… Use consistent typography for headings, body text, and CTAs
โœ… Maintain a cohesive visual design across all digital experiences

๐Ÿ” Example: Spotifyโ€™s album art layout keeps visuals structured and predictable, making it easier to scan playlists.


14. Peak-End Rule: Users Remember Highs & Lows, Not the Middle

๐Ÿ“Œ What It Means:
Users judge an experience based on the most intense moment (peak) and the final moment (end)โ€”rather than the entire journey.

๐Ÿ’ก How to Apply It:
โœ… Ensure your most interactive elements create a positive experience
โœ… End the checkout flow or form submission with a reward or thank-you page
โœ… Highlight important touchpoints using color psychology and visual hierarchy

๐Ÿ” Example: Amazonโ€™s post-purchase confirmation page reassures customers with order details, recommendations, and delivery dates, ending the user journey on a positive note.


15. Millerโ€™s Law: The Magic Number 7 (ยฑ2) in UX Design

๐Ÿ“Œ What It Means:
George A. Miller, a cognitive psychologist, discovered that the average human short-term memory can only hold 7 (ยฑ2) items at a time.

๐Ÿ’ก How to Apply It:
โœ… Break content into small, digestible chunks
โœ… Use bullet points and short paragraphs to improve readability
โœ… Limit the number of menu options to avoid decision paralysis

๐Ÿ” Example: E-commerce websites keep their navigation menus short and intuitiveโ€”instead of overwhelming users with endless options.


16. Teslerโ€™s Law: Simplicity vs. Complexity in UX Design

๐Ÿ“Œ What It Means:
All systems have inherent complexityโ€”but the burden of handling that complexity should be on the system, not the user.

๐Ÿ’ก How to Apply It:
โœ… Automate repetitive tasks to reduce cognitive effort
โœ… Keep form fields minimalโ€”request only essential information
โœ… Simplify design elements while maintaining necessary functionality

๐Ÿ” Example: Photoshop uses presets and templates to simplify complex tools, ensuring users arenโ€™t overwhelmed by the full power of the software at once.


Final Takeaways for Designers

  • User experience design is a mix of psychology and usability.
  • Visual hierarchy, response times, and cognitive psychology impact conversion rates.
  • Applying these UX laws will improve usability, engagement, and decision-making processes.

๐Ÿ‘‰ Which UX laws do you already use? Drop a comment and letโ€™s discuss! ๐Ÿš€

FAQs

Why is my marketing not working?

Your marketing may not be working because the real constraint has not been identified. The issue could be low visibility, weak messaging, poor website conversion, low quality leads or weak customer retention. Each problem needs a different fix.

Should I spend more on ads if my marketing is not working?

Not automatically. If your landing page, offer or sales process is weak, more ad spend can increase waste. Check whether the issue is visibility, engagement, conversion or retention before increasing budget.

How do I know if my business has a visibility problem?

You may have a visibility problem if your website traffic, search impressions, local rankings, social reach or brand searches are low. In that case, your market may simply not be seeing you enough.

How do I know if my website has a conversion problem?

You likely have a conversion problem if your website gets traffic but does not generate enough calls, form submissions, booking clicks or qualified enquiries.

Why do I get leads but not the right kind of customers?

This usually points to a positioning, targeting or offer problem. Your marketing may be attracting people, but not the people most likely to value and pay for your service.

Is SEO worth doing if my website does not convert?

SEO can still be valuable, but you should fix major conversion issues before investing heavily in traffic growth. Otherwise, you may attract more visitors without turning them into enquiries.

What is a growth constraint?

A growth constraint is the main bottleneck stopping a business from growing. It could sit in visibility, engagement, conversion or retention.

Why does my marketing feel busy but not profitable?

This often happens when activity is not connected to a clear commercial outcome. Posting, advertising or publishing content only matters if it moves the right people closer to buying.

What should I fix first in my marketing?

Fix the weakest part of the growth system first. If nobody sees you, fix visibility. If people see you but do not care, fix engagement. If they care but do not enquire, fix conversion. If they buy once and disappear, fix retention.

What is the Compounded Success Blueprint?

The Compounded Success Blueprint is a diagnostic session designed to identify the main growth constraint in your business and give you clarity on what to fix first.