What you'll understand by the end of this lesson
- What a mental model is and where it comes from
- Why interfaces that deviate from the mental model feel confusing even when they're logically correct
- How standard UX patterns reduce cognitive load and protect conversion
- Why "creative" checkout and navigation designs often cost more than they gain
The principle in plain English
A mental model is the internal picture a person has of how something works. It's built from past experience — every similar product, website, or interface they've encountered before.
When you arrive at a hotel website you've never visited, you already have a mental model of how hotel websites work: there'll be a search tool for dates and rooms, photos of the rooms and facilities, a price per night, and a booking button. You don't need to learn the site from scratch. Your mental model fills in the structure.
If the site matches your model, navigation feels effortless. You know where to look before you've looked. If the site deviates from your model — the booking tool is somewhere unexpected, rooms are organised differently, the pricing appears only after a multi-step process — you feel lost, even if every individual element is perfectly designed.
The friction isn't coming from the design itself. It's coming from the mismatch between the design and the model the user brought with them.
A simple example
Most people have a mental model for email applications: inbox on the left, message list in the middle, message preview on the right. When a new email app follows that model, new users feel immediately at home. When it places the inbox on the right, the message preview on the left, and the navigation at the bottom — users feel disoriented even before they've tried to do anything.
The layout might be logically equivalent. It might even be ergonomically better. But it violates the mental model, which creates friction that logic can't overcome.
How mental models affect conversion
Navigation that deviates from the expected pattern
Most website visitors have a mental model for where key navigation lives: logo top-left (links to home), main navigation top-centre or top-right, search in the header, contact or account icon top-right.
When a website places navigation at the bottom of the page, in a side panel, or accessed via a non-obvious icon, users who are looking for a specific page experience friction. They look where they expect navigation to be, don't find it, and either spend effort hunting or assume the site doesn't have what they need.
For a conversion-focused page, this friction doesn't just slow users down. It erodes the confidence that the site is well-made and trustworthy — which is its own conversion barrier.
Checkout flows that deviate from established patterns
Amazon, Shopify, and major e-commerce platforms have collectively trained hundreds of millions of users to expect a specific checkout flow structure: cart review → delivery address → payment details → order confirmation.
A checkout that reverses steps, combines them in unexpected ways, or uses non-standard labels for standard actions ("Proceed to fulfillment" instead of "Continue to delivery") creates hesitation at every step. The user can't apply their existing mental model, which means every action requires conscious evaluation rather than automatic navigation.
Hesitation in checkout is abandonment risk. The more steps require conscious evaluation, the more opportunities there are for doubt to win.
The safest checkout design is not the most creative one. It's the one that most closely matches the mental model users built from the biggest e-commerce sites they've used. Familiarity reduces hesitation. Hesitation causes abandonment. Optimise for clarity and convention before creativity.
Form layouts and interaction patterns
Users have mental models for forms too. Input fields with labels above or inside. Error messages that appear inline next to the field that failed, not in a block at the top of the page. A submit button that sits below the form, not above or beside it.
When a form deviates from these conventions — multi-column layouts that read in unexpected order, labels that appear after the field rather than before, submit buttons in non-standard positions — users make mistakes, miss fields, and hesitate.
The deviation isn't helpful. It's invisible to the designer who built it and highly visible to the user who has to navigate it.
The cost of being unconventional
Design teams sometimes prioritise distinctiveness over familiarity. A homepage that doesn't look like a typical homepage. A checkout that doesn't feel like a typical checkout. A pricing page that organises information in a novel way.
The intent is to stand out, create a memorable impression, or signal that the brand is innovative and creative.
The conversion cost is that every unconventional pattern requires the user to learn something before they can act. Learning requires cognitive effort. Cognitive effort during a decision-making moment increases the likelihood of abandonment.
The question to ask before any unconventional UX choice: what is the user gaining from this deviation that outweighs the cost of learning a new pattern? If the answer is "it looks interesting," that's not a sufficient conversion justification.
Mobile users have particularly strong mental models for how interactions should work — tap to expand, swipe to navigate, pull to refresh, tap-and-hold for options. Non-standard interaction patterns on mobile don't just confuse — they produce accidental actions, which creates frustration that's hard to recover from. Mobile should always default to platform conventions.
Working with mental models, not against them
This doesn't mean every website should look the same. It means understanding which elements carry the mental model and which are genuinely free for creative expression.
Carry the model (use conventions):
- Navigation placement and structure
- Checkout flow sequence and labels
- Form layout and error placement
- CTA button appearance and position
- Search and account icon placement
Express the brand (deviate freely):
- Visual design, colour, typography
- Tone of voice and copy style
- Photography and illustration
- Page content hierarchy and storytelling
- Unique features and interactions that enhance rather than replace standard patterns
The mental model is a structural constraint. Brand expression lives on top of it.
The CRO audit
Walk your key pages and ask:
1. Where does a first-time visitor expect to find navigation, CTAs, and key actions — and are those things there?
If your navigation is unconventional, check whether session recordings show hesitation or "lost" cursor movements in the expected navigation zones.
2. Does your checkout follow the standard sequence and use standard language?
If steps are combined or renamed, verify whether first-time users hesitate at those points. Hesitation data in session recordings is often a mental model mismatch signal.
3. Where are you being unconventional — and is there a conversion benefit to justify it?
List every deviation from standard UX conventions on your key pages. For each one, identify the conversion justification. "It looks better" is not a conversion justification.
A SaaS product decides to place its main navigation at the bottom of the page to look different from competitors. User testing shows visitors regularly look at the top of the page first, then spend several seconds finding navigation. What is happening?
Mental models are shaped by past experience. But there's a related force working alongside them — one that makes familiar things feel safer, even when there's no logical reason they should. It's called familiarity bias.