What one annoying Cancel button teaches us about interfaces that respect human intuition
While trying a checkout-style interface, a Cancel-type button appeared in the lower-right area.
For a split second, it looked like the kind of place where a forward or confirmation action would be. One wrong move was enough to make the interface irritating.
The lesson is not “Cancel must never be on the right.” Platforms and products have different conventions. A right-side Cancel button is not automatically bad design.
The real problem is a mismatch between what people predict from past experience and what the interface actually does.
People do not approach every interface as a blank slate. They bring years of experience with phones, websites, checkouts, ticket machines, remote controls, elevators, and operating systems. If a design fights those expectations, it can become an interface that is understandable after reflection but error-prone in the first half-second.
Many everyday errors are not carefully reasoned wrong decisions. They are slips made while moving quickly, repeating a familiar task, or reaching toward two similar controls placed too close together.
This article starts with that small Cancel-button irritation and expands it into a broader question: What does a genuinely human-friendly UI/UX look like?
The short answer is not “more instructions.”
It is: be predictable, reduce accidental actions, make recovery easy, and do not force people to process options they do not need yet.
0. The 30-second version: stop asking only why the user made a mistake
A human-friendly interface usually follows a few simple priorities.
- The same words should lead to the same kind of outcome.
- Common actions should follow familiar placement and conventions when possible.
- Controls with very different consequences should not look nearly identical and sit shoulder-to-shoulder.
- High-cost actions should be reversible when possible, or clearly explain their consequences before commitment.
- Tap targets need enough size and spacing.
- Advanced features can stay. They do not all need to be visible at once.
- Do not treat the number of choices as the only problem; comparison difficulty matters.
- Watch what people do immediately after a click: fast Back actions and instant reversals can reveal hidden confusion.
An interface is not an exam.
The goal is not “Can the user figure this out?” It is “Can the user usually do the right thing without needing to stop and solve the interface?”
1. “Intuitive” usually means “reusing something people already learned”
People carry a model in their heads of how a product probably works. UX research calls this a mental model.[1][2]
A magnifying glass suggests search. A left arrow suggests back. A trash can suggests delete. A play triangle suggests play.
Most users are not logically proving those meanings each time. They are borrowing them from prior products.
That is why novelty can become expensive. If search is represented by an unfamiliar star, or closing a panel uses a mysterious symbol, the design may look original to its creator while becoming a quiz for everyone else.
Nielsen Norman Group's heuristics emphasize matching real-world expectations and maintaining consistency with product and platform conventions.[1]
Spatial compatibility matters too. Research on stimulus-response compatibility finds more errors when spatial cues and required responses conflict than when they align.[3]
So the principle is simple:
Do not make people reboot their previous experience.
Spend novelty where it creates real value. Borrow familiar grammar everywhere else.
2. A mistake and a slip are not the same thing
It helps to separate two kinds of failure.
A user may misunderstand the system and make the wrong decision.
Or the user may understand perfectly and still hit the wrong control.
NN/g distinguishes these broadly as mistakes and slips.[1]
If someone thinks a button saves when it actually deletes, the problem may be comprehension.
If someone knows exactly which button deletes but accidentally taps it because Save is next to it, that is much closer to a slip.
Telling the second person to “read more carefully” is weak design.
If every interaction required perfect attention, much of interface design would be unnecessary.
The highest-risk pattern is proximity between actions with very different consequences: Save and Discard, Send and Cancel, skip ten seconds and leave the current article.
NN/g explicitly warns that destructive and confirmation actions placed together can produce accidental substitutions, especially during repetitive or rushed work.[4]
Different consequences deserve different visual and spatial treatment.
3. Before adding another confirmation dialog, ask whether the action can be undone
Delete. Cancel subscription. Remove everything. Discard changes.
The reflexive design response is often: add a confirmation dialog.
But confirmation is not magic.
If every routine action asks “Are you sure?”, people learn to click through the warning automatically. NN/g recommends reserving confirmations for serious consequences, describing the concrete outcome, and providing Undo whenever possible.[5]
“Are you sure? Yes / No” is weak.
“This will delete 3 items. They can be restored for 30 days” followed by “Delete 3 items” and “Keep them” is much clearer.
Human-friendly design does not assume errors can be eliminated.
It reduces the cost of being human.
4. Target size is only half the story; distance from neighboring actions matters too
WCAG 2.2 Target Size (Minimum) generally requires pointer targets to be at least 24 by 24 CSS pixels or to provide sufficient spacing.[6]
Its own example is wonderfully direct: a person means to hit Submit and accidentally hits Cancel.
The Enhanced criterion uses 44 by 44 CSS pixels, and Apple generally recommends a hit region of at least 44 by 44 points for buttons.[7][8]
But “make everything 44” is still not the whole solution.
Consider:
- target size
- spacing
- severity of the action
- frequency
- whether the control sits near an edge
- whether a visually similar neighbor does the opposite thing
A large Delete button beside a large Save button can still be a trap.
5. “The feature exists” and “show the feature right now” are different decisions
Powerful products accumulate features.
Listen. Speed read. Bookmark. Playlist. Previous section. Next section. Previous article. Next article. Learning mode. Settings. Offline save.
Every feature can be useful.
Showing all of them at once can still be hostile.
Progressive disclosure keeps frequent, core actions visible and moves advanced or rare actions behind a secondary layer. NN/g describes this as a way to improve learnability, efficiency, and error rate.[9]
The practical rule is:
Do not delete the feature. Fold it.
A fully loaded ramen bowl is great when someone orders one. It does not belong inside the water glass of a customer who only came to drink.
6. Are more choices always worse? No—and that nuance matters
UI discussions often invoke Hick's law as “fewer options are better.”
Hick's law does relate reaction time to the number of alternatives or uncertainty, and a modern review notes its continued importance in human-computer interaction.[10]
But the same review also discusses effects of stimulus-response compatibility, practice, very large sets, and sequential dependencies.[10]
Choice overload is equally conditional.
A 2010 meta-analysis found an average effect close to zero with substantial variation across studies.[11]
A later 2015 meta-analysis identified moderators such as choice-set complexity, task difficulty, preference uncertainty, and an effort-minimizing goal.[12]
So ten options are not automatically bad.
Ten hard-to-distinguish options shown to a tired person who must decide immediately are much more likely to be a problem.
A content site can own a thousand articles.
The mistake is asking someone who just finished one article to compare all thousand.
Large inventory in the system; small decision surface in the moment.
7. A self-audit of a content site found the same traps
Applying these principles to a content-heavy site produced several useful examples during an audit.
7-1. A keyword in the title triggered the wrong “next step”
An article about AI development happened to mention moving house in its title, so the interface surfaced a moving-related action before the body.
The machine matched a keyword.
The human reaction was: “That is not what this article is about.”
The feature worked technically while failing semantically.
7-2. Ten-second skip, section navigation, and article navigation shared one control strip
A player placed previous article, previous section, rewind ten seconds, play, forward ten seconds, next section, and next article in one horizontal transport.
The icons were not identical, but the consequences were dramatically different.
Accidentally leaving an article when trying to skip ten seconds is the same family of problem as the checkout Cancel trap.
Local movement and page navigation should be separated.
7-3. The same “Search articles” label led to different places
One instance opened a dedicated search page. Another sent people to a search area on the home page.
That forces users to relearn the meaning of the same label.
7-4. A long table of contents appeared before the content
A long article benefited from a table of contents.
But showing all seventeen entries before the first paragraph turned “read” into “choose among seventeen things” before the article even started.
A compact first layer with expandable detail would preserve the information without front-loading the comparison burden.
7-5. “Listen to all search results” became the strongest button
Batch listening is a useful power feature.
For many searchers, however, the ordinary task is to inspect results and open one item.
Making the special mode the strongest primary action inverted the likely task hierarchy.
7-6. The article ending accumulated related links, rankings, search, newsletter, and author information
Every component had a reason to exist.
That does not mean they all need equal priority at the exact moment someone finishes reading.
A gentler sequence is: one or a few strong next reads first, broader exploration second, subscription and site information later.
7-7. Subscribe and unsubscribe actions appeared too close in visual hierarchy
Those actions point in opposite directions.
Opposite consequences should look and feel different.
The amusing lesson is that even a site actively thinking about UX can still plant its own traps.
Creators know what every feature means. New users do not.
8. Advertising is not automatically bad UX; hijacking the reading task is
Advertising can fund a site. Its presence alone does not make a page hostile.
Attention placement is the issue.
Eye-tracking research on web advertising found that banner properties such as distance and animation affected visual behavior, and that ads could interfere particularly during reading-for-comprehension tasks that require more cognitive resources.[13]
For article pages, that suggests a practical attention budget:
- do not stack ads, player controls, a giant TOC, and signup prompts before meaningful content
- avoid placing ads too tightly against reading targets
- collapse empty ad space
- keep accidental-click distance from links and controls
This is not “ads versus readers.”
It is simply asking: What did the person come to this page to do?
9. A human-friendly UI/UX QC checklist
Predictability
- Does the same label produce the same kind of result?
- Do icons preserve familiar meanings?
- Does placement break platform conventions without a strong reason?
- Can a first-time user roughly predict the outcome before clicking?
Error prevention
- Are opposite actions adjacent?
- Does a destructive action look as prominent as the primary action?
- Can mistakes be undone?
- If confirmation is necessary, does it state the exact consequence?
Touch and pointer use
- Are important targets large enough?
- Are small controls packed together?
- Are edge controls difficult to reach?
- Are high-cost actions given extra separation?
Information load
- Is the main task visible?
- Are advanced features unnecessarily exposed at first?
- Can long TOCs, filters, and recommendation sets expand progressively?
- Is the first comparison set kept manageable without deleting the underlying inventory?
Consistency
- Does the product use the same interaction grammar throughout?
- Does it preserve useful expectations learned from other products?
If the team still argues after this checklist, a small usability test is often more valuable than another hour of designer debate.
10. The most useful UX data may be what happens immediately after the click
Click-through rate rewards visibility. A loud button often gets clicks.
That does not prove it was helpful.
More revealing signals can include:
- clicking and pressing Back within seconds
- turning something on and immediately off
- navigating away and immediately returning
- repeated clicking on the same area
- abandonment after an error
- successful recovery on the second attempt
- unusually long time before reaching the page's primary content
These are not perfect proof of confusion. A fast return can be intentional.
Use them as aggregate, privacy-preserving clues rather than diagnoses of individual users.
A useful improvement loop is:
hypothesis → small reversible change → observe correction behavior → keep if better → revert if worse
Designer confidence is evidence of designer confidence.
User behavior is evidence of user behavior.
11. Conclusion: kindness is not more explanation; it is fewer traps
A good interface is often invisible.
The button works. Back works. The expected thing is where it should be. The user moves on.
A bad interface can announce its existence with one wrong tap:
“Why on earth is Cancel there?”
That is the moment the interface becomes the main character.
The better goal is to make the machine adapt to human expectations rather than requiring humans to memorize the machine's private logic.
Keep the advanced features. Keep the large content library. Keep monetization when needed.
But show the right thing at the right moment, separate opposite actions, reflect consequence in visual hierarchy, and make recovery possible.
Human-friendly UI/UX is not design that demands smarter users. It is design that remains safe when ordinary humans behave like ordinary humans.
Sources
- Nielsen Norman Group, “10 Usability Heuristics for User Interface Design nngroup.com
- Nielsen Norman Group, “Mental Models nngroup.com
- Christ et al. (2000), spatial stimulus-response compatibility and errors pubmed.ncbi.nlm.nih.gov
- Nielsen Norman Group, “Top 10 Application-Design Mistakes nngroup.com
- Nielsen Norman Group, “Confirmation Dialogs Can Prevent User Errors — If Not Overused nngroup.com
- W3C WAI, WCAG 2.2 “Target Size (Minimum) w3.org
- W3C WAI, WCAG 2.2 “Target Size (Enhanced) w3.org
- Apple Human Interface Guidelines, “Buttons developer.apple.com
- Nielsen Norman Group, “Progressive Disclosure nngroup.com
- Proctor & Schneider (2018), “Hick's law for choice reaction time: A review pubmed.ncbi.nlm.nih.gov
- Scheibehenne, Greifeneder & Todd (2010), “Can There Ever Be Too Many Options? doi.org
- Chernev, Böckenholt & Goodman (2015), “Choice overload: A conceptual review and meta-analysis doi.org
- Hervet et al., online advertising, visual attention and reading pmc.ncbi.nlm.nih.gov
