2 min read

Un modèle efficace pour ajuster les quantités dans le panier d'achats

Augmenter ou diminuer la quantité d'articles dans un panier d'achats est une tâche plus difficile qu'il n'y paraît !
Un modèle efficace pour ajuster les quantités dans le panier d'achats
Photo by Konstantin Evdokimov / Unsplash

Comment une tâche aussi simple peut nécessiter qu'un groupe d'étude se penche sur la question du modèle le plus efficace pour ajuster les quantités de son panier ?

Le Baymard Institute a réalisé une étude d'utilisabilité sur de grands sites e-commerce américains.

61 % des sites évalués rendent inutilement difficile l'ajustement de la quantité de produits en utilisant uniquement un champ de texte ou une liste déroulante.
— Baymard Institute

L'étude nous apprend :

  • qu'à grande échelle, un groupe de participants a rencontré des problèmes significatifs à l'exécution de cette tâche
  • certaines modifications de quantité n'ont pas été enregistrées, ce qui a entraîné des commandes avec des quantités de produits incorrectes
  • les utilisateurs mobiles sont susceptibles d'être plus fréquemment confrontés à des erreurs de saisie

Les conclusions de l'étude

Cette étude permet de mettre en avant 6 solutions pour limiter au maximum les erreurs commises lors de l'ajustement des quantités de son panier.

  1. Mettre à jour rapidement le panier et le récapitulatif de la commande immédiatement après la modification de quantité. La modification peut être accompagnée d'un indice visuel qui confirme la bonne prise en compte de l'action.
  2. Mettre en surbrillance la quantité existante quand les utilisateurs sélectionnent le champ de texte. Cela évitera que la modification s'ajoute à la valeur précédente.
  3. Permettre au bouton "moins" de sélectionner une quantité nulle (0). Les testeurs considèrent que c'est une option viable pour annuler la commande d'un article.
  4. Fournir une option "annuler" si l'article est supprimé du panier (volontairement ou non). Chaque site ou application dispose d'une logique différente, l'utilisateur doit être accompagné au maximum.
  5. Vérifier que les éléments d'interaction disposent de tailles et espacements adaptés à une utilisation sur mobile. La consommation mobile représente de 20 à 35% du chiffre d'affaires des sites e-commerce.
  6. Privilégier une approche double qui associe un champ texte éditable avec des boutons permettant d'augmenter ou réduire les quantités en 1 clic.
0:00
/
Exemple d'ajustement de qualité sur decathlon.fr

Comment j'ai découvert cet article ?

Je suis abonné à la newsletter UX Research du Baymard Institute qui met en avant les UX Patterns les plus performants.