Mise à jour du produit : Les états de survol sont présents depuis l'invention de la souris, et pour une bonne raison : ils indiquent aux utilisateurs où cliquer. Aussi, lorsque A.S. Watson nous a demandé d'améliorer les états de survol de ses hotspots, nous nous sommes immédiatement mis au travail.
Pendant une période de deux mois, nous avons effectué plusieurs tests A/B au cours desquels nous avons rendu leurs points chauds visibles au survol. Ce faisant, nous avons pu obtenir une augmentation de 96% de leur taux de clics (CTR - c'est-à-dire le ratio d'acheteurs qui cliquent des annonces hebdomadaires en ligne vers la boutique en ligne).
Nous sommes ravis de pouvoir enfin mettre cette mise à jour à la disposition de tous. Lisez la suite pour en savoir plus sur la mise à jour et sur la façon dont vous pouvez profiter de ces avantages.
Avant de nous plonger dans le vif du sujet, j'aimerais donner un aperçu rapide de ce billet. La première section explique l'état de survol des hotspots et la manière dont vous pouvez activer cette fonctionnalité. Elle comprend également quelques conseils sur la façon d'utiliser au mieux l'état de survol.
Les deuxième et troisième sections sont destinées à ceux qui souhaitent en savoir plus sur les tests que nous avons effectués et sur notre théorie quant à la raison pour laquelle les états de survol améliorés ont entraîné une amélioration aussi significative.
1. Hotspots visibles au survol
La plupart d'entre vous connaissent probablement l'éditeur de points chauds et savent comment utiliser des rectangles pour créer des zones cliquables (ou points chauds) dans votre catalogue en ligne.
Auparavant, lorsqu'un acheteur passait la souris sur un hotspot, le curseur de sa souris changeait et une info-bulle apparaissait :
Il n'y a aucune indication de la zone cliquable, ce qui fait que l'utilisateur ne sait pas ce qu'il s'apprête à cliquer. Pour résoudre ce problème, nous avons rendu possible l'affichage de la zone cliquable lorsque les acheteurs passent leur souris dessus :
En activant cette fonction, vous donnez aux acheteurs une idée plus précise de ce qu'ils vont cliquer. Et dans le cas de A.S. Watson, cela a amélioré leur CTR de 96%.
Bien que nous ne puissions pas garantir cette amélioration pour tout le monde, nous vous conseillons vivement d'activer et de tester cette fonctionnalité par vous-même.
Comment rendre les hotspots visibles au survol de la souris ?
L'option "Hotspots visibles au survol" est automatiquement activée pour tous les nouveaux groupes que vous créez. Pour les groupes existants, vous devrez l'activer en allant à l'adresse suivante Personnalisation de la visionneuse -> Hotspots -> Hotspot visible au survol.
Que faut-il garder à l'esprit lors de l'activation de l'état de survol du hotspot ?
- En activant cette fonctionnalité, vous rendez les hotspots visibles au survol pour tous les catalogues de votre groupe. Cela inclut les catalogues qui sont actuellement en ligne. Il peut être judicieux de revoir ces catalogues pour s'assurer que les hotspots sont correctement positionnés et qu'ils ont une belle apparence.
- Si l'état de survol permet de révéler la zone de clic d'un hotspot, ce n'est pas une excuse pour désactiver les icônes de hotspot. Les icônes de points chauds ont toujours une utilité unique, car elles indiquent où se trouvent les points chauds.
- Les états de survol ne fonctionnent pas sur les smartphones et les tablettes. Une autre raison de garder les icônes de hotspot activées.
Conseil bonus :
- Pour obtenir le meilleur résultat de l'état de survol des hotspots, vos hotspots doivent être correctement placés. Nous avons rédigé un guide sur comment marquer les produits avec des hotspots pour vous aider à améliorer le placement de votre hotspot.
2. Test A/B A.S. Watson
Lorsque nous apportons des modifications à Publitas, nous voulons nous assurer que nous vous offrons de la valeur, à vous et à vos clients. Ainsi, pour vérifier la valeur des hotspots qui sont visibles au survol, nous avons effectué deux tests. Le premier était un test A/B sur une annonce hebdomadaire qui a été diffusée pendant 7 jours :
| Groupe test | % a augmenté le CTR |
|---|---|
| A - Groupe de contrôle | – |
| B - Amélioration de l'état de survol du hotspot | 99% |
Lors du premier test, nous avons obtenu une augmentation de 99% du CTR, soit beaucoup plus que prévu. Comme ces résultats étaient très prometteurs, nous avons décidé de faire un autre test. Le deuxième test a duré 21 jours :
| Groupe test | % a augmenté le CTR |
|---|---|
| A - Groupe de contrôle | – |
| B - Amélioration de l'état de survol du hotspot | 96% |
Là encore, les résultats ont été bien meilleurs que prévu, confirmant la validité des résultats du premier test. Nous avons également essayé quelques modèles d'interaction différents, comme faire clignoter brièvement les hotspots juste après le chargement d'une page. Aucun de ces modèles n'a donné lieu à des augmentations notables du CTR par rapport aux points chauds qui sont visibles au survol.
3. Comment les états de survol ont-ils conduit à une amélioration aussi importante ?
Sans une bonne dose de lecture des pensées, il est assez difficile de déterminer les détails. Cependant, un coup d'oeil rapide sur le site de Don Norman. heuristique d'utilisabilité nous donne quelques indices - un rappel amical de ne jamais oublier les principes fondamentaux de l'UX et de l'utilisabilité !
Notre spécialiste de l'UX Oliver McGough a relevé les 4 points qui indiquent pourquoi les états de survol sont si essentiels :
1. Visibilité de l'état du système
"Le système doit toujours tenir les utilisateurs informés de ce qui se passe, par un retour d'information approprié dans un délai raisonnable."
Avant l'introduction des états de survol, nous laissions à l'utilisateur le soin de présumer des zones cliquables. La seule invite était une petite icône de point chaud et une info-bulle au survol.
Nous ne voulions pas couvrir les magnifiques catalogues de nos clients de points d'accès cliquables, de peur qu'empiéter sur leur design ne les ennuie, eux et leurs lecteurs.
Sans preuve claire de ce qui est cliquable, pourquoi les acheteurs cliqueraient-ils ?
2. Prévention des erreurs
"Encore mieux que de bons messages d'erreur, une conception soignée qui empêche un problème de se produire en premier lieu. Il faut soit éliminer les conditions propices aux erreurs, soit les vérifier et présenter aux utilisateurs une option de confirmation avant qu'ils ne s'engagent dans l'action."
Les états de survol sont un moyen étonnant de confirmer une action avant que l'utilisateur ne s'y engage. Lorsque la souris survole un hotspot, l'utilisateur est informé de la zone de clic et du fait que quelque chose va se produire lorsqu'il cliquera.
Les utilisateurs sont désormais en mesure de distinguer quels clics entraîneront quelles actions et ils peuvent décider de cliquer ou non. Auparavant, nos utilisateurs devaient cliquer à l'aveuglette, ce qui pouvait les amener à cliquer à un endroit qu'ils ne voulaient pas.
3. Reconnaissance plutôt que rappel
"Minimisez la charge de mémoire de l'utilisateur en rendant visibles les objets, les actions et les options. L'utilisateur ne doit pas avoir à se souvenir des informations d'une partie du dialogue à l'autre. Les instructions d'utilisation du système doivent être visibles ou faciles à retrouver chaque fois que cela est nécessaire."
Comme pour la prévention des erreurs, les états de survol agissent comme un indicateur visible de ce qui va se passer. En matière de conception UX, nous voulons laisser le moins de place possible à l'interprétation.
Nous voulons des actions efficaces et subtiles qui ne nuisent pas à l'expérience globale. L'efficacité permet de maintenir la charge mentale de l'utilisateur en lui faisant penser "je pourrais m'imaginer acheter ceci" plutôt que "qu'est-ce que je fais ensuite ?".
La convivialité consiste à éliminer la charge mentale liée à l'orientation dans l'expérience. Cela libère une plus grande capacité pour profiter de l'expérience. Les états de survol rendent le clic et la recherche d'un chemin beaucoup plus instinctifs.
4. Design esthétique et minimaliste
"Les dialogues ne doivent pas contenir d'informations qui ne sont pas pertinentes ou rarement nécessaires. Chaque unité d'information supplémentaire dans un dialogue entre en concurrence avec les unités d'information pertinentes et diminue leur visibilité relative."
Enfin, les états de survol sont un excellent exemple de conception minimaliste. Nous transmettons toutes les informations dont nous avons besoin grâce à une petite modification de l'opacité. Les images peuvent raconter mille mots, mais notre subtil état de survol en raconte au moins deux".CLIQUEZ ICI".
