Une interface réussie, c’est une interface qui donne des renseignements clairs et précis à l’utilisateur, afin de permettre à celui-ci de repérer, sans erreur, ce qui est actionnable ou non. Afin de remplir au mieux ce défi, la notion d’affordance peut aider à l’élaboration d’une interface.
La notion d’affordance
L’affordance est une notion inventée par James J. Gibson à la fin des années 1970. Elle fût décrite dans le cadre de recherches en psychologie cognitive. Le terme a ensuite été repris en 1988 par Donald Norman, dans son livre intitulé The Psychology of Everyday Things.
Le concept d’affordance peut se décrire dans une interface comme le fait de mettre en évidence ce sur quoi l’utilisateur peut agir. Une affordance est une possibilité d’action proposée par la ou les caractéristiques d’un objet. L’exemple couramment utilisé est celui d’une porte. Une fois devant, plusieurs informations permettent de savoir si nous devons la pousser, la tirer, la faire glisser… Pour connaitre la réponse, certains signes, implicites comme la forme de la poignée, et des signes explicites, comme une information écrite “Tirez”, permettent inconsciemment d’obtenir la réponse.
Des Call-to-action affordants grâce à leur format
Un Call-to-action affordant est donc un design qui permet à l’utilisateur de repérer rapidement, et sans équivoque les objets importants sur lesquels il peut agir. Pour y parvenir il faudra les distinguer du reste de l’écran. Le principe de point focal peut contribuer à l’élaboration du design. Ce principe fait référence à la loi de Gestalt qui nous apprend que lors de la perception visuelle d’une scène, notre attention est naturellement focalisée vers les éléments mis en évidence, qui se distinguent donc du reste de la scène.
Le point focal est un concept fortement ancré dans notre inconscient. C’est un phénomène qui nous permet de distinguer certains dangers dans notre environnement, de manière naturelle ou par conditionnement. La couleur rouge est par exemple utilisée dans nos cultures occidentales, afin de mettre en avant un danger, attirer notre attention sur celui-ci en créant un point focal.
Néanmoins il est important d’utiliser des éléments qui devraient agir comme point focal avec parcimonie. La répétition peut nuire à l’efficacité de ce que l’on cherche à mettre en avant. Il est nécessaire de contraster les éléments vraiment importants que l’on souhaite souligner.
Un Call-to-action affordant est donc un élément qui se distingue du reste des écrans, par sa taille, sa couleur, la police utilisée, l’iconographie, que l’on soit sur mobile, tablette ou desktop. Cependant, il est important que cet élément respecte des codes conventionnels : les boutons, lien et menus, doivent ressembler à ce que l’utilisateur connaît des boutons, liens et menus selon ses expériences passées.
À gauche, l’écran de Spotify, qui propose une “Lecture aléatoire”. L’utilisateur se voit donc proposer un parcours avec une aide à l’action et à la navigation. Le Call-to-action reprend les codes conventionnels, il est aisé de comprendre qu’il s’agit d’un bouton, les couleurs sont contrastantes avec le reste de l’écran.
À droite, l’écran de l’application Chauffeur Privé. Le Call-to-action rempli ici un objectif d’action clair et précis : “Valider son point de départ” afin d’être localisé et définir un trajet. Au même titre que Spotify, le bouton d’action se distingue du reste de l’écran. Il est tout de suite identifiable comme moyen d’action. Il est aussi mieux placé car plus facilement accessible lors d’une navigation à une main.
Des Call-to-action affordants grâce à leur format
Prévoir des Call-to-action affordants, c’est permettre à l’utilisateur de repérer rapidement, et sans équivoque les objets importants sur lesquels il peut agir. Pour y parvenir il faudra les distinguer du reste de l’écran. La notion du point focale est alors décisive afin de représenter cet enjeu. Pour évoquer la notion de point focal, il faut faire référence à la loi de Gestalt qui nous apprend que lors de la perception visuelle d’une scène, notre attention est naturellement focalisée vers les éléments mis en évidence, qui se distinguent donc du reste de la scène.
Le point focal est un concept fortement ancré dans notre inconscient. C’est un phénomène qui nous permet de distinguer certains dangers dans notre environnement, de manière naturelle ou par conditionnement. La couleur rouge est par exemple utilisée dans nos cultures occidentales, afin de mettre en avant un danger, attirer notre attention sur celui-ci en créant un point focal.
Néanmoins il est important d’utiliser des éléments qui devraient agir comme point focal avec parcimonie. La répétition détruit l’efficacité de ce que l’on cherche à mettre en avant. Il est nécessaire de contraster les éléments vraiment importants que l’on souhaite souligner.
Un Call-to-action affordant est donc un élément qui se distingue du reste des écrans, par sa taille, sa couleur, la police utilisée, l’iconographie, que l’on soit sur mobile, tablette ou desktop. Cependant, il est important que cet élément respecte des codes conventionnels : les boutons, lien et menus, doivent ressembler à ce que l’utilisateur connaît des boutons, liens et menus selon ses expériences passées.
L’écran de Spotify propose une “Lecture aléatoire”. L’utilisateur se voit donc proposer un parcours avec une aide à l’action et à la navigation. Le Call-to-action reprend les codes conventionnels, il est aisé de comprendre qu’il s’agit d’un bouton, les couleurs sont contrastantes avec le reste de l’écran.
Sur l’écran de l’application Chauffeur Privé, le Call-to-action rempli un objectif d’action clair et précis : “Valider son point de départ” afin d’être localisé et définir un trajet. Au même titre que Spotify, le bouton d’action se distingue du reste de l’écran. Il est tout de suite identifiable comme moyen d’action. Il est aussi mieux placé car plus facilement accessible lors d’une navigation à une main.
L’optimisation et le rôle des Call-to-action
Les Call-to-action doivent aussi être optimisés en terme de facilité d’accès : il est important de réduire au maximum l’effort de l’utilisateur pour les viser. Placements des boutons en fonction des usages (écran mobiles, tablettes, desktop) afin de les atteindre facilement, taille et couleur des boutons afin de les rendre visibles et inciter l’action.
Enfin, il ne faut pas oublier que les Call-to-action sont des éléments d’interface qui répondent à des objectifs fixés en amont. Lors de la création de la stratégie web ou mobile d’une marque ou d’un service par exemple. Leurs rôles peuvent être de répondre à un objectif commercial (augmenter les taux de conversion) ou d’une aide à la navigation, proposant à l’utilisateur de remplir une action précise et ainsi améliorer son expérience lors de l’usage.
Une question à propos de l’article ? Un projet ? Contactez-moi
