Affordances and Signifiers

A door handle affords pulling. A flat plate affords pushing. The shape communicates the action. When the shape is wrong — a pull handle on a push door — the interface fails before any digital interaction begins.

Affordances

An affordance is the relationship between an object and the person using it — specifically, what actions the object makes possible. A button affords clicking. A slider affords dragging. A link affords navigating. Affordances are not visual properties — they are functional relationships. A glass affords drinking whether or not there is a label saying “glass.”

Signifiers

A signifier is the perceivable cue that communicates an affordance. It is the visual, auditory, or tactile signal that tells a user what action is possible. The raised edge of a button is a signifier for clicking. The underline on a link is a signifier for navigation. The drag handle icon is a signifier for dragging. Without signifiers, affordances are invisible — the interaction exists but cannot be found.

The design problem

The most common failure is relying on affordances that users cannot perceive. A flat, unlabelled element with no visual differentiation from surrounding content may be clickable — but nothing signals that it is. This is the “mystery meat navigation” problem: the interaction exists, but the signifier that would reveal it is absent or insufficient.

False affordances

A false affordance is a signifier that implies an action that is not possible. Underlined text that is not a link. A raised, button-like element that does nothing when clicked. A progress indicator that does not represent real progress. False affordances are worse than missing signifiers — they create active confusion and erode trust in the interface.

Signifiers in digital interfaces

In digital interfaces, signifiers are primarily visual: colour, shape, elevation, borders, cursor changes, and motion. A button’s filled background, border radius, and hover state all function as signifiers. Remove them and the affordance becomes invisible. The challenge in flat design is that reducing visual signifiers in the name of aesthetics removes the cues that make interaction legible — and the interface relies on users already knowing where to click.

The takeaway

For every interactive element, ask: what does this afford, and what signifies that affordance? If the signifier is absent, add one. If it is ambiguous — equally present on non-interactive elements — make it more distinct. A consistent signifier system across the interface teaches users what is interactive without requiring them to discover it by trial and error.