Comment booster son e-commerce sur mobile ?

  • 182
  • 4
  • 20 Jan 2021

Le trafic sur smartphone augmente régulièrement, aujourd’hui chez certains e-commerçants il peut représenter plus de 70% du trafic global. Pourtant le trafic sur smartphone convertit mal : 3 à 4 fois moins bien que sur desktop. Ce chiffre indique que beaucoup de clients passent du smartphone au desktop lorsqu’il s’agit de passer commande. Et quand il y a une rupture dans le processus d’achat, il y a des ventes perdues.

 

Pourquoi le trafic sur smartphone convertit mal

Les principaux freins :

 

  • Le temps de latence au chargement des pages, soit à cause de la lenteur du réseau mobile, soit à cause des faibles capacités matérielles du smartphone.
  • La barrière de la connexion au compte client et de la saisie des informations de carte bleue, qui sont perçus comme pénibles sur un clavier tactile et un petit écran.
  • Des informations manquent, l’internaute va sur desktop pour être sûr d’avoir toutes les informations.

 

La bonne nouvelle, c’est que ces freins sont d’ordre ergonomiques et techniques, il est donc possible d’agir sur ces leviers.

La solution de l’application native

Une expérience innovante et personnelle

 

Le développement d’une application native apporte des solutions convaincantes, il est possible d’atteindre une ergonomie et une réactivité au top de ce qui peut se faire sur un smartphone.

 

Le point faible de l’application native, c’est sa capacité à drainer un trafic. Il faut passer la barrière du store et de l’installation de l’application. Pour drainer du trafic, il faut être capable de proposer des services suffisamment attractifs sur l’application native pour motiver le client à passer cette barrière. On va donc chercher à différencier l’application native du site web.

 

Deux idées sont intéressantes à développer.

 

L’utilisation des capacités physiques du smartphone peut permettre de proposer un service innovant et unique. C’est l’exemple de l’application Ikea Place, qui permet de visualiser le produit en réalité augmentée dans son appartement, des applications de maquillage qui permettent de tester le produit sur son visage en réalité augmentée, des moteurs de recherche visuels qui utilisent la caméra, et des applications qui fournissent des diagnostics/conseils sur la base d’une photo ou d’une image de la caméra.

 

Ikea place
Réalité augmentée dans l’app Ikea Place
(source: Ikea)


 

L’application native peut aussi servir à proposer plus de personnalisation. Contrairement à un site web, l’utilisateur possède l’application, il a fait la démarche de l’installer localement sur son terminal. Il est donc naturellement enclin à la considérer comme personnelle. Il est possible de rester toujours connecté au compte client, de donner un accès rapide à son espace de fidélité, de réorganiser le merchandising pour l’adapter aux souhaits et habitudes d’achats du client.

 

La solution de la Progressive Web App

Une expérience dans la continuité du site desktop

 

Dans la continuité des sites responsive, les progressives web apps permettent de rapprocher le web de l’application native.

 

Contrairement aux applications natives, il n’y a pas d’étape d’installation. La Progressive Web App est directement accessible depuis un navigateur web. Elle prend la place du site web et est donc indexée dans les moteurs de recherche. Si on le souhaite il reste possible de l’installer sur l’écran d’accueil de son smartphone, mais cette installation est optionnelle, et lorsqu’on réalise cette action elle est instantanée.

 

Lorsqu’elle est bien réalisée, la Progressive Web App peut apporter un gain de performance important grâce à son architecture et à l’utilisation du cache. On peut par exemple proposer un retour instantané à la page précédente, à la home page, ou au panier. Ces actions qui sont effectuées fréquemment peuvent ne plus nécessiter d’appel au serveur, la page est alors disponible immédiatement. Il est également possible de donner une sensation de chargement instantané de la page produit en utilisant les données déjà disponibles sur la page précédente (image, libellé, prix) et en chargeant le reste de la page en différé (description, avis client). Si la conception est bonne, la sensation de réactivité est bluffante et la navigation est moins sensible à l’instabilité du réseau mobile.

 

Mais la performance n’est pas tout, une Progressive Web App ne donnera son plein potentiel que lorsque l’ergonomie sera pleinement optimisée pour le mobile. La plupart des sites actuels n’utilisent pas pleinement toutes les capacités du responsive design, avec une Progressive Web App il faut aller plus loin et se rapprocher encore plus l’expérience d’une application native :

 

  • Placer l’ajout au panier en sticky en bas de l’écran. Cet emplacement rend le bouton bien visible, et toujours accessible au-dessus de la ligne de flottaison. Il est possible de faire de même pour les boutons de validation dans le tunnel de commande et le compte client.
  • Les liens trop petits pour être cliqués avec les doigts doivent être revus: la pagination par exemple, ou les boutons de sélection de la quantité.
  • Certaines informations qui ne font pas partie du parcours d’achat standard, comme les filtres par exemple, peuvent être cachés par défaut dans des accordéons ou dans un panel déployable. Ces accordéons et panels pourront disparaître sur la version desktop du site où ils n’ont pas lieu d’être.
  • Prévoir un mode invité dans le tunnel de commande pour engager le client plus rapidement dans l’acte d’achat
  • Simplifier le paiement en utilisant les informations de paiement stockées dans le téléphone (paiement par touch id / face id)
  • Déplacer la barre de menu en bas de l’écran du smartphone. Ce principe très populaire sur les applications natives est rarement appliqué sur les sites web responsive. Pourtant c’est bien le bas de l’écran qui est l’emplacement le plus facile d’accès sur un smartphone ! Cette idée implique de revoir le menu de navigation, il faut faire disparaître le menu “hamburger” fourre-tout, et le remplacer par des boutons de navigation spécifiques aux smartphone. Sur un site e-commerce on pourra par exemple proposer une barre de navigation en bas de l’écran avec 4 boutons: home page, catalogue, panier, compte client.

Les zones de confort sur smartphone (source: Scott Hurf)

Les zones de confort sur smartphone
(source: Scott Hurf)

 

Des capacités techniques différentes

La Progressive Web App s’appuie sur les technologies du web et est donc limitée par l’implémentation des standards du W3C dans les différents navigateurs. Le tableau ci-dessous compare les capacités actuelles de chaque solution. Selon l’expérience utilisateur que l’on souhaite créer, certaines de ces limitations peuvent être éliminatoires.

 

     
Installable et utilisable en plein écran Oui Oui
Connexion au compte client par touch id / face id Oui Oui, compatibilité navigateur 80%
Paiement par touch id / face id Oui Oui, compatibilité navigateur 80%
Accès à la caméra Oui Oui
Accès au GPS Oui Oui
Accès à l’accéléromètre et au gyroscope Oui Oui, mais uniquement sur Androïd
Mode Offline Oui Oui, mais capacité de stockage limitée
Extension sur Car play & Apple watch Oui Non
Achat in-app Oui Oui, mais pas possible d’utiliser son compte Apple/Google
Réalité augmentée Oui Oui, mais avec des capacités plus limitées

 

Le critère budgétaire

D’un point de vue budgétaire, la Progressive Web App est très attractive. Elle permet de maintenir une seule solution pour tous les terminaux, du desktop jusqu’au smartphone. Les investissements sont donc mutualisés au maximum.

 

L’application native en revanche nécessite un double développement sur smartphone (Androïd + iOS), en supplément d’un site web responsive.

 

Deux approches différentes au service de votre stratégie sur mobile

Pour synthétiser, l’application native doit se différencier pour drainer du trafic. Elle est donc adaptée pour offrir une expérience innovante et différenciante. La Progressive Web App au contraire offrira une expérience dans la continuité du site desktop, mais pleinement optimisée pour le mobile.

 

Pourquoi choisir ? Peut-être avez-vous besoin des deux ?

 

Ces deux solutions ne sont pas exclusives. Il est toujours possible de proposer plusieurs expériences, dans la mesure où elles sont complémentaires !

Formations open source

Durée : 2 jours
Lieu : Paris