Archives par mot-clé : Ergonomie incitative

Configurateur de tee shirts

Benjamin a dégoté un configurateur pour tee shirt de rugby :

rugby - Page d'accueil

Passionnant, le sujet des configurateurs. J’ai donc joué un peu avec.

rugby - entrée dans le configurateur

rugby - Détail

Il apparait tout de suite clair que cet outil a été conçu avec l’envie de :

  • Faire une page agréable, claire
  • Faire un système facile à utiliser
  • Avoir un bon taux de transformation

Certains aspects sont plutôt réussis. Le logiciel est ainsi effectivement esthétique, et les dégradés de gris sont plutôt réussis.

A noter également les couleurs « incitatives » rouges, pour ajouter le polo au panier.

Mais, à mon humble avis, on pourrai encore bien améliorer cet outil.

Ainsi, je pense que les options, présentés en « accordéon » en colonne de droite ne sont pas assez visibles. En arrivant sur le configurateur, on ne comprend pas naturellement ce qu’il faut faire pour entrer les différents paramètres.

Autre détail important : le configurateur ne semble pas être « réentrant ». Imaginez, vous avez passé du temps pour configurer le tee shirt de vos rêves, il est dans le panier.

Et bien on ne peut pas revenir dans le configurateur une fois le produit mis au panier. On ne peut donc pas modifier le tee shirt.

Un panier toujours visible

Après le bouton d’achat toujours visible sur Myfab, un peu dans le même esprit, Apple propose un bloc panier toujours visible, dans la page « d’up selling ».

La page s’affiche initialement comme ça :

applepanier1

La zone  droite reste toujours visible, même quand on fait défiler la page vers le bas :

applepanier2

Cette zone reste « collée » en haut à droite de l’écran du navigateur.

Très bien fait, comme bien souvent sur le site d’Apple, un modèle de qualité !

Bouton « Ajouter au panier » toujours visible !

Myfab vient de relooker son site e-commerce.

Petite fonction sympathique sur la fiche produit.

Quand la fiche produit s’affiche, rien de spécial :

myfab1

Problème classique, quand on descend dans la page, le bouton « acheter » va être caché.

Pas chez MyFab, qui a mis une fonction Ajax :

myfab2

La barre du haut, grise avec le bouton « Commander » est affiché en superposition, et s’affiche dès qu’on commence à scroller la page.

Très bien fait, et inspiré du back office Magento.

Les wish list sur les sites e-commerce

Il peut être intéressant, pour les clients d’un site, de pouvoir « mettre de côté » en ensemble de produits.

C’est ce qu’on appelle les wish list (en un ou deux mots).

A la base, l’idée est très simple : en plus du panier, je peux mettre des produits dans un « deuxième panier », pour des produits que je réserve donc.

Idée simple, qui s’enrichit très vite quand on creuse :

  • Une fois les produits dans la wish list, je dois pouvoir les remettre dans le panier, soit un par un, soit tous d’un coup ;
  • Je peux vouloir partager ma wish list avec d’autres personnes. Au contraire, je peux préférer garder ma wish list privée.
  • Je peux avoir besoin, en fait de plusieurs wish list : une pour Noël, une pour un anniversaire, une autre pour des produits que je souhaite revoir plus tard, …
  • Si on est sur de la « multi wish list », il faut qu’on puisse nommer une wish list, la supprimer.
  • On doit également pouvoir modifier une wish list, et donc supprimer certains produits.
  • Autre fonction importante : on doit pouvoir basculer un panier vers une wish list.Tout cela a l’air super !

Attention toutefois, à ne pas faire trop compliqué en fin de compte.

Attention en particulier à bien garder la page produit très simple. On doit en particulier être attentif à ne garder qu’un seul bouton « incitatif » : le bouton d’ajout au panier.

Sur ce sujet, Amazon était allé très loin il y a quelques mois, avec la possibilité de gérer plusieurs wish list dès la page produit. Depuis, Amazon est revenu en arrière, avec une gestion des wish list bien plus simple.

Comme bien souvent pour ce type de sujet, il faut se concentrer sur l’essentiel, la règle du 20 / 80 est un bon guide (se concentrer sur 20% des fonctions qui répondent à 80% des besoins).

Déclinaison Taille / Couleur chez Amazon

Vous ne le savez peut être pas, mais Amazon vend des chaussures :

Les chaussures, comme bien d’autres produits, on la caractéristique de se décliner, en taille et couleur.

Comment Amazon traite ce sujet ?

D’abord, ce qui est « remarquable », c’est que l’écran est « élastique », le contenu s’adapte à la largeur de la fenêtre :

Autre élément intéressant : le bouton « Acheter ». Il a son apparence normale, mais quand on rapproche la souris sans avoir choisi le couple couleur / Taille, un petit message s’affiche, au niveau de la souris :

Autre élément très dynamique : la synchronisation « Ajax » des combinaisons taille couleur.

Je m’explique :

Quand on déplace sa souris sur les tailles, dynamiquement, les couleurs associées sont mises à jour.

Réciproquement, quand on déplace sa souris sur les couleurs, les tailles disponibles sont mises en avant, et la grande photo est mise à jour !

Le mieux est d’essayer ici.

Améliorer le taux de transformation des formulaires : moins de clics ?

Les fomulaires constituent une étape clé dans nos chers sites marchands (et autres d’ailleur).

Comme ils causent beaucoup de fuites de clients, il est raisonnable d’y consacrer une attention toute particulière.

Bien entendu, il est super important de retirer des formulaires tous les champs qui peuvent l’être (au risque de mécontenter votre responsable e-marketing, qui demande l’ajout de tout un tas d’informations, comme la date de naissance, …).

Mais une fois ce nettoyage fait, comment améliorer le taux de transformation ?

Vaut-il mieux un seul formulaire, qui mécaniquement ne peut pas tenir sur l’écran, ou alors découper le formulaire en plusieurs pages, chacune affichant un formulaire court, qui lui, peut tenir à l’écran ?

Comme toujours, il n’y a pas de recette miracle, et la réponse peut varier suivant le contexte.

Néanmoins, dans la majorité des cas, la deuxième solution est bien souvent la meilleure.

Et puis, la solution visant à découper le formulaire en plusieurs étapes apporte un autre avantage : vous récupérez une partie des informations rapidement… Et ces informations peuvent être précieuses pour essayer de « rattraper » un client qui n’a pas été jusqu’au bout du processus.

Cela montre que l’adage visant à réduire au maximum le nombre de clics est simpliste… et parfois faux.

Autres articles sur le sujet

Chiffre d’affaires : X2 en 6 mois !

C’est le magnifique retour que m’a fait un client (hello C.) : en travaillant ensemble sur son site marchand, en 6 mois, les ventes ont été multipliées par 2 !

La clé d’une telle réussite ?

Un mixe entre plusieurs paramètres. On a retravaillé complètement le parcours du client, de manière à rendre ce parcours aussi fluide que possible.

On a également complètement revu l’ergonomie : « faire que l’internaute comprenne, instantanément, ce qu’on attend de lui, à chaque instant ».

On a également travaillé sous l’angle de l’ergonomie incitative : que le client soit guidé pour pouvoir acheter très simplement, sans avoir à se poser des questions.

On a enfin travaillé la fiche produit, avec des produits très bien mis en avant, bien mis en scènes.

Une belle référence, et un beau témoignage. Celà donne du courrage pour la suite !