Menu Fermer
RDV

Bonne UX ou Mauvaise UX : coup d’oeil sur le cas ASICS.COM

Améliorer l'expérience utilisateur d'un site web, notamment e-commerce, passe par des choses simples. Tellement simples que des marques concernées n'y ont même pas pensé. Petit coup d'oeil rapide sur le cas d'école du site web ASICS, ou l'importance de la hiérarchisation des typographies, du rédactionnel et des couleurs en UX design.
Article publié par

Je voulais juste commander une paire de baskets…

Confiné comme beaucoup d’autres, j’ai décidé de me remettre au sport. Attiré par une promotion alléchante et un code promo en cours de 10%, mon choix s’est porté sur la marque Asics. Je me rends donc sur le site à la recherche de mon produit que je trouve (non sans me poser des questions sur le guide des tailles et des pointures). Sans hésitation, j’ajoute le produit au panier.

Après avoir ajouté mon code promo, voilà ce qui se présente à moi :

 

Aperçu de l'écran panier du site e-commerce Asics.com

Mes constats :

  • Confusion sur la perception du prix (dois-je payer 55 euros ou 45 euros?)
  • Une couleur rouge évoquant une erreur / un danger / une alerte (ai-je mal agi?)
  • Des prix avec la même taille de police, parfaitement alignés : l’impression que je dois cumuler 45 ET 55 euros
  • Pourquoi ai-je l’impression que je perds de l’argent, au lieu d’en gagner ?
  • Erreur d’interprétation HTML (inspire le manque de suivi et d’attention de la part de la marque)
  • Conclusion de l’information globale par une information qu’il ne faut pas garder en tête (il faut finir par 45 euros, et non pas par 55 euros)

 

Même si pour vous cela vous paraît un détail ou anodin, sachez que j’ai failli abandonner ma commande et quitter le site. Je pensais avoir bien ajouté mon code promo et que j’allais payer 45 euros. Or, ce que j’ai compris sur l’écran, c’est que j’allais payer au final 55 euros.

Une expérience utilisateur avec un ressenti émotionnel très négatif au premier abord, même si j’ai néanmoins insisté pour en comprendre davantage.

 

Mauvaise UX : et si nous améliorions tout cela SIMPLEMENT par l’UI ?

La réponse à une expérience utilisateur négative, c’est presque souvent sur la forme que ça se joue, à savoir l’interface visuelle.

Enoncer un problème ou une critique ne suffit pas, j’aime aussi proposer des solutions. Je me suis donc fixé le challenge d’imaginer quelle pourrait être une solution qui améliorerait grandement ma “user experience” (UX) en retravaillant la “user interface” (UI).

Voici donc ce que j’ai simplement optimisé sur la partie UI/UX design, et que je suggère à Asics d’appliquer vivement, pour un maximum d’efficacité sur la perception de l’utilisateur :

 

Amélioration de l'UX UI design du site Asics.com par Farouk NASRI

Design UX UI Avant-Après par Farouk NASRI

 

On pourrait toujours imaginer un autre design ou une meilleure idée, mais voilà déjà ce qui me procure meilleur ressenti, meilleure compréhension et meilleure lisibilité.

 

Une bonne expérience utilisateur passe par des choses simples et basiques

Pour Asics comme pour votre propre projet, quelques “tips” et rappels pour une expérience utilisateur, une clarté et une lisibilité réussies :

  • Toujours se mettre à la place de votre utilisateur (et donc votre client)
  • Faites tester toujours vos interfaces par plusieurs personnes avant de la publier
  • En UX, la théorie des espacements (Gestalt) est un principe psychologique des plus connus en design d’interfaces
  • Optez toujours pour un choix de couleurs cohérent (rouge = danger/perte, vert = positif / gain)
  • Choississez la taille de police d’un texte selon l’importance du message et sa hiérarchie qu’il représente (“Total final à payer” est plus important que “Réduction accordée”)
  • Message : soyez plus clair et “friendly” dans le choix de vos phrases (“Total remises” au lieu de “Réduction totale”)
  • Lisibilité : choisissez le meilleur ordre de lecture pour votre utilisateur, qui connaît depuis son plus jeune âge les régles d’une addition ou d’une soustraction (A – B = RESULTAT)
  • Egalement un principe en psychologie cognitive très connu : lorsqu’une succession d’informations (ou beaucoup) sont communiquées à un esprit humain, celui-ci retient plus facilement la première et la dernière.

 

 


Besoin d’une agence UX ou d’un UX designer ?

Agence web spécialiste en conception digitale UX et design graphique à Lille, je vous conseille et accompagne dans la création de votre site internet et vos outils digitaux, pensés selon les attentes et l’expérience de vos utilisateurs.

OUI, j’ai un projet UX ! L’agence UX Farouk NASRI