Cyrillus gagne +10% de valeur de la visite en personnalisant sa réassurance Cyrillus gagne +10% de valeur de la visite en personnalisant sa réassurance

Cyrillus gagne +10% de valeur de la visite en personnalisant sa réassurance

par ,
le 17 février 2017

0
0

Cyrillus est une marque familiale Française de prêt à porter créée en 1977. J’accompagne les équipes marketing depuis 2014 pour améliorer la performance du site et l’expérience utilisateur. Début 2015, le projet de refonte est validé et la conception débute quelques mois plus tard avec Altima°.

Pour garantir le R.O.I de cette refonte, nous adaptons notre méthodologie de testing pour favoriser la collecte d’enseignements. Certains sujets divisent les équipes internes et le testing permet de trancher très rapidement (plot produit, position des filtres, …).

Par exemple, quelle structure de tunnel de commande doit-on adopter ? Le bloc de résumé de commande doit-il être visible tout de suite par l’utilisateur ou doit-on donner plus d’espace aux produits ?  Ce changement présente un risque et nous le testons rapidement sur l’ancien site :

Cyrillus-test-position-zone-achat-panier-optimisation-conversion-ux
Test A/B de la position du bloc de résumé de commande avant la refonte

Positionner le résumé en bas de page réduit la valeur de la visite de 8% sur l’ensemble du tunnel et de 14% sur les nouveaux clients. Bref, ça ne plait à personne alors on a très vite retirer cette idée de la refonte !

LE DEFI ?

Plusieurs points n’ont pas pu être testés avant la mise en production et Caroline, Web project manager, est venue avec ce brief : « Suite à la refonte du site nous souhaitons vérifier l’impact du nouvel header sur les ventes et le comportement utilisateur. Peut-on le challenger sans tout modifier ? »

NOTRE REALISATION

Le header a fait parti de ces changements osés avec une structure moderne mais peu conventionnelle :

Optimisation nouveau header rassurance par Fauveaux Mathieu conversion
Header Cyrillus après la refonte

Il répond à plusieurs demandes de la marque dans un espace très réduit :

  • Rassurer l’utilisateur
  • Mettre en avant les boutiques physiques
  • Disposer d’une zone de communication
  • Conserver l’accès au compte client

Les arguments de réassurance sont présentés dans la zone centrale de ce pre-header. La taille de la zone est réduite et pour faire tenir les 3 arguments, une animation a été créé pour passer de l’un à l’autre. L’avantage de l’animation est d’attirer le regard de l’utilisateur mais il doit attendre environ 4 secondes pour visualiser les 3 arguments (sic, trop long?).

La nouvelle zone de communication s’affiche lors de la première visite ou se déplie vers le bas au clic sur l’onglet jaune. Sa hauteur est importante et ce comportement original est très loin des conventions du web. Il pourra surprendre et nous nous demandons quel est son impact sur les nouveaux utilisateurs (taux de rebond?) ou sur l’offre présentée (R.O.I) :

Animation header suite refonte
Animation du nouveau header après la première ouverture du site

Cela fait beaucoup d’informations dans une petite zone et je me pose plusieurs questions côté conversion :

  • Rassurance et animation : Les arguments de réassurance sont animés, sont-ils bien visibles ?
  • Arguments de réassurance : Sont-ils bien adaptés à l’ensemble des clients ?
  • Animation de la zone de communication : Quel est l’impact de cette animation d’ouverte sur le comportement utilisateur lorsqu’il arrive sur le site ? Est-elle gênante ? Quel est son impact sur des petits devices ?
  • Offre marketing : Quel est l’impact de cette zone de communication ? Le produit produit est-il plus vendu ?

LA PROPOSITION

Pour répondre à toutes ces questions, nous préparons avec les équipes marketing de Cyrillus un test A/B de 6 combinaisons.

Pour tester l’impact de la zone de communication nous la supprimons complètement. C’est simple et nous savons rapidement quel est l’impact sur les ventes de carte cadeau.

Une autre variation pousse l’offre en cours dans un bandeau fixe dépourvu d’animation. Ici nous mesurons l’impact de l’animation et la visibilité de la carte cadeau :

Cyrillus-bandeau-optimisation-zone-communication
Variation de test avec suppression de l’animation et mise en valeur du produit

Dans le même temps nous testons la position de la réassurance et son traitement. Ici elle est mise en avant via un fond rouge et l’animation entre les arguments, potentiellement gênante, est supprimée :

Cyrillus-optimisation-position-rassurance-fixe variation test ab
Suppression du produit, de l’animation et mise en valeur de la rassurance

Nous testons également l’affichage d’une réassurance sous la navigation, plus conventionnelle et qui a l’avantage de valoriser la navigation dans notre cas. Nous avons fait 2 déclinaisons, une noire :

Cyrillus-rassurance-noir optimisation conversion Mathieu Fauveax
Test de la position du bloc de rassurance avec un design noir


et une version jaune bien plus visible :

Cyrillus-rassurance-jaune ergonomie
Variation de couleur jaune pour attirer davantage le regard utilisateur

Pour finir, nous testons une déclinaisons personnalisée de ces 2 dernières variations. Nous ne savons pas si les arguments présentés sont pertinents et si le discours doit être personnalisé en fonction du type d’utilisateur.

Les nouveaux utilisateurs sont exposés à un message qui pousse une offre qui leur semble dédiée alors que les anciens conservent la réassurance initiale. En réalité les arguments sont identiques dans les 2 cas et seul le wording change : 

Personnalisation-test-ab-cyrillus-nouveau-client-fauveaux-mahtieu
Personnalisation des arguments de rassurance sur ce nouveau design

LE RÉSULTAT ET LES ENSEIGNEMENTS

Après 2 semaines de test, la version noire personnalisée sort du lot et atteint +10% de valeur de la visite sur l’ensemble des profils. Sans la personnalisation, cette variation  n’a aucun impact. Cet enseignement est précieux et vraiment intéressant.

Autre enseignement intéressant, la couleur jaune n’a pas l’effet escompté et cette variation est légèrement négative au global. Sur les nouveaux utilisateurs, l’optimisation n’est que de +1,8% là où la version noire atteint +11,6% ! Ces effets graphiques a peu d’intérêt ici et probablement sur les newsletters ou autre communications.

Les autres combinaisons sont très légèrement négatives et stables dans le temps. Les ventes de carte cadeau n’ont pas évoluées et cette zone a peu d’intérêt. Je conseille donc de la supprimer pour trouver une meilleure zone de communication.

CONCLUSION

Ce test répond à de nombreuses interrogations sur les choix artistiques et UX qui ont été fait pendant la refonte. L’originalité peut-être dangereuse et cette méthodologie de testing sécurise cette fougue.

La personnalisation a un impact positif et le gain de 10% de valeur de visite sur l’ensemble du site est énorme ! Il sera intéressant de tester d’autres approches. Par exemples peut-on personnaliser la communication de certaines opérations importantes, le parcours d’inscription, …etc.

Est-ce que vous sécurisez votre refonte avec des tests A/B ? Votre communication est-elle personnalisée ?

Le case study ci-dessous à télécharger au format .PDF :

Cyrillus-Case-study-optimisaiton-conversion-Altima-Fauveaux-Mathieu
Case study à télécharger au format .PDF

mots-clés :

, , , ,

articles à lire ensuite...

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

0
0

Cyrillus gagne +10% de valeur de la visite en personnalisant sa réassurance