Design Pattern, psychologie cognitive en UX design — Part 1

Loi de Jakob et… fromage

Rudy Zourane
7 min readNov 10, 2019
  • Sur quelle page je suis déjà ?
  • Pourquoi quand je clique ça fait rien ?
  • Et comment ça marche ce truc ?
  • Où est-ce qu’ils ont foutu ce *ù*$*ù% de formulaire ?
  • 😥

Vous vous êtes certainement déjà posé ce genre de question un jour quand vous naviguiez sur un site.

Et vous serez d’accord pour dire que lorsqu’on commence à se poser ce genre de questions c’est qu’il y a un problème quelque part !

le fil vert sur le bouton vert, le fil rouge sur le bouton rouge…

L’effet de faux consensus

On appelle cela “l’effet de faux consensus”. Les concepteurs n’ont pas souhaité donner du fil à retordre à leurs futurs utilisateurs, bien au contraire ! Ce biais cognitif bien connu apparaît lorsque les concepteurs restent coincés dans leur bulle lors de la création du produit… Et les surprises apparaissent lors des premiers tests.

A chaque fois que l’utilisateur sera confronté à une interface trop complexe ou à une situation inattendue, il va essayer de trouver une solution. La somme de tous ces obstacles accumulés augmentera sa charge cognitive, allant jusqu’à saturer sa mémoire de travail, entraînant de fait une paralysie dans ses décisions (on y reviendra en détail). Au final, l’utilisateur ne sera plus quoi faire et se posera les questions qu’on a vues plus haut.

Tous les éléments qui n’aident pas à atteindre le but du visiteur sont vus comme un obstacle.

Soyons concrets, mettons-nous dans la peau d’un utilisateur qui cherche désespérément de l’aide sur un site internet un peu compliqué. Il veut trouver votre formulaire de contact. Il scroll en bas, vers le footer pour atteindre les rubriques annexes, c’est là que, généralement, on retrouve le site map, les partenaires, les mentions légales et les formulaires de contact !

  • Premier obstacle : Il y a un scroll infini qui empêche de voir le footer. Il continue de scroller quelques instants… puis abandonne.
  • Deuxième obstacle :Il remonte et regarde dans le menu. Il n’y a rien.
  • Troisième obstacle : Cherche dans la page. rien.
  • Quatrième obstacle : Il ouvre le burger, parcourt la liste des éléments.
  • Cinquième obstacle : Après une deuxième lecture il déplie l’onglet « Service »
  • Sixième obstacle : Rien à première vue, car il cherche précisément le mot « contact ». Suite à une deuxième lecture, il verra le mot « Service client ».
  • Septième obstacle : Je ne parle même pas de la complexité du formulaire à remplir pour arriver à envoyer un message…

On a décortiqué brièvement une scène point par point, mais tout ceci se joue extrêmement rapidement. Au final, vous aurez laissé une mauvaise expérience, vous avez fait de sa simple demande un enfer. Vous pouvez être sûr qu’il ne reviendra pas de sitôt.

Les utilisateurs n’aiment pas résoudre des puzzles.

La loi de Jakob

La pensée consciente prend du temps et des ressources mentales. Elle peut conduire à une frustration quand elle est plus complexe que prévue. Trouver un formulaire de contact, ça n’est pas chercher un trésor sur une carte ! Les formulaires de contact doivent rester là où ils sont censés être : dans le footer.

Pourquoi ?

La loi de Jakob dit : quand ils sont sur internet les utilisateurs passe la majorité de leur temps sur des sites autres que le vôtre. Cela signifie que les utilisateurs s’attendent à ce que votre site fonctionne comme tous ceux qu’ils sont précédemment visités.

Prenons l’exemple d’Apple : à l’époque (et encore maintenant, rassurez-vous !) les utilisateurs pouvaient tout de suite utiliser les logiciels des nouveaux systèmes sans avoir à les ré-apprendre, car contrairement à Windows, il existe une cohérence pérenne entre tous les logiciels Apple. C’est l’erreur de Microsoft avec la sortie de Windows dans sa version 8 qui a changé complètement l’interface de son système. Deux ans plus tard, voyant l’impopularité de son système, Microsoft fait machine arrière avec Windows 10 avec les anciens standards auquel les utilisateurs étaient habitués.

Ceci expliquant cela, on peut répondre à la question :

Pourquoi dois-je placer le logo de mon entreprise dans le header en haut à gauche ?

Parce que tout le monde le fait ! Copier ce qui existe n’est pas une mauvaise chose en soi et, au final, cela peut même être bénéfique. On ne parle pas de copier graphiquement, mais bien fonctionnellement. Un logo sur un site placé spécifiquement en haut à gauche, ça n’est pas une mode, c’est un design pattern.

Les designs patterns

Les designs patterns sont des composants utilisés par tout le monde, partout. Ils sont appris et intégrés par les utilisateurs depuis des années. Tout le monde sait comment fonctionne une liste déroulante, un formulaire, par exemple. Pas besoin de réinventer la roue.

Si vous voulez que vos utilisateurs soient à l’aise dans votre site, ne vous éloignez pas des designs patterns. Voilà pourquoi on ne mettra pas le logo en haut à droite. L’utilisateur a intégré depuis des années que le logo se situe en haut à gauche sur un site ; il ne se pose plus la question de savoir ce qu’une image vient faire à cet emplacement là.

Ainsi, reprenons notre exemple du lien de contact. Sur la majorité des sites, le formulaire de contact est en bas. S’il n’est pas directement visible dans Le header, c’est naturellement en bas de page que les utilisateurs vont chercher le formulaire de contact.

Oui, mais si tout le monde fait la même chose ? Où est l’innovation ?

C’est l’erreur à laquelle beaucoup de personnes croient quand elles suivent les design patterns. Ce qu’il faut surtout en retenir, c’est qu’il vont vous aider à structurer vos composants de manière standardisée. Vos utilisateurs les reconnaîtront et seront rassurés.

Si vous êtes tentés de changer une habitude, il faudrait qu’elle soit apprise et reconnue par tout le monde, cela prendrait des années. Cela est plus facile pour de grosses compagnie de faire une inclusion de nouveaux designs patterns car ils peuvent toucher une plus grande partie de la population. C’est ce qu’il s’est passé avec le “burger menu”, qui commence tout juste à être connu par tout le monde, mais ça a pris du temps.

Le cas des redesigns

Au regard de ce qu’on a dit précédemment, les redesign de sites sont une bonne chose pour les marques, cela permet de leur donner un coup de neuf. Mais au contraire, si ça n’est pas assez travaillé en amont cela sera plutôt négatif pour les utilisateurs.

Mémoire de positionnement

Les utilisateurs qui visitent votre site ont pris certaines habitudes dans leurs usages de navigation, pour retrouver un bloc en particulier, etc. Bien souvent, un redesign remet tout ça à plat.

Même si vous utilisez des design pattern - comme on l’a vu plus haut - si votre design fait repartir tout le monde de zéro, vous perdrez les utilisateurs habitués à venir sur votre site et à accéder à certaines pages. Imaginez un utilisateur qui vient tous les jours sur la même page : même si votre interface n’est pas terrible, il sait malgré tout exactement où se trouve chaque controls. Et là, il faudra qu’ils réapprennent votre architecture...

Qui a déplacé mon fromage ?

En 1998 le Dr Spencer Johnson sort un livre qui explique comment les personnes réagissent aux changements dans la vie quotidienne.

Exemple : avez-vous déjà essayé de déplacer des applications sur votre smartphone ? intervertissez la place de deux d’entres elles. Même si c’est vous qui les avez déplacées, vous verrez qu’il vous faudra un certain temps d’adaptation. C’est parce que nous avons un souvenir spacial des objets.

Les utilisateurs se fichent du design graphique à proprement parler ; ce qui les intéresse c’est d’avoir leur contenu tout de suite sans perdre de temps. ça leur a pris du temps pour apprendre votre interface, et là, tout est à recommencer !

Le cas d’Allociné

C’est le cas typique de la refonte du site allociné en 2006. Ce n’est pas que le design était mauvais, c’est juste qu’il a changé totalement du jour au lendemain. Vous n’imaginez pas tous les messages d’utilisateurs très mécontents qu’ils ont reçu !

Pensant bien faire (effet de faux consensus), les designers avaient effectivement respecté les designs patterns, conçu une interface graphique convenable, mais avaient changé le fromage de place sans en avertir les utilisateurs. Allociné a fini par mettre en place un système de votes pour avoir des retours utilisateurs, mais il était trop tard.

Avoir des utilisateurs qui se plaignent d’une refonte ne signifie pas nécessairement que c’est mauvais. Si le nouveau design offre une plus grande facilité d’utilisation, les gens finiront par l’aimer. Les réclamations ne sont donc pas une raison d’éviter tous les remaniements. Mais comprenez qu’il ne faut pas changer le design uniquement pour juste redonner un coup de pinceau.

Conclusion

Pour finir, on retiendra que l’analyse concurrentielle est un bon moyen de pallier aux erreurs citées plus haut elle permettra :

  1. de récupérer les bonnes idées chez vos concurrents,
  2. de repérer les conventions de fonctionnements et de terminologies.

N’oubliez pas aussi que vous devez tenir compte des conventions qui existent pour concevoir votre produit (design pattern). Cela vous assurera d’avoir une interface facilement utilisable et cohérente par rapport à ce qui existe déjà sur internet.

Mais vous l’aurez compris, l’analyse concurrentielle, les designs patterns, la loi de Jakob et manger du fromage ne font pas tout. On va devoir creuser encore un peu plus dans notre cerveau et détailler les différentes types de mémoires qui existent.

--

--