Signifiers

In 2013, Don Norman drew a distinction that had been getting confused for years. An affordance is what something can actually do — a chair can be sat on, a button can be pressed. A signifier is what communicates that affordance — the raised shape of a button, the cursor change on hover, the underline on a link. The affordance is physical. The signifier is communicative. A door can be pushed or pulled — that's the affordance. Whether it has a handle or a flat plate tells you which one to do. That's the signifier.

On screen, almost everything is flat. Nothing is physically pressable or pullable. The entire language of interactive versus non-interactive elements is communicated through signifiers alone — shadows that suggest depth, borders that suggest fields, colours that suggest actions. When those signals are clear, users navigate without thinking. When they're missing or ambiguous, users pause, guess, or give up.

The failure mode is always the same: a designer who has used an interface hundreds of times stops seeing it as new users do. The interactive elements are “obvious” because they've become familiar, not because they were ever clearly signified. Users encounter the interface once, cold, with no prior exposure. Whatever the visual language communicates in those first seconds is all they have.

“A signifier is a signal. Whatever it signals is what matters — not whether it was intended to signal it.”
— Don Norman, The Design of Everyday Things (revised), 2013

Buttons — what makes something look pressable

A button is just a label until it looks like a button. The signifiers that make it pressable — the filled background, the rounded corners, the visual separation from the surface — are doing all the work. Remove them one by one and watch the same element become progressively less obviously interactive. The text hasn't changed. The function hasn't changed. The signal has.

The interactive demo below lets you strip each signifier away from a primary action button. Each state is still technically a button — click it and it responds. But each removal makes it less obviously clickable. Try clicking the most-stripped version and notice how long you hesitate.

The fully-signified version is immediately recognisable as a button. The fully-stripped version — plain text on a plain background with a default cursor — is indistinguishable from a label. Both work if you click them. But only one communicates “click me” without requiring the user to already know that.

Flat design trends in the early 2010s stripped many of these signifiers in the name of cleanliness. The resulting interfaces were elegant but frequently unusable — users couldn't tell what was interactive and what wasn't. The industry gradually added signifiers back, sometimes calling it “almost flat” design. The lesson was that signifiers aren't decoration. They're functional communication.

Form fields — missing signifiers, silent confusion

Form fields are the most signifier-dependent elements in any interface. A user arrives at a blank field and needs to answer three questions instantly: Is this editable? What should I put in it? Is it required? Without the right signifiers, those questions produce hesitation — and hesitation on a form produces abandonment.

Both forms below collect the same information. The bad version strips the signifiers — no visible field borders, no placeholder text, required fields unmarked, a submit button that blends into the background. The good version restores them. The information being requested is identical. The experience of filling it in is completely different.

Count the signifiers in the good form: the field border (editable), the placeholder text (expected input), the asterisk (required), the focus state colour change (active and being edited), the hint text below the password (rules), and the filled button (primary action). Each one answers a specific question a user might have. Remove any one and that question goes unanswered.

Applying this to your work

The practical test for signifiers is simple: hand your design to someone who has never seen it and watch where they hesitate. Every hesitation is a missing or unclear signifier. They're not confused because the task is hard — they're confused because the visual language didn't communicate what to do next.

Signifiers don't have to be heavy-handed. A 1px border on a field, a subtle shadow on a button, a colour change on hover — these are small signals. But small, consistent signals are what allow users to move through an interface without thinking. The goal isn't decoration. It's friction-free understanding.

Norman, D. A. (2013). The Design of Everyday Things (revised and expanded edition). Basic Books. · Norman, D. A. (2008). Affordances and design. jnd.org.