An affordance is a visual property of an object or element that hints at how it should be used — a physical door handle suggests pulling, a flat push plate suggests pushing.
Digital Affordances
A button that looks raised or has a shadow suggests it's clickable; underlined blue text suggests a link — these visual conventions guide behavior without needing explicit instructions.
What Happens When Affordances Are Missing
An interactive element that doesn't visually signal its interactivity (flat text that's secretly clickable, for instance) creates genuine confusion and missed interactions.
Respecting Established Conventions
Fighting well-established affordances (making a button look like plain text, for example) for the sake of a unique aesthetic usually costs more in usability than it gains in visual novelty.
Español
Deutsch