La loi de Hick décrit comment le nombre de choix que vous présentez aux gens affecte le temps qu'il leur faut pour répondre. Cela a des implications importantes pour la conception UX et UI, entraînant des mesures importantes telles que le rebond, l'engagement et le temps moyen sur la page.

Imaginez l'excitation du public quand, en 1951, William Edmund Hick («Hickey» à ses amis?!) Et Ray (avec un «a») Hyman ont publié des recherches sur les réponses des gens à un tas de lumières clignotantes. Je suis sûr que personne ne pouvait imaginer l’importance de ce travail pour l’ère de l’information car, bien sûr, à cette époque, une batterie de feux clignotants était à peu près à la hauteur de la sophistication technologique.

Plus précisément connue sous le nom de loi Hick-Hyman, leurs recherches tirent la conclusion (pas vraiment bouleversante) que plus vous avez de choix, plus il vous faudra de temps pour choisir – nous attendons toujours de voir ce qu'ils pensent sur l'humidité de l'eau.

Oui d'accord.

Il y a, en fait, des implications vraiment importantes de cette loi. Il touche à des disciplines aussi diverses que l'aviation, l'autodéfense et, bien sûr, la conception Web. Voici comment ça fonctionne:

Qu'est-ce que la loi de Hick?

En termes simples (ish), Hick et Hyman ont tous deux constaté que, lorsque les gens ont plus de choix, l'augmentation de leur temps de réponse est logarithmique. Cela signifie simplement que, à mesure que le nombre de choix augmente, le temps de réponse augmente à un rythme décroissant. En fin de compte, l'augmentation du nombre de choix cesse de faire une grande différence.

Pas de panique, voici une photo:

image1 "width =" 1856 "height =" 1182 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/01/image1.png 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2019/12 / image1-300x191.png 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2019/12/image1-768x489.png 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2019/12/image1-1024x652.png 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Vous pouvez considérer l'axe horizontal comme le nombre d'éléments à choisir et l'axe vertical comme le temps. Notez que pour 1 élément, le temps de choix est 0. L'ajout de plus de choix fait une grande différence au début, mais beaucoup moins vers la fin.</p>
<p>Cette loi ne s'applique vraiment qu'aux listes triées et a tendance à s'effondrer à mesure que les choix deviennent plus complexes, comme nous le verrons.</p>
<p>Il décrit en fait une sorte de recherche binaire. Ceux d'entre vous qui sont allés plus loin que moi dans l'informatique reconnaîtront que cela signifie que la moitié des éléments restants sont recherchés à la fois. La moitié restante est subdivisée, une moitié est recherchée et ainsi de suite. En termes humains, c'est comme restreindre la recherche, disons une table de buffet, en décidant si vous allez commencer à droite ou à gauche. Ensuite, après avoir choisi le bon côté, décider de commencer par une soupe ou une salade.</p>
<p>La loi s'applique également au nombre de stimuli (par exemple, les éléments de menu) et au nombre de réponses. Donc, un menu comme celui-ci:</p>
<div class=image2 "width =" 1856 "height =" 1280 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/01/image2.png 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2019/12 / image2-300x207.png 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2019/12/image2-768x530.png 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2019/12/image2-1024x706.png 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>prendra plus de temps à traiter qu'un menu comme celui-ci:</p>
<div class=image3 "width =" 1856 "height =" 975 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/01/image3.png 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2019/12 / image3-300x158.png 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2019/12/image3-768x403.png 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2019/12/image3-1024x538.png 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Si vous ne pouvez pas décomposer les choix de manière logique (car la liste est aléatoire, par exemple), la recherche binaire n’aidera pas. Cela est également vrai dans les situations où vous êtes familiarisé avec l'interface ou devinez (correctement) à l'avance les choix qui vous seront proposés. Ce sont là des exceptions à la loi de Hick.</p>
<p>Cela ne s'applique pas vraiment, par exemple, pour décider "comment gérer votre temps" …</p>
<div class=image4 "width =" 1856 "height =" 1448 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/01/image4.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2019/12 / image4-300x234.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2019/12/image4-768x599.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2019/12/image4-1024x799.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p><em>Choix de gestion du temps par Jean-Louis Zimmerman via Flickr.</em></p>
<p class=

Pertinence pour la conception Web

Voici une règle simple: plus il faut de temps pour faire un choix, plus il devient facile de ne faire aucun choix. Ne soyez pas ce designer! La plupart du temps, moins c'est plus.

Il existe quatre mesures de performances qui sont fortement affectées par la loi de Hick:

  • Rebondir
  • Engagement
  • Temps moyen sur la page
  • Expérience utilisateur subjective

Si vous maîtrisez l’UX, vous vous rendrez compte, bien sûr, que chacun de ces éléments affecte votre trafic, votre classement dans les recherches et, en fin de compte, s’il s’agit d’une activité lucrative, les revenus. Examinons chacun à son tour:

Rebondir

Le gros problème ici est la surcharge d'informations. Si vous arrivez sur une page de destination et voyez quelque chose comme ceci:

image5 "width =" 1856 "height =" 973 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/01/image5.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2019/12 / image5-300x157.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2019/12/image5-768x403.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2019/12/image5-1024x537.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Vous "pourriez" commencer par essayer de décider où aller ensuite, mais très bientôt vous allez juste, euh … allez. C'est une bonne raison pour laquelle moins c'est plus.</p>
<h3>Engagement</h3>
<p>Les utilisateurs ne veulent pas être confrontés à des décisions difficiles ou passer beaucoup de temps à passer à travers des choses comme l'enregistrement. Ils veulent accéder au contenu qu'ils recherchent le plus rapidement possible. Si votre processus d'inscription ressemble à ceci:</p>
<div class=image6 "width =" 1856 "height =" 640 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/01/image6.png 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2019/12 / image6-300x103.png 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2019/12/image6-768x265.png 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2019/12/image6-1024x353.png 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Vous feriez probablement mieux avec quelque chose comme ceci:</p>
<div class=image7 "width =" 1856 "height =" 740 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/01/image7.png 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2019/12 / image7-300x120.png 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2019/12/image7-768x306.png 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2019/12/image7-1024x408.png 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Même si vous continuez à leur demander plus d'informations, vous pouvez le faire en petits morceaux. Sinon, vous risquez de perdre des gens à mi-chemin.</p>
<h3>Temps moyen sur la page</h3>
<p>C'est une situation où moins peut ne pas être plus: plus il y a d'éléments sur la page ou dans un menu – comme le dit la loi de Hick – plus ils y consacreront de temps. Le pari est que le fait d'avoir trop d'articles risque de rebondir.</p>
<h3>Expérience utilisateur subjective</h3>
<p>À bien des égards, ce que les utilisateurs disent ou pensent de leur expérience est plus important que toute métrique dure. Prenez la frustration par exemple. Si vous n'avez jamais vu "User Inyerface" et / ou jamais ressenti de frustration, essayez-le, c'est hilarant. Et non.</p>
<p>Du point de vue de la loi d'un Hick, User Inyerface illustre trois choses vraiment importantes:</p>
<ul>
<li>Si vous ne trouvez pas une option, elle ne compte pas comme une option.</li>
<li>À moins que vous n'utilisiez une méthode cohérente pour identifier les choix potentiels (un changement de pointeur de souris ou une étiquette pertinente, par exemple), tout devient un choix potentiel!</li>
<li>La frustration est un puissant moteur pour abandonner toute activité, peu importe combien vous voudrez la terminer.</li>
</ul>
<p>Il y a de fortes chances que vous passiez quelques minutes sur ce site (idéal pour AToP et Bounce) mais que vous ne reveniez plus jamais.</p>
<p class=

Utilisations importantes de la loi de Hick

La loi de Hick est puissante mais ne s'applique pas dans toutes les situations. En tant que concepteur Web, vous pouvez exploiter ces deux faits à votre avantage.

Grouper les éléments du menu ensemble

Utiliser des titres significatifs: les catégories de produits, par exemple, transforment un choix massif en beaucoup de plus petits:

image8 "width =" 1856 "height =" 1140 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/01/image8.png 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2019/12 / image8-300x184.png 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2019/12/image8-768x472.png 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2019/12/image8-1024x629.png 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<p>Les temps de décision seront plus courts et vos utilisateurs bénéficieront d'une expérience rapide et aisée.</p>
<h3>Considérez le contraste</h3>
<p>En utilisant des couleurs, des formes, des tailles et des textures contrastées, vous pouvez indiquer plus clairement les choix. Ainsi qu'un moyen de regrouper des options similaires ou importantes, cela utilise la familiarité pour réduire les temps de réponse et améliorer l'expérience utilisateur. Un bon exemple de cela est de guider les utilisateurs vers des options «sûres» pour les aider à éviter des résultats négatifs.</p>
<h3>Pensez aux objectifs</h3>
<p>N'oubliez pas que le processus décisionnel commence toujours par un objectif. Comprenez les objectifs les plus probables de vos utilisateurs. Lors de la commande et du regroupement des menus, réfléchissez à la manière dont les utilisateurs segmenteront leurs choix. WhatsApp, par exemple, propose 5 «Contacts fréquents» avant de présenter une liste alphabétique.</p>
<div class=image9 "width =" 1856 "height =" 1136 "srcset =" http://www.guidsite.com/wp-content/uploads/2020/01/image9.jpg 1856w, https://www.webdesignerdepot.com/ cdn-origin / uploads / 2019/12 / image9-300x184.jpg 300w, https://www.webdesignerdepot.com/cdn-origin/uploads/2019/12/image9-768x470.jpg 768w, https: // www. webdesignerdepot.com/cdn-origin/uploads/2019/12/image9-1024x627.jpg 1024w "tailles =" (largeur max: 1856px) 100vw, 1856px "/></div>
<h3>Recherche et test</h3>
<p>Ne le laissez pas au hasard. Découvrez ce qui fonctionne pour les autres sites et, plus important encore, pour vos utilisateurs avant de commencer.</p>
<p class=

Exceptions à la loi de Hick

Les exceptions à la loi de Hick, en dehors des longues listes non ordonnées (que vous voulez éviter à tout prix), impliquent des cas de familiarité et les utilisateurs peuvent deviner ce qui va suivre.

Répond aux attentes

Il existe des conventions claires pour des éléments tels que les boutons, les liens, la hiérarchie des informations et les icônes standard. En adhérant à ces conventions, vous permettez à vos utilisateurs d'enfreindre la loi de Hick et de gagner du temps dans leur prise de décision, même lorsqu'il existe de nombreuses options.

N'oubliez pas vos utilisateurs

Vous connaissez très bien votre site ou application, alors en testant votre propre travail, votre expérience sera beaucoup plus fluide que la leur. Demandez à d'autres personnes de le tester pour vous avant le client.

Points clés

La loi de Hick signifie que plus vous proposez de choix à vos utilisateurs, plus il leur faudra de temps pour en choisir un. Dans un contexte de conception de sites Web, les temps de choix longs ont tendance à signifier un rebond plus élevé, un engagement plus faible et une plus grande frustration des utilisateurs. C’est pourquoi, en général, moins c’est toujours plus.

La loi est basée sur le choix binaire, il est donc important de segmenter les choix que vous présentez et de les ordonner de manière claire, logique et centrée sur l'utilisateur. Cela aidera à diviser les grands menus en «sous-choix» plus petits. Vous pouvez trouver des moyens créatifs de le faire avec des choses comme la couleur, la forme et la texture.

En ce qui concerne le temps moyen sur la page, il y a un équilibre à trouver entre diminuer le temps de choix et retenir l'attention. En réalité, cependant, l'UX est plus important que les métriques.