A web designer creates a fully functional clickable button but styles it as flat, unstyled text — no border, no shadow, same color as surrounding body text. Users consistently ignore it. What affordance problem occurred?
AThe button needs a text label explaining it is interactive
BThe button's real affordance (clicking) exists but the perceived affordance does not — flat, unstyled text signals 'read me,' not 'click me.' Users won't attempt an action they cannot perceive is available.
CThis is a color contrast accessibility issue, not an affordance problem
DFlat design is always inaccessible and should be avoided in all interfaces
Norman's key insight is that perceived affordances — not real ones — govern user behavior. The button is technically clickable (real affordance), but nothing in its visual presentation suggests that action is possible (weak perceived affordance). Since users' actions are guided by what they perceive, the real affordance might as well not exist. The fix is not adding instructions but aligning the visual form with the intended action: raised appearance, distinct color, hover state — the visual vocabulary of clickability.
Question 2 Multiple Choice
A designer notices that users grab a door's flat push-plate and try to pull, even though the door swings outward. She plans to add a 'PUSH' label. A colleague suggests replacing the push-plate with a vertical bar handle instead. Who has the better solution, and why?
AThe label is better — clear textual instructions always override visual ambiguity and are more universally understood
BThe handle is better — correcting the perceived affordance through form is more powerful than compensating for a failed affordance with a label that users must consciously read and override their instinct to pull
CBoth solutions are equivalent — labels and affordances are just two valid strategies for the same communication goal
DNeither will work — once users develop a habit of pulling the door, no design change will overcome it
A label is a compensatory workaround, not a solution. It asks users to override their natural response (pulling a handle) with a verbal instruction they must consciously notice and interpret. A push-plate naturally affords pushing — there is nothing to grab, so the hand goes to it palm-first rather than fingers-first. When form communicates function directly, the interaction is frictionless. This is Norman's 'Norman door' lesson: instructions on an interface are a symptom of failed affordances, not a remedy.
Question 3 True / False
Perceived affordances matter more than real affordances in design, because if a user cannot perceive that an action is possible, the real affordance is effectively invisible to them.
TTrue
FFalse
Answer: True
This is the central distinction Norman drew between Gibson's original concept and the design application. Gibson cared about what actions an environment actually supports (real affordances). Norman's contribution was recognizing that for design purposes, what the user *perceives* is possible is what drives behavior. A door with a pull handle on the push side has the real affordance of pushing open — but the perceived affordance is pulling. Users pull. The real affordance is irrelevant until perceived. This is why designers must communicate affordances visually, not just build them in.
Question 4 True / False
A greyed-out, disabled button communicates too many affordances and should be removed from the interface mostly to avoid confusing users.
TTrue
FFalse
Answer: False
A greyed-out disabled button communicates a *clear and specific* affordance: 'this action exists but is not currently available.' Reduced contrast and the absence of hover effects together signal 'not available' rather than 'not interactive at all.' This is useful: it tells the user that the action is real and will become available later, which is more informative than simply hiding the element. Removing it would leave users wondering whether the action exists. The grey state is a well-understood affordance convention in UI design.
Question 5 Short Answer
What is the difference between a real affordance and a perceived affordance, and why did Donald Norman argue that perceived affordances are what designers should care about?
Think about your answer, then reveal below.
Model answer: A real affordance is what an object or interface actually allows a user to do — determined by its physical or functional properties. A perceived affordance is what a user believes they can do based on the visual, tactile, or spatial cues the design presents. Norman argued that designers must focus on perceived affordances because user behavior is governed by perception, not by the designer's intentions. If a design fails to communicate that an action is possible — even if it technically is — users will not attempt that action. The goal is to align perceived affordances with real ones: make every intended interaction visually obvious, and make unintended interactions visually absent or clearly disabled.
The practical implication is the 'instructions test': if you find yourself writing documentation to explain how to use an interface element, that element's perceived affordances have failed. Well-designed affordances are self-evident — users reach for the right action without being told, because the form itself communicates the function.