The Grammar of Pressable

How does a shape learn to say “press me”?

Before buttons had labels

A raised circle on a panel. No word printed on it. Four things already tell a finger what to do: its shape, how far it travels, how hard it resists, where it sits relative to a hand.

Looks pressable

Confirm

Border. Depth. A contained shape. A label naming the action. Four signifiers, stacked on one rectangle.

Looks pressable, but isn’t

Draft saved

Same border, same depth, same shape. This one does nothing. It is a status message wearing a button’s clothes.

Is pressable, but doesn’t look it

Your session is about to expire. Stay signed in to keep working.

No border. No depth. No colour change. One of those words is a working control; the rest are prose.

Affordance

The raised circle invites a fingertip because of its curve, not because anyone was told what it does. That is affordance: what an object suggests about itself, before signage or history get involved.

Signifier

Confirm

The border and the shadow are not the button. They are a signifier: a signal placed on the button, telling a flat rectangle to read as raised. A doorbell’s actual raised rim does the same job with physics instead of a shadow.

Convention

Save
✓

Different shapes. Same expectation.

That learned agreement is convention — doing work that affordance and signifier alone can’t.

Invention

Go
Go
Go
Go

Each shape departs a little further from the last. Somewhere along this row a shape stops reading as a button at all. Convention has a breaking point; invention is what happens on the far side of it.

The two failures

Draft saved

Looks pressable. Isn’t.

Stay signed in to keep working.

Is pressable. Doesn’t look it.

Same fault, both directions: the signal and the behaviour have come apart.

Diagnosis

Continue

What exactly is missing here? Answer in terms of affordance, signifier, or convention — not in terms of taste.

Week 3 activity

Find one real interface element that is mis-clickable or visually ambiguous. Name which convention it breaks: affordance, signifier, or an established convention. Propose the smallest change that would make its pressability honest — not a redesign, the smallest change.

A button does not need to look like every other button. It does need to tell the truth about whether it can be pressed.