Qu’est-ce que l’affordance ?

L’affordance est un mot couramment utilisé dans le domaine de la conception d’interface centrée utilisateurs (UX). Créé dans les années 1970 par le psychologue américain James J. Gibson, ce terme s’est popularisé par Donald Norman, auteur du célèbre ouvrage « The Design of Everyday Things ». Alors que ce concept semble davantage du registre de la psychologie, voyons comment il peut tout aussi bien constituer un principe clé dans la conception d’interface utilisateur et l’UX Design.

De la psychologie à l’UI/UX Design

Terme d’origine anglaise, l’affordance renvoie à la notion de « potentialité », marquant un champ d’investigation très large. De nombreuses disciplines l’utilisent ou y font référence comme la psychologie cognitive, la psychologie ergonomique, le design, l’interaction homme-machine ou bien encore l’intelligence artificielle. D’un point de vue psychologique, l’affordance désigne donc l’ensemble des possibilités d’actions sur un objet. En revanche, dans le domaine de l’expérience utilisateur (UX), l’ergonomie des interfaces et les interactions hommes-machines, son emploi est plus restreint, puisque l’affordance se réfère davantage la « capacité d’un objet à suggérer sa propre utilisation » sans avoir à lire nécessairement pour cela un mode d’emploi. Dans ce dernier cas, l’affordance et la possibilité d’une utilisation intuitive d’un objet sont synonymes.

Alors que le psychologue James J. Gibson donna forme au concept en proposant le terme affordance dans son ouvrage majeur « The théorie of affordances », c’est en 1988 que Donald Norman dans son ouvrage : « The Design of Everyday Things », réutilisa le terme dans le domaine de l’interaction homme-machine afin de désigner les potentialités d’action perceptibles par l’utilisateur d’un programme. Il s’agit ici de capacités de perception pour les utilisateurs pouvant variées selon leurs objectifs, leurs convictions ou leurs expériences passées. Parfois même des affordances peuvent être des contraintes.

L’affordance perçue” selon Donald Norman

Donald Norman s’approprie ce concept en 1988, dans la première version de son ouvrage « The Design of Everyday Thing ». L’apparence est une clé pour permettre à l’utilisateur de trouver ce qu’il recherche, de comprendre son fonctionnement et de l’utiliser. C’est donc l’une des bases d’un design réussi.

Dans le domaine de la conception des interfaces UI (User Interface) l’affordance constitue un point clé. Elle facilite le choix des bons éléments interactifs. Elle donne par conséquent aux utilisateurs tout un panel d’indice et d’éléments indiquant la manière dont ils devraient finalement agir et ce qui se passera en définitif, lorsqu’ils le feront.

Comme c’est le cas par exemple des boutons et leur conception graphique avec des bordures, des ombres et contrastes, pouvant donner l’impression que ces boutons sont sur élevés et d’être utilisés comme dans la vie réelle.

Ce procédé ou style de conception graphique d’interface est plus généralement connu sous le nom de Skeuomorphisme. Le but étant d’adapter les qualités visuelles et psychiques à une interface numérique.

Tout en sachant également, que tout choix de conception doit respecter l’aspect général de l’interface. Ce qui compte in fine, c’est le boutons reste cliquables. C’est aussi le cas pour l’utilisation des icônes claires servant par là même à définir le but d’un lien et à renforcer l’action des utilisateurs. C’est pourquoi les concepteurs en UI/UX Design doivent rester au fait des tendances et des modèles. La conception de l’interface utilisateur est une mine de bonnes pratiques que chaque UI/UX Designer doit forcément comprendre.

Skeuomorphisme de l’interface iOS 6 contre flat design de l’interface iOS 7

Exemple d’une interface en Material design, le Design selon Google

Affordance et culture

L’affordance ne dépend pas uniquement des propriétés physiques d’un objet (comme une poignée qui « appelle » la main), mais aussi du bagage culturel de l’utilisateur. Ce que Donald Norman appelle parfois les « conventions » sont en réalité des affordances culturelles : des possibilités d’action apprises au sein d’un groupe social. L’affordance a fort à voir avec la “culture” comme le montre très bien cette présentation. Le produit joue un rôle social essentiel dans nos vies. Il n’est pas étonnant que son acceptation consiste en une dimension culturelle très marquée, au point parfois de devenir “critique” (slide 41 et suivantes)

• L’héritage des habitudes : Un utilisateur occidental interprète instinctivement une icône de disquette comme l’action « sauvegarder », alors qu’une nouvelle génération n’a jamais vu l’objet physique. Ici, l’affordance est purement symbolique et culturelle.
• La lecture et le sens : Le sens du balayage (swipe) ou l’emplacement des boutons de validation peuvent varier selon les cultures (lecture de gauche à droite vs de droite à gauche). Ne pas respecter ces codes peut rendre une interface « aveugle » aux yeux de l’utilisateur local.
• L’acceptation sociale : Comme le souligne la présentation de Jean-Luc G. (IxDA), un produit joue un rôle social. Une affordance peut être techniquement parfaite mais culturellement « critique » si elle va à l’encontre des mœurs ou des rituels d’un pays. Par exemple, la manière de présenter un paiement en ligne ou de gérer la confidentialité des données varie drastiquement entre l’Europe, l’Asie et l’Amérique du Nord.

FAQ : Tout comprendre sur l’affordance

Quelle est la différence entre l’affordance selon Gibson et selon Norman ?

Pour le psychologue James J. Gibson, l’affordance est une propriété physique réelle (un escalier permet de monter). Pour Donald Norman, dans le design, on parle d’affordance perçue : c’est ce que l’utilisateur croit pouvoir faire en regardant l’interface, que cette action soit réellement possible ou non.

Pourquoi le skeuomorphisme est-il lié à l’affordance ?

Le skeuomorphisme (imiter des textures réelles comme le cuir ou le métal) utilise l’expérience du monde physique pour suggérer l’usage numérique. Un bouton avec une ombre portée « indique » qu’il peut être enfoncé, facilitant ainsi la compréhension immédiate sans manuel d’utilisation.

L’affordance est-elle la même pour tout le monde ?

Non. Elle varie selon les capacités physiques (accessibilité), les expériences passées et la culture de l’individu. Un élément interactif évident pour un « digital native » peut être invisible pour une personne n’ayant jamais utilisé de smartphone.

Qu’est-ce qu’une « fausse affordance » ?

Il s’agit d’un élément visuel qui suggère une action qui n’existe pas. Par exemple, un texte souligné en bleu qui n’est pas un lien cliquable, ou un bouton en relief qui ne déclenche aucune action. Cela génère de la frustration et dégrade l’expérience utilisateur.

Quel est le lien entre affordance et design plat (Flat Design) ?

Le Flat Design a réduit les indices visuels (disparition du relief). Pour compenser cette perte d’affordance physique, les designers utilisent désormais d’autres codes : la couleur, la typographie, ou des micro-animations au survol pour indiquer que l’élément est interactif.

Lire aussi : Quels livres faut-il lire pour comprendre l’affordance ?