Auteur/autrice : guillaume

Oscaro : petites idées entre amis pour améliorer la conversion

Oscaro.com lancé en 2001 permet d’acheter des pièces automobiles en ligne. Ce nouveau filon intéresse d’autres acteurs du web comme le géant Amazon depuis mars dernier. Alors est-ce que notre pure-player classé 20e en France tient-il ses promesses de simplicité et d’efficacité ? Voici une brève analyse de sa fiche produit.

Une navigation difficile

En arrivant sur Oscaro, j’ai été surpris par l’absence d’un menu de navigation. Sur la page d’accueil, l’utilisateur est guidé et choisit une catégorie, puis une pièce mais une fois sur la fiche produit, comment retourner dans une catégorie ? C’est surprenant.
L’unique bouton de navigation « Retour » est placé à droite, ce qui n’a rien de conventionnel. L’utilisateur aura tendance à le chercher en haut à gauche et pourra avoir du mal à le repérer. Le fil d’Ariane n’est lui aussi pas présent pourtant bien pratique pour remonter dans les catégories rapidement. Pensez à toujours faciliter la navigation sur votre site.

Inciter à mettre au panier

L’objectif de cette page est d’amener l’utilisateur à ajouter le produit dans son panier. Ce bouton doit donc être l’élément mis en valeur ainsi que toutes les informations nécessaires pour exécuter cette action comme le prix, la disponibilité.
Ici l’utilisateur ne peut pas voir le prix du produit, ni le bouton d’ajout au panier à l’ouverture de la page. Le bouton est situé bien en-dessous de la ligne de flottaison repérée par la zone bleue claire. (Résolution entre 1024px et 1920px) (suite…)

12 juin 2013
L’optimisation du taux de conversion en temps de crise

Adobe a réalisé une enquête auprès de 1800 marketers d’Amérique, d’Europe et d’Asie. L’enquête s’intéresse aux taux de conversion web/mobile, aux budgets marketing et aux stratégies pour générer plus de revenus en ces temps difficiles.
En France, la progression des leaders du eCommerce au premier trimestre 2013 est de seulement 2% en moyenne et s’effondre à -7% dans le secteur de l’habillement. Le panier moyen quand à lui baisse de 4% en moyenne. Dans ce contexte économique morose, difficile de penser grappiller des parts de marché et pourtant! L’utilisation des budgets marketings devient une stratégique et le retour sur investissement doit être le plus important possible.

Budget alloué et taux de conversion

La première question concerne le pourcentage de budget alloué à l’optimisation en 2012 puis en 2013.

Plus de 50% des sondés vont allouer moins de 5% de leur budget et 42% entre 6 et 25%. Le constat n’est pas surprenant mais n’est pas sans conséquences sur les revenus du site comme le montre ce tableau :

On peut observer un rapport entre la part de budget réservé à l’optimisation supérieur à 25% et un taux de conversion supérieur à 2%. Il est possible que ces entreprises cherchent des leviers plus performant que l’optimisation du trafic aujourd’hui mature. (suite…)

30 mai 2013
Comment adapter rapidement un formulaire au mobile

Les formulaires sont inévitables sur un site eCommerce pour rechercher un produit, réserver un voyage ou pour renseigner son adresse de livraison dans le tunnel de commande. Depuis un mobile, ces formulaires mal adaptés deviennent des freins importants à la conversion. Alors faut-il s’adapter à ces nouveaux appareils et comme le faire ? Voici un début de réponse.

La manière de consulter internet évolue

La Fevad a indiqué que les ventes sur internet mobile ont augmenté de + 150% en 2012 et représentent 6% du chiffre d’affaires réalisé en 2012, soit presque 3 milliards d’euros.
Les ventes de PC chutent de 13,9% au premier trimestre 2013, la plus forte baisse depuis près de vingt ans selon l’institut de recherche IDC. Une des raisons possibles est la hausse impressionnante des ventes de tablettes tactiles qui aujourd’hui surpassent celles des ordinateurs comme le démontrent ces courbes :

Source

Le nombre d’utilisateurs mobile va selon une estimation dépasser les utilisateurs pc à partir de fin 2013 :

Source

S’adapter dès aujourd’hui est stratégique pour les années à venir. Imaginez votre business dans 2 ans avec un trafic composé de 40% d’utilisateurs mobiles, comment réagirait-il ? Pouvoir naviguer confortablement depuis n’importe quel type d’appareil va peut-être devenir un argument pour les internautes. (suite…)

6 mai 2013
Opodo : le bouton qui fâche

Après Air France et sa gestion des erreurs dans les formulaires, continuons notre série de tests utilisateurs sur les sites de voyage avec Voyage Opodo.fr. Opodo propose tout une gamme de produits qui vont du vol jusqu’à la location de voiture en passant par les croisières.
Lors de ce test nous avons demandé aux participants de réserver le voyage de leur choix.Vous allez voir dans la vidéo ci-dessous une utilisatrice qui filtre les résultats en utilisant certains critères (destination, durée, budget…) mais une action inattendue se produit :

Après avoir cliqué sur le bouton « Supprimer tous les critères » (00:35) l’utilisatrice ne comprend pas pourquoi ses choix se sont effacés. Le libellé du bouton est pourtant clair, alors pourquoi cette erreur ?

Lecture du bouton

Premier élément, l’utilisatrice ne prend pas le temps de lire le bouton et clique par réflexe. On peut voir sur l’eye-tracking que la personne regarde très rapidement le bouton (00:28) surement pour vérifier le positionnement de la souris avant de vérifier que les critères soient bien tous sélectionnés. Le bouton positionné en bas ou à droite d’un formulaire peut être rapidement assimilé à un bouton de validation.

Rechargement de la page

Second élément qui peut induire en erreur, rien n’indique que la page doit être rechargée pour valider un critère. En allant plus loin, on peut observer l’utilisatrice qui sélectionne rapidement le type de pension (00:26), puis le nombre d’étoiles et pour finir le bouton de suppression des critères (en pensant valider).
La page n’aura pas eu le temps de recharger entre ces différents critères et l’utilisateur ne s’en doute pas. Un œil averti notera le rechargement de la page avec les nouveaux paramètres dans l’url.

Visibilité des critères sélectionnés

Troisième élément il est difficile de repérer les critères déjà sélectionnés. La couleur utilisée pour représenter la sélection en plus de la croix est trop proche de la couleur d’un critère qui n’est pas sélectionné. Les critères sélectionnés apparaissent à côté du nombre de résultat affichés, trop bas dans la page et surtout trop loin de la zone de critères :

Il reste d’autres incohérences comme le fait de ne pas pouvoir sélectionner plusieurs critères dans une catégorie ou la compréhension du bouton « go » dans la partie budget. Ces petits détails peuvent avoir une influence importante sur l’expérience utilisateur et sur le taux de conversion du site en général.
Je finirai par : Tout est une histoire de détails en ecommerce.

3 avril 2013
DITTO l’achat de lunette en ligne

Acheter une paire de lunette est une aventure entre les différents choix de modèles, de formes (..), l’avis de ses proches et se termine souvent par un coup de cœur. Alors comment récréer cette séduction depuis un ordinateur avec toutes ces contraintes techniques ? La parade la plus simple est d’envoyer les lunettes à domicile mais cela à un coût pour l’e-commercant ou pour l’internaute; de plus cela créé un délai d’attente. Autre solution pour l’utilisateur, ~~téléverser~~ uploader sa photo ou se photographier avec sa webcam avant d’intégrer la paire de lunette par-dessus.
Le résultat n’est pas très reluisant et ressemble souvent à ceci :

Une expérience d’achat revisitée.

DITTO réinterprète la vente de lunette en ligne et réussi à créer ce moment de séduction avec un message clair : « The easiest way to find the perfect pair of glasses for you. » ( La meilleure façon de trouver votre paire de lunette parfaite. ). Aider l’internaute dans sa recherche avant d’afficher une liste de produit, c’est l’opposé de presque tous les sites du domaine !

Un tutoriel compliqué transformé en un jeu d’enfant.

Le visage est scanné sous tous les angles en 4 étapes reconnaissables par des visuels situés en bas de page. L’étape en cours est expliquée par une phrase en haut de l’écran et mise en situation dans une petite animation à droite. Ici David Groult, consultant Adwords chez Diginex, s’est prêté au jeu et doit placer son visage au centre du rond. Dès que la tâche est réussie, le cercle devient vert avant de passer à l’étape numéro 3. Facile !

Il doit tourner son visage de la gauche vers la droite en suivant l’animation du carré :

Véritable tour de force, DITTO réussit à transformer une étape délicate en quelque chose de ludique et de facile : calculer l’échelle du visage. Une simple carte – type carte bancaire – est utilisée. C’est intelligent puisque facile d’accès pendant la visite et identique partout dans le monde.

Le temps de traitement des données est un peu long après avoir sélectionné son budget, son style etc…

… mais pour un résultat impressionnant ! Vous pouvez tourner votre tête pour vous voir sous tous les angles.

D’autres lunettes sont disponibles comme sur n’importe quel site e-commerce depuis un listing.

C’est une bonne découverte avec une expérience d’achat réussie et surprenante. Et vous, qu’est ce que vous pensez de cet essai virtuel ? Votre prochaine paire viendra du e-commerce ?

5 mars 2013
100 mugs à gagner au concours de tunnel de commande !
Retrouvez-nous au stand C027 !

Wexperience sera pour la deuxième année consécutive au salon VAD et e-commerce à Lille Grand Palais les 18,19 et 20 octobre 2011. Nous serons présents dans l’espace « Connected Innovation Village » au stand C027 pour vous renseigner sur nos prestations et vous aider à convertir plus de visiteurs en clients.

100 mugs à gagner au concours de tunnel de commande

Venez testez l’ergonomie des tunnels de commandes de sites ecommerce avec notre écran de eye-tracking. Dix minute vous suffiront et vous repartirez avec ce superbe objet qui fera l’admiration de vos collègues de bureau.
Et voici la liste des 10 sites qui seront testés. Les résultats seront diffusés chaque soir sur notre blog.
- Boulanger,
- Darty,
- Grosbill,
- Webdistrib,
- Pixmania,
- Cdiscount,
- Rueducommerce,
- LDLC,
- Materiel.net,
- FNAC
Pour créer votre badge, rendez vous sur http://www.vad-ecommerce.com
13 octobre 2011
Fiches produit déjà consultées, guidez vos utilisateurs !

Après avoir abordé les problèmes de pagination sur les pages liste ayant une large gamme de produits dans mon dernier article, il me semblait pertinent d’évoquer un second problème posé par cette abondance de produits sur ces pages. Une offre importante implique davantage de moyens mis en oeuvre pour guider l’utilisateur.

Une partie de la page liste contenant les ballerines noires sur Sarenza.com

Mise en situation
Muriel est à la recherche d’une paire de ballerines noires. Parmi les 200 produits présents sur la page, il n’y aucune raison qu’elle ne trouve pas le produit de ses rêves. Il s’agit maintenant de chercher quelle sera la paire élue. Après une dizaine de fiches produit visitées, peut être même après une dizaine de pages liste visitées,elle est heureuse de pouvoir dire : « Ça y est mon choix est fait, il s’agit de la cinquième paire que j’ai vue… » C’est à ce moment là qu’arrive le moment fatidique où elle va devoir retrouver LA paire de ballerines au milieu de toutes les autres.

Solutions possibles
Changer la couleur du lien sur la page liste pour indiquer à l’utilisateur les fiches produits déjà visitées, lui permettrait de retrouver plus facilement la fameuse paire de chaussures.
Il existe bien sûr des fonctionnalités telles que l’ajout aux favoris ou encore les derniers articles consultés qui permettent à l’utilisateur de retrouver facilement son produit, mais il ne l’utilise pas toujours. C’est pour cette raison que cette simple règle qui nous aide tous les jours lors de nos recherches sur Google et autrefois présente sur tous les sites, mériterait de revenir au goût du jour…
Certains sites possèdent des produits qui sont très semblables ou plus techniques, lesquels sont plus difficiles à différencier à l’aide de la photo ou du nom du produit sur la page liste. Il est d’autant plus important sur ces sites de bien différencier les pages visitées des autres.
Ici, un exemple : Office easy qui vend des articles de téléphonie modifie la couleur des intitulés des produits consultés.

Liens de couleur différente pour les articles consultés sur Officeeasy.fr

6 octobre 2011
Dynamisez vos listes produits

Optimiser la présentation des produits afin de maximiser les ventes ou la rentabilité est un art qui associe le design, l’e-merchandising et l’ergonomie. Alors que la théâtralisation du point de vente est devenue incontournable dans les magasins physiques, nous retrouvons trop souvent les sempiternelles listes produits où les produits sont rangés quatre par quatre, de même dimension, avec la même mise en forme… Si l’architecture de l’information et les options de filtres sont primordiales, cela n’empèche pas de casser cette organisation afin de mettre en scène, séduire et amuser. L’expérience utilisateur, votre image de marque et la mémorisation de votre site en sortiront grandies.

S’émanciper de l’organisation classique des listes produit, d’accord mais comment ?

Certains ont déjà eu de bonnes idées, il serait dommage d’en faire l’impasse. Commençons avec le site Tiffany & Co.

Liste produit du site Tiffany & Co.

Le site Tiffany & Co. varie la taille des visuels produits pour créer une dynamique dans la présentation des produits. Au survol s’exécute un zoom sur le visuel ce qui accentue cette dynamique. Il est toutefois dommage de devoir changer de page pour voir le reste des produits. Une liste infini qui se charge au fur et à mesure de notre descente dans la page aurait donné plus de cachet à cette page. Ce que fait d’ailleurs le site de Stella McCartney, notre exemple suivant.

Liste produit du site Stella McCartney

Ici le site a fait le choix de proposer un carrousel discret (les flèches du carrousel, très graphiques, manque de visibilité) en tant que premier élément de la liste. Ce carrousel utilise des visuels de grande taille ce qui permet de mettre un article en tête de gondole ainsi que d’inviter à parcourir la liste. Burton reprend ce principe de tête de gondole pour ses produits populaires sans pour autant proposer un carrousel.

Liste produit du site Burton

La taille du visuel du premier élément de la liste est très grande ce qui invite fortement au clic. Petit plus : il est possible d’afficher l’article dans d’autres coloris directement depuis la page rayon et cela sans rechargement de page. Et contrairement aux exemples précédents, Burton ne fait pas l’impasse sur les filtres produits. Ces derniers sont accessibles en haut de page via un menu apparaissant au survol.
Varier la taille des visuels de la page rayon permet de créer une dynamique dans la présentation de l’offre. Et nous avons vu à travers les exemples de Burton et Stella McCartney qu’il n’y a pas besoin de fortement s’émanciper des présentations classiques. Toutefois d’autres sites vont plus loin et créent de véritables mosaïques. C’est notamment le cas du site Piiq.

Liste produit du site Piiq

Ici l’interface crée du rythme dans la page en proposant trois tailles de visuels. La présentation des produits est originale et fonctionnelle. Il y a fort à parier que cette présentation en mosaïque, ou du moins la variation de la taille des visuels dans les listes produits, se développera sur les sites e-commerce et figurera dans les Trends de conception de l’année prochaine. A surveiller de près !

27 septembre 2011
Aidez les utilisateurs à parcourir vos pages rayon !

La pagination pose régulièrement des problèmes sur les sites que nous testons. Beaucoup proposent une large gamme de produits. Afin d’affiner ces listes, des filtres sont proposés. Il est aussi possible de changer le nombre d’articles par page, diminuant ainsi le nombre de pages rayon proposées.
Cependant les utilisateurs n’utilisent pas tous les filtres, de peur de manquer une partie de l’offre. Et certains n’aiment pas non plus augmenter le nombre d’articles par page de peur de se retrouver avec une liste de produits interminable où il est difficile de rester concentré jusqu’à la fin. Dans ce cas-là, il n’est pas rare de se retrouver face à une dizaine de pages rayon… et c’est là qu’une mise en forme pertinente de la pagination prend toute son importance.
Des exemples de pagination qui ne facilitent pas la recherche des utilisateurs :

Une zone de clic trop petite qui demande aux utilisateurs beaucoup d’application

Si l’utilisatrice souhaite revenir à la 1ère page, le retour sera laborieux

Un accès aux pages intermédiaires par les pointillés un peu hasardeux

Une surcharge d’informations

Il est important de mettre en place une pagination adaptée à l’offre de son site. Si l’utilisateur peut se retrouver devant une quantité non négligeable de pages rayon il faut alors lui permettre de retourner le plus facilement possible à chacune des pages. La méthode qui a pour l’instant fait ses preuves lors des tests est le menu déroulant. L’utilisateur peut ainsi naviguer de pages en pages et retourner sur celles de son choix à tout moment. De plus, l’utilisation du menu déroulant ne surcharge pas la page.

Exemple de pagination sous forme de menu déroulant :

13 septembre 2011
Liste produit et représentation visuelle du scroll

Un scroll original et pratique

L’article de Geoffrey Dorne sur le nouveau service de Google « What Do You Love ? » a mis en évidence le module de scroll utilisé dans la page. Ce système visuel, toujours visible, permet de savoir où l’on se situe dans la page et ce qu’il nous reste à parcourir. Il est également possible de contrôler le scroll en déplaçant le rectangle bleu symbolisant ce qui est visible sur la page. Google nous propose ici une fonctionnalité originale et pratique lors de la consultation d’une page très longue.

Le scroll selon Google

Une utilisation possible en e-commerce ?

Si la plupart des sites e-commerce répartissent leur offre sur plusieurs pages, certains sites proposent une liste produit infini. C’est le cas du site de Stella McCartney.
Il peut être intéressant ici de proposer à l’utilisateur un indicateur visuel pour lui permettre de connaître le nombre restant de produit à afficher. Cela peut être également un indicateur de repérabilité pour l’utilisateur qui pourra retrouver facilement un produit qui lui plaisait en connaissant sa position dans la page.
Que pensez-vous de cette fonctionnalité ? En voyez-vous l’utilité ?

22 août 2011