Home › Interaction › Affordance
Affordance
A visual hint that tells the user what an element does.
Affordance is how an element communicates its purpose. A button looks pressable because it has shape, color, and shadow that say "click me." A draggable card might have a grab handle icon. A scrollable list shows a faint scrollbar.
Strong affordances make interfaces obvious. Weak affordances make even simple controls feel mysterious. The classic mistake is making everything look flat — when nothing looks clickable, users stop trying.