Années 1990 : la main tourne le gros bouton du volume, les yeux restent sur la route (0,0 s).
Pourquoi, dans les voitures d’avant, pouviez-vous monter le son sans même regarder ? Parce que le bouton était physique, gros, et tout près du volant.
Sur l’écran tactile, il faut viser
Sur les écrans tactiles des voitures récentes, le bouton est petit et serré entre ses voisins. Pour toucher le bon, il faut quitter la route des yeux et viser.
Un principe : la loi de Fitts
Ce que vous venez de voir porte un nom : la loi de Fitts. Et elle s’écrit avec une relation mathématique.
Ce que dit la règle
Formulée par le psychologue Paul Fitts en 1954, elle tient en une équation : T = a + b · log₂(2D / W). Pas de panique : seuls trois termes comptent ici.
T, D et W
T, c’est le temps qu’il vous faut pour cliquer. D, c’est la distance jusqu’à la cible. W (width), c’est la taille de la cible.
Plus c’est loin, plus c’est lent
Plus vous éloignez la cible, plus l’utilisateur met de temps à l’atteindre.
Plus c’est grand, plus c’est rapide
Et plus vous agrandissez la cible, plus l’action est rapide, et sans erreur.
Règle 01 · Un doigt n’est pas une souris
Appliquons-la dans Figma, avec les standards de l’industrie. Votre doigt n’est pas le pointeur de la souris : là où la flèche vise un pixel, le doigt couvre le bouton et ses voisins.
44 × 44 points chez Apple
Les Human Interface Guidelines d’Apple imposent une zone tactile d’au moins 44 × 44 points.
48 × 48 dp chez Google
Material Design, chez Google, demande 48 × 48 dp. Alors agrandissez ce bouton !
Règle 02 · La Thumb Zone
Deuxième règle : réduisez la distance, et placez les call-to-action en bas de l’écran, dans la Thumb Zone. C’est là que le pouce travaille quand on tient son téléphone d’une seule main, la prise la plus courante.
Vert en bas, rouge en haut
La zone verte, c’est là où le pouce arrive facilement. La zone rouge, en haut, est difficile à atteindre : il faut faire glisser le téléphone dans la main pour y cliquer.
En résumé
Une grande taille et une courte distance : une meilleure expérience, et une conversion qui monte.
Sinon, l’utilisateur s’énerve
La prochaine fois que vous dessinez un écran, pensez à la loi de Fitts. Parce qu’au bout du compte, si l’utilisateur ne trouve pas vite le bouton qu’il cherche…
… il trouvera celui-là
… le bouton « Désinstaller », lui, est toujours grand et facile à atteindre.
Cet article reprend l’épisode N° 03 de notre série sur les lois UX. Prochain épisode : l’effet Von Restorff.