Affordance

Examples include buttons that appear clickable because of design choices and door handles that clearly indicate whether you're dealing with a push or pull mechanic.

Who came up with affordances?

When looking at the history of the term affordance, both Don Norman and James Gibson come to mind. James Gibson was the first to talk about affordances. He did so on multiple occasions.

• In 1966, he first mentioned affordances in a book called The Senses Considered as Perceptual Systems.

• Then, in 1979, he used affordances to describe how an animal analyses its environment before interacting with it. He did so in his second book, The Ecological Approach to Visual Perception.

Don Norman also talks about affordances. He does so in his famous book The Design of Everyday Things. He mentions how good use of affordances helps users naturally understand objects without needing labels or any further explanation.

For UX designers, this is important to remember when working on a design. Some users can understand a design element, while others do need extra help. It means that affordance is not a property of a product but rather depends on the relationship between the design element and the specific user.

What are the types of affordances?

In UX, we talk about several types of affordances. Understanding the basics, as mentioned above, should be a good starting point.

However, if you want to learn more about affordances, being able to differentiate between different types is an excellent next step. Here's a brief overview of affordance types.

• An explicit affordance is when it's visually self-explanatory what a design element can do. This is often based on real-life properties, such as a primary action button that appears clickable.

• Hidden affordances remain invisible until users need to interact with the design component. Examples include the tooltip that appears on hover.

• Negative affordances help users understand in what order they have to complete tasks. You notice this, for example, with a confirmation button that remains inactive until all form requirements have been met.

• False affordances miscommunicate design element behavior. For example, an element that looks like it is clickable by affordance while it isn't clickable.

Useful resources

The Design of Everyday Things - Wikipedia