Optimisation du tunnel de commande : l’excellent exemple du Disney Store

Chez Skeelbox, nous aimons les optimisations du tunnel de commande, aussi, nous préparons forcément nos cadeaux de Noël sur internet. C’est ainsi l’occasion de découvrir des sites qui cumulent quelques bonnes pratiques pour améliorer la conversion, et de les partager avec vous.

La trouvaille du mois est Disneystore.fr, la boutique officielle de Disney, dont le tunnel de commande est particulièrement bien réalisé pour emmener simplement et rapidement le client jusqu’au paiement de sa commande. En fait, j’en ai rarement vu d’aussi bien conçu.

Je vous propose de passer en revue ces bonnes pratiques étape par étape.

Optimisation du tunnel de commande de Disney Store

Le panier

Panier e-commerce DisneyStore

 

1. Le header a été simplifié en supprimant le menu de navigation dans le catalogue produit. L’espace ainsi gagné est utilisé pour mettre en avant le numéro de téléphone. La continuité de la navigation dans le catalogue est assuré par un simple bouton « Continuer mes achats », bien visible.

2. Le manque d’informations liées aux conditions de livraison et de retour / d’échange étant un facteur majeur d’abandon de panier, Disney élude tout de suite le problème en donnant le lien vers les informations nécessaires.

3. Le récapitulatif est graphiquement différencié pour le rendre bien visible, et contient le coût des frais de livraison.

4. L’intitulé du bouton « Commande sécurisée » permet de travailler sur la rassurance. Le bouton est placé en haut et en bas de la page pour s’assurer d’une visibilité permanente.

5. Le champs de saisie du code promo n’est pas visible afin de limiter l’effet déceptif pour ceux qui n’ont pas de code. Bonne trouvaille, le lien vers une sélection de produits en promotion qui permet de travailler sur l’augmentation du panier avec de l’achat spontané.

6. La bannière graphique bien visible remet une couche pour tenter d’augmenter le panier moyen.

7. Troisième couche avec du cross-selling ciblé puisque les produits correspondent bien à ce que j’ai dans le panier.

La page est finalement très riche en information, mais tout est bien amené, c’est graphiquement bien traité, pour garder cette impression globale d’aération et maintenir une bonne lisibilité de toutes les informations. C’est franchement du beau travail.

 

Connexion / Création de compte

Connexion compte client DisneyStore

 

1. Le fil d’ariane fait son apparition pour donner de la visibilité sur les étapes restantes dans le processus de commande.  A ce stade, il ne reste que 4 étapes, ce qui donne une impression de rapidité.

2. Pour les nouveaux clients, le site ne propose que du Guest check out. Un très bon point, car la création de compte client est toujours vécu comme une étape fastidieuse, et donc un facteur d’abandon. Au final, nous allons voir à la fin du check-out que Disney récupère tout de même le compte client. Un exemple à suivre sur ce point. Pour en savoir plus, lire cet article sur le guest check ou « commande en mode Invité ».

3. Le récapitulatif du panier apparaît en mémo tout au long de ce tunnel de commande optimisé, rassurant le client, et limitant la tentation de revenir en arrière pour vérifier qu’il ne s’est pas trompé dans ses achats.

4. Un sceau de confiance, vient renforcer la rassurance. Celui de Disney n’est pas connu en France, il vaudrait mieux mettre un badge d’évaluation des avis clients. Mais c’est mieux que rien.

 

Formulaire d’identification du nouveau client

Formulaire de validation1-DisneyStore

 

Ce formulaire est un exemple du genre.

1. Il commence par demander l’adresse de livraison, et se concentre sur l’essentiel. Pas d’état civil, de date de naissance, de téléphone obligatoire, ou d’inscription optout  (c’est mal !) à la newsletter. Les champs de saisie sont bien larges pour les sélectionner facilement (très important sur Tablette et sur Smarphone), la typo assez grande pour bien lire ce qu’on écrit, tout est bien espacé.

2. Le formulaire intègre un système de vérification de la saisie en temps réel. Dès qu’un champs est OK, une coche verte apparait. Les champs manquants, ou avec des informations erronées sont bien identifiés, je ne peux pas les oublier, et une légende m’indique la marche à suivre. Le must en la matière.

3. Le délai de livraison et le prix sont rappelés.

4. Le bouton pour passer à l’étape suivante est doublé pour garantir sa visibilité à plusieurs niveaux dans la page.

 

Vos concurrents convertissent plus que vous ! Contactez nous pour booster votre conversion

Le paiement

Page paiement en ligne -DisneyStore

 

La page de paiement est sobrement intégré dans le site, c’est souvent une des clefs dans l’optimisation du tunnel de commande. Pas de vilaine page de la banque avec un logo moche (quand il y en a un…) qui donne l’impression d’être revenu au web de 1996. Certes, tout le monde n’a pas les moyens de se payer un serveur avec ce niveau de sécurisation, mais des solutions de paiement en ligne comme Be2bill permettent une intégration quasi-similaire pour les petits e-commerçants. Ca coûte un peu plus cher que les solutions classiques (Ogone, Paybox, Payline, etc), mais je pense que ça vaut le coup (coût).

1. Dommage de perdre une vente pour une petite manipulation. Disney l’a bien comprit. Cliquer sur le bouton « Retour » à l’étape de paiement est souvent synonyme de perte de commande, car le panier (qui a été validé en back-office) est automatiquement vidé de ses produits à cette étape, et le visiteur doit tout recommencer.

2. Rappel que la page est sécurisée.

3. Rappel du contenu de la commande et du prix pour éviter au client de faire demi-tour pour vérifier son panier avant le paiement.

 

La confirmation de commande

5-validation-paiement-DisneyStore

 

Enfin une page de confirmation de commande digne de ce nom !

1. Un message de remerciement graphique et joli.

2. Le rappel de toutes mes informations de commande et un message pour me prévenir que je vais aussi le recevoir par email.

3. C’est là qu’arrive la véritable magie de Disney ! Avez-vous remarqué que le Guest Check Out (ou Commande Invité) ne change quasiment rien par rapport à un processus de commande classique ? Le visiteur a rempli autant d’informations pour passer sa commande que sur un site e-commerce « ordinaire ». Il manquait juste … un mot de passe, pour créer son compte ! Mais le simple fait de dire qu’il est possible de commander sans créer de compte a un impact psychologique positif sur l’acheteur. Maintenant que la commande est passée, l’effort à faire vers cette dernière étape de création de compte est minime, et m’évitera de tout ressaisir la prochaine fois. Qui s’en priverai ?

4. Pour couronner le tout, pourquoi ne pas récupérer le client comme fan de la page Facebook Disney ? Il suffit de leur proposer. Nous pourrions aussi proposer l’abonnement à la newsletter, ou proposer des articles de blog.

 

Création du compte client

creation-compte-client-DisneyStore

 

1. Après avoir cliqué sur l’option de création de compte, le formulaire se dépli.  Mon Prénom, nom et e-mail sont pré-remplis, je n’ai qu’a choisir mon mot de passe. Facile non ?

2. J’en profite pour enrichir ma base de donnée d’emailing, en mode optin, s’il vous plait ! Dans un monde d’e-commerçants spammeurs (surtout chez les plus gros), çela fait plaisir à voir.

Finalement, c’est là que nous allons rencontrer le seul problème du tunnel : un petit loupé d’intégration. Mais à ce stade, je pense qu’on peut oublier ce détail…

Optimiser le tunnel de commande c’est possible !

Pour conclure, je serai curieux de connaitre le taux de conversion de ce tunnel de commande très optimisé. Je mettrai ma main au feu que le chiffre aura de quoi rendra jaloux 99% des e-commerçants. Mickey, si tu me lis…

N’hésitez pas à laisser vos commentaires, avis ou retour d’expérience sur ces pratiques que vous auriez déjà mis en place sur votre site.

Like it ? Share it !
Ludovic Passamonti - Directeur Associé
Author

Diplômé de l’ESG et travaille dans le web depuis 14 ans. Il a défini et mis en oeuvre des stratégies internet et e-commerce pour des grandes marques comme des PME, en agence web, puis en tant que consultant e-commerce freelance.
Co-fondateur de Skeelbox. Il intervient régulièrement dans des conférences, et séminaires.

Plus d'articles de cet auteur
Stay in touch :
  1. garifuna dit :

    Y’a du boulot en effet ! Juste un bémol sur le bouton « commande sécurisée » dans la page panier, j’ai cru que c’était juste un message d’info et on peut douter que ce soit bien un call-to-action car tous les autres ont un verbe à l’infinitif (effectuer un paiement, valider et continuer..) et pas celui-ci. Sinon, chapeau !

  2. Laurent DANFLOUS dit :

    Un concentré de bonnes idées pour optimiser tout son tunnel d’achat !
    Surpris tout de même que la première étape de guest check out ne demande pas d’email (pratique pour relancer les paniers abandonnés) pas plus que les autres étapes. Comment le client reçoit il son récapitulatif comme proposé sur la page de confirmation ?
    L’invitation à la création du compte sur cette dernière page est très astucieuse par contre elle se trouve sous la ligne de flottaison (de mon iMac 21″), elle gagnerait sûrement à remonter.

    Merci pour le partage de ce magnifique tunnel 🙂

  3. Ludovic Passamonti dit :

    L’adresse email est bien demandée à une étape intermédiaire entre la livraison et le paiement, mais je n’ai pas montré dans l’article, car très rapide.

  4. Christopher dit :

    C’est vrai que pour une marque dont le e-commerce n’est pas le coeur métier, c’est assez impressionnant !

    J’ai un doute par contre sur l’efficacité des produits en Cross-Selling exposés dans la panier. Une fois près à payer, le client n’est en général pas très réceptif à ce genre d’offre, une pop-in d’ajout au panier avec des produits en Cross-Selling ciblés est souvent plus efficace…

  5. Ludovic Passamonti dit :

    Disney fait aussi du cross-selling au moment de l’ajout au panier.
    Le principe des ventes additionnelles dans le panier ne me choque pas. Ce n’est pas intrusif car placé en bas de page, généralement sous la ligne de flottaison, donc pas visible au 1er regard. Ca ne coute rien de le mettre a cet endroit.

  6. Christopher dit :

    Oui c’est vrai que placé à cet endroit, ça n’aura pas d’influence quant à la conversion. J’émettais seulement un doute sur le rendement de ces blocs ! Mais c’est vrai que si cela n’influe pas la taux de conversion, ça ne coute rien d’essayer 😉

  7. Loric Sacarrère dit :

    Bel exemple de tunnel de commande. C’est très clean et pro.

  8. Jeff dit :

    Oui, ce tunnel est très bien fait et très bien réalisé.

    Y quand meme une petite coquille, essayez de cliquer sur le logo « entrust » 🙂

    Je les ai prévenus pour qu’ils corrige la coquille.

    Merci pour cet article très intéressant.

  9. Redback Optimisation dit :

    Très bien construit, cet entonnoir de vente est bien construit même si cela date.

Laisser une réponse