Made with 🧠 and πŸ«€ by Youssef Bouksim

Back to library
✨

Aesthetic-Usability Effect

Users perceive aesthetically pleasing designs as more usable β€” even when they are not. Visual quality creates a halo effect that increases tolerance for friction and minor usability problems.

5 min readUX Β· UI Β· Product

In 1995, researchers Masaaki Kurosu and Kaori Kashimura ran a study at Hitachi Design Center in Japan. They gave participants two versions of an ATM interface β€” functionally identical, but one was laid out neatly and the other was arranged awkwardly. Participants rated the attractive version as significantly more usable, even though neither version was actually easier to operate.

This wasn't aesthetic preference or personal taste. The participants genuinely believed the prettier interface worked better. Don Norman later named this the Aesthetic-Usability Effect: when something looks well-designed, users assume it works well. They are more forgiving of its flaws, more patient with its errors, and more likely to attribute problems to their own mistakes rather than to the interface.

✦ Three things to know
βœ“
Aesthetic quality masks usability problems. Users encountering a minor bug or confusing flow in an attractive interface are more likely to persist, retry, and eventually succeed. In an ugly interface with the same bug, they are more likely to give up and blame the product.
βœ“
First impressions are formed in 50 milliseconds. Research by Lindgaard et al. (2006) found that users form aesthetic judgments of websites in under a twentieth of a second β€” before they've read a word, tapped a button, or encountered a single interaction. That judgment primes everything that follows.
βœ“
Aesthetic quality cannot permanently mask poor usability. The effect is strong enough to increase tolerance and patience, but not strong enough to survive genuinely broken interactions. Beautiful design buys goodwill β€” it doesn't replace functionality. The goal is both, not one in place of the other.
β€œAttractive things work better β€” not because of any engineering reason but because of the emotional response they evoke.”
β€” Don Norman

The same data β€” two completely different first impressions

Banking interfaces are a canonical example of the Aesthetic-Usability Effect in practice. Both dashboards below show exactly the same information: balance, recent transactions, spending, and account activity. The data is identical. The interactions are identical. What differs is everything about how they look β€” and that difference completely changes how users perceive the reliability, security, and ease of use of the product before they touch a single element.

The bad dashboard isn't broken β€” it displays all the information correctly. But the visual density, the default browser fonts, the table-based layout and the dated colour scheme all signal something about the care that went into the product. Before users do anything, they have already formed a judgment.

Before β€” functional but visually unpolished
mybank.com/dashboard
FIRST NATIONAL BANK
AccountsTransfersPaymentsSettingsSign Out
Account Summary - John D.
CHECKING
$4,218.40
Acct: ***4892
SAVINGS
$12,540.00
Acct: ***2211
SPENT THIS MONTH
$1,842.30
vs $2,100 last month
RECENT TRANSACTIONS
DATEDESCRIPTIONAMOUNTBALANCE
Apr 12WHOLE FOODS MKT-$84.20$4,218.40
Apr 11NETFLIX.COM-$15.99$4,302.60
Apr 10SALARY DEPOSIT+$3,200.00$4,318.59
Apr 9AMAZON MKTPLACE-$47.30$1,118.59
Apr 8STARBUCKS #0842-$6.80$1,165.89

All the information is here. But the visual language signals a product that hasn't been cared for β€” which signals a service that might not be either.

After β€” same data, designed with care
mybank.com/dashboard
Clarity
HomeAccountsTransfersCards
J
Good morning, John
Monday, 14 April 2025
Checking
$4,218
↓ 842 this month
Savings
$12,540
↑ 200 this month
Spent
$1,842
↓ 12% vs last month
Recent transactions
Whole Foods
Apr 12 Β· Groceries
βˆ’$84.20
Netflix
Apr 11 Β· Subscription
βˆ’$15.99
Salary deposit
Apr 10 Β· Income
+$3,200
Amazon
Apr 9 Β· Shopping
βˆ’$47.30
Starbucks
Apr 8 Β· Coffee
βˆ’$6.80

Same balance. Same transactions. But this product feels trustworthy, careful, and modern β€” before the user does anything at all.

This is not about decoration. The visual quality of a banking interface communicates something real about the organisation behind it: that they invested in the product, that they pay attention to details, that they care about the experience. Users correctly read visual quality as a signal of product quality β€” even when they shouldn't. The Aesthetic-Usability Effect means that signal works, whether or not it is perfectly correlated with the underlying engineering.


Error states β€” the moment aesthetics matter most

Error states are where the Aesthetic-Usability Effect has its highest practical impact. When something goes wrong β€” a payment fails, a file doesn't upload, a page doesn't load β€” the user is already frustrated. The aesthetic quality of the error experience determines whether that frustration crystallises into distrust or is dissolved by warmth and clarity.

A raw, technical error screen β€” red header, monospaced stack trace, dense paragraph of system language β€” confirms every anxiety: this product is unreliable, complicated, and doesn't care that I'm stuck. A well-designed error screen with a human illustration, plain language, and clear actions communicates the opposite. Same error. Completely different memory of having encountered it.

Before β€” raw, technical, uncaring
3:03
ERROR
ERROR 500 β€” INTERNAL SERVER ERROR
The server encountered an unexpected condition that prevented it from fulfilling the request. Please try again or contact support if the problem persists.
TypeError: Cannot read properties
of undefined (reading 'data')
at handlePayment (/routes/pay.js:84)
at processTicksAndRejections
node:internal/process/task_queues:96

Stack trace on a public error screen. Technical noise the user cannot act on. Every element signals carelessness.

After β€” warm, clear, human
3:03
Payment
Something went wrong
We hit an unexpected snag. It's not your fault β€” our team has been notified and is looking into it.
Error ref: ERR-8472

Warm tone, clear actions, human accountability. β€œIt's not your fault” does real psychological work. The error is the same β€” the experience of it is completely different.

Notice the detail at the bottom of the good screen: a short error reference code that users can copy if they contact support. This is the only technical information that belongs on a public error screen β€” not because it's useful to the user directly, but because having a reference number signals that the system is tracking the problem. It provides evidence of competence without exposing the machinery behind it.


AI responses β€” the aesthetics of structured output

The Aesthetic-Usability Effect applies to AI-generated content as directly as it does to designed interfaces. A response that arrives as a monospaced wall of text β€” even if the information it contains is accurate and complete β€” reads as less authoritative, less trustworthy, and harder to process than the same information formatted with clear hierarchy, readable fonts, and intentional spacing.

This matters because users who perceive an AI response as clearly structured and well-presented are more likely to trust its content, engage with follow-ups, and return to the tool. Identical information formatted differently produces different judgments of the AI's capability β€” purely through the Aesthetic-Usability Effect.

Before β€” monospace, unformatted, dense
3:03
AI Assistant
How do I write a cold email that actually gets a reply?
cold email tips: 1. subject line matters. make it short and specific. avoid "quick question" or "following up". try "[mutual connection] suggested I reach out" or "idea for [company]". 2. first line - no "my name is" or "i hope this finds you well". open with something about THEM. "saw your recent post about X" or "noticed [company] just launched Y". 3. the ask - one thing only. not "can we jump on a call to discuss how our solution might help with your current challenges". just "do you have 15 mins thursday?". 4. length - 5 sentences max. nobody reads long cold emails. 5. follow up once, 3-5 days later. just forward the original with "bumping this up". P.S. personalization > templates every time.
Follow up...

Same advice β€” hard to trust, hard to scan. The content is good. The presentation signals a rough prototype, not a reliable tool.

After β€” structured, readable, trustworthy
3:03
AI Assistant
How do I write a cold email that actually gets a reply?
1
Subject line β€” short and specific. Avoid β€œquick question.” Try β€œ[mutual connection] suggested I reach out” or β€œidea for [Company].”
2
First line β€” lead with them, not you. No β€œmy name is” or β€œI hope this finds you well.” Try β€œSaw your post about X” or β€œNoticed you just launched Y.”
3
The ask β€” one thing only. Not β€œlet's explore synergies.” Just β€œDo you have 15 mins Thursday?”
4
Length β€” 5 sentences maximum. Nobody reads long cold emails.
5
Follow-up β€” once, 3–5 days later. Forward the original with a one-line bump.
Personalisation beats templates every time β€” one specific detail about them outperforms any optimised formula.
Write me an exampleSubject line ideasFollow-up template
Follow up...

Same advice β€” easy to trust, easy to act on. Numbered steps, bold labels, a distinct tip card. The AI feels more capable because its output looks more considered.

The good response isn't longer β€” it's actually slightly shorter. The visual structure does the cognitive work that would otherwise require more words. Numbered steps tell users how many items to expect. Bold labels let users scan before they read. The tip card at the end stands out as the most memorable piece. The same information, more legibly packaged, is experienced as higher quality output β€” regardless of the model that generated it.


Applying this to your work

The Aesthetic-Usability Effect is both a generous gift and a strict constraint. The gift: invest in visual quality and users will be more forgiving, more patient, and more likely to succeed when they hit friction. The constraint: the effect works on first impression and during smooth interactions, but it cannot survive genuinely broken functionality. Users who persist through a beautiful product's errors will eventually run out of goodwill if the errors don't get fixed.

The practical implication is that aesthetic quality and functional quality are not in competition β€” they are compounding. A well-designed interface that also works reliably earns disproportionate trust. A well-designed interface that doesn't work loses that goodwill faster than an ugly one would, because the gap between expectation and experience is larger. Design for both, in that order: make it work, then make it beautiful, knowing that making it beautiful will make the working feel better too.

βœ“ Apply it like this
β†’Invest in visual polish for your highest-stakes screens β€” onboarding, checkout, error states β€” where the aesthetic impression has the most consequence.
β†’Design error states with the same care as success states β€” warm language, clear actions, and a human tone. This is where the Aesthetic-Usability Effect is most valuable.
β†’Format AI output with structure, hierarchy, and intentional typography β€” numbered steps, bold labels, and distinct callouts increase perceived quality independently of content.
β†’Maintain visual consistency across the entire product β€” a polished landing page that leads to an undesigned dashboard breaks the effect and creates a credibility gap.
βœ— Common mistakes
β†’Treating aesthetic quality as optional polish applied after the product is "finished" β€” visual quality is part of the product, not decoration on top of it.
β†’Showing stack traces, error codes, or system language on public-facing error screens β€” these signals negate the effect and confirm user anxieties.
β†’Relying on aesthetic quality to cover for genuinely broken interactions β€” the effect buys time, not permanent forgiveness.
β†’Investing in marketing aesthetics while neglecting product aesthetics β€” users who arrive at a polished landing page and encounter an unpolished product experience the gap as a trust violation.

Kurosu, M., & Kashimura, K. (1995). Apparent usability vs. inherent usability. CHI '95 Conference Companion. Β· Lindgaard, G., Fernandes, G., Dudek, C., & Brown, J. (2006). Attention web designers: You have 50 milliseconds to make a good first impression. Behaviour & Information Technology, 25(2), 115–126. Β· Norman, D. A. (2004). Emotional Design. Basic Books.