Affordances and signifiers in UX
Those of us in UX Design have to make products usable, and precisely one of Jakob Nielsen’s 10 usability heuristics for user interface design talks about consistency and standards.
This implies that users should not have to wonder whether different words, situations or actions mean the same thing.
Linked to this, in the world of UX we find two very interesting concepts that we use to explain how a user identifies how to use a digital product: affordance and signifiers.
What does the concept of affordance mean?
Affordance is the ability of a product to make the user anticipate how to use it. They are signals that provide information about how we can interact with something, regardless of whether it is physical or digital.
This concept was introduced to the world of UX design by Don Norman in 1988. Don Norman defined affordance as perceivable action possibilities, meaning the actions that users consider possible.
This means that UX Designers must create the possibilities of objects to fit the needs of users based on their physical and perceptual capabilities, goals and past experiences.
Users will map the possibilities of what an object does according to their conceptual model of what that object should do (for example, inserting fingers into the holes of scissors to cut). And the same will happen in a digital product (clicking on a button because it is shaped like a rectangle with rounded corners and the CTA tells us where it is going to take us).
What does the concept of signifier mean?
In general terms, a signifier is an entity that is perceived through the senses. In the world of UX Design, it is a concept that was also introduced by Don Norman, through his book “The Design of Everyday Things”, in 2013.
Signifiers are perceptible clues that UX Designers include in interfaces so that users can easily find out what to do.
Signifiers optimise affordance. This means that they emphasise the possible actions a digital object or product enables by indicating where and how to act. UX Designers use markings, sounds and other cues to help people perform the right tasks.
How are affordances and signifiers used in UX?
An affordance is a cue that informs of an action that something can perform. A signifier is the indicator of that possibility. Both features are used together to convey meaning.
For example, a button with a button appearance will be perceived as an element that can be pressed to produce an action (affordance). Clickable buttons generally have a drop shadow effect to show that they are clickable, while inactive buttons have a faded colour to show that they are inactive (signifier). In this case, affordance and signifiers have been used to:
- Indicate what the element can do (affordance)
- Indicate its current state and meaning (signifier)
Both features are used to improve usability and accessibility, and to reduce the error rate when using the digital product.
As UX Designers, we have an obligation to design in a way that users understand what each element can do. This seems very obvious, but it is not always taken into account. Let’s see it with an example:
Let’s imagine we are designing a user interface, and our main colour happens to be grey. If we use it on an important button (on a CTA), the signifier and colour consistency contradict each other, because grey usually means that the button is inactive. This will create a lot of confusion for users and lead to unnecessary errors.
Ultimately, as UX Designers we have to ensure that design decisions are logical and meet the objective of improving user experience and accessibility.
This is one of the topics we deal with in our Specialisation Programmes (these trainings are in Spanish). You can check them out here:
This article is a translation of the following one published on our corporate website:
