What designers call affordance, Norman calls a signifier

A lesson from The Psychology of Why Good Designs Fail. Play it above, or read it through below.

• An affordance is what an element can do, whether or not anyone sees it.

  The common read: Affordance is the visual signal that an element is interactive, so adding a shadow to a card adds an affordance to it.

  A shadow adds no affordance. The word names what an object's actual properties let a person do with it, and the property is there whether or not anybody perceives it: a borderless header region that opens the account menu on click affords that click even if nobody sees it. Affordance is a framework somebody proposed, not a result somebody measured. James Gibson coined the word in 1966 and set out the theory in full in his 1979 book. The framework describes one variable: what the element can do.

  Gibson's own sentences are not quoted in this lesson. Norman's 2008 essay summarises his position: "To Gibson, affordances did not have to be perceivable or even knowable." That is Norman's summary of Gibson and not Gibson's wording, so treat it as a summary.

  The test is one yes-or-no question: whether the action can happen. A settings row that opens its detail screen on tap can open it, even with no chevron, divider or fill. An order button that the address form has disabled cannot be pressed, despite its primary colour and hover state. Both sentences stay true whether or not anyone notices a cue. Norman describes Gibson's affordance as a relationship between a person and the thing, so the test asks what this person can do, not what they can see.

  A common failure: somebody reads the button's colour rather than its state and files a ticket titled "the order button does nothing" against the front-end build. An engineer closes it, noting that the address had not validated, and four more people file it that week. Split the question before anybody argues about the fix. Ask what the element can do, then ask what it shows. The first has an answer somebody can check in the build; the second is the one people in the review have opinions about.

• The cue is a second variable, and it is the one people see and act on.

  The common read: The tap still works and nothing in the build changed, so taking the borders off the settings list took nothing away.

  Taking the borders off took something away, and it was not the tap. Norman's word for what was removed is signifier, and the definition he published is deliberately wide: "A 'signifier' is some sort of indicator, some signal in the physical or social world that can be interpreted meaningfully." The sentence names no shadow, no border, no control and no screen: only a signal, and a person who can interpret it.

  Norman chose this definition in 2008; it is not a result he measured. He stated how the two halves connect: "The perceivable part of an affordance is a signifier, and if deliberately placed by a designer, it is a social signifier." The words "deliberately placed" are about designers: some signals are put there on purpose to announce an action. Whether the action works and whether a signal announces it are still two separate decisions, and a team can get either one wrong without the other.

  The second variable is also a yes-or-no question, and the first answer does not settle it: whether something a person can perceive announces the action. A chevron, a divider and a fill each announce it. A hover state announces it on a device with a pointer and not at all on a touch screen with no pointer. A help page announces it too, but only people already looking for the action read it. None of them changes whether the tap works, so the two questions have separate answers.

  A common failure: users open a support thread saying the settings do not open any more, against a release that changed no behaviour. Somebody re-tests the tap, finds that it works, and closes the thread, and users file the same complaint the next quarter. In the review, name the missing half in those words: the action is there and nothing announces it. That sentence takes three seconds to say. Without it, the team spends the next hour on the half that was already working.

• Two variables give four cells, and the obvious fix makes one of them worse.

  The common read: A thing that looks pressable and a thing that is pressable are one claim, so one fix covers both.

  The order button is drawn in full primary colour with a live hover state, and the address form has disabled it, so pushing its contrast and weight up until nobody can miss it

  Looking pressable and being pressable are two claims, and each can fail without the other. Whether the action can happen, and whether something perceivable announces it, are two yes-or-no questions over one element, which gives four states and not two. When both are present, nobody files a ticket. The other three states hold all of the problems, and this lesson gives two of them names.

  The invisible state has the action present and the announcement absent. The row responds to a tap, the header region opens the menu, and almost nobody finds either. Announcement present and action absent is the false promise, and it is the one that looks finished in a static mockup: the order button in the full primary colour that the address form has disabled, the drag handle whose behaviour did not ship, the full-fidelity picture of a search field inside an onboarding overlay that people keep tapping.

  The false promise needs a separate warning, because the obvious fix makes it worse. Raise the disabled button's contrast and weight and a button that does nothing becomes more prominent than before. A component library's variant list reads "Button / Primary / Disabled" directly above "Button / Primary / Disabled / Hover". The fourth cell, neither present, is a line of body copy with no behaviour and no cue. Like the cell where both are present, it is usually correct.

  A common failure: in a review thread three people agree the card needs work, the team ships a shadow, and the click rate does not change, because the route behind that card was never wired and nobody in the thread asked. Name the cell before anybody proposes a fix. Naming it takes one sentence, anyone can check it against the build, and it decides whether the team repairs the half that is broken or polishes the half that works.

• In 2008 Norman told designers to forget affordances.

  The common read: Affordance means the visual cue that shows something is interactive, so "this card needs more affordance" is a sentence about a drop shadow.

  The sentence "this card needs more affordance" is about a drop shadow, and the word in it is the wrong one. Don Norman brought the word into design, and in 2008 he published "Signifiers, Not Affordances" in Interactions: "When I introduced the term into design in 1988 I was referring to perceivable affordances. Since then, the term has been widely used and misused." The essay does not list which usages it counts as misuse. It tells designers which word to use instead.

  The correction adds a second word and tells designers to stop using the first: "Forget affordances: what people need, and what design must provide, are signifiers." It also says how the two words connect: "The perceivable part of an affordance is a signifier." This lesson still uses affordance for what the element can do, and signifier for the cue that announces it. The two can come apart. A shadow can announce a click that does not exist, and that case is the false promise from the four cells.

  The usage you hold is not carelessness and nobody in your review invented it. It is the dominant usage in design practice, and Norman's own 1988 popularisation started it. The cost is small and specific: when the missing half is the capability, a team with one word for both halves argues about shadows and has no word for what is wrong.

  In a critique thread about a visual mockup with no working build behind it, somebody writes that the card needs more affordance and means it needs a drop shadow. Ask about the other half out loud: "Do you mean the cue, or do you mean the click?" The question takes four awkward seconds in a review, and not asking it costs a sprint spent on the half that was already there. An affordance is what the element can do, and a signifier is what shows that it can.