Refonte de site ecommerce exemple

Spécificités de la mission Auchan

Nous avons souhaité vous présenter les missions réalisées pour Auchan afin de démontrer l’apport de l’architecture de l’information dans la gestion, la maintenance, l’optimisation et la refonte d’un dispositif e-commerce multi univers complexe.

Les travaux ont été réalisés entre 2007 et 2009.
Visualisez le projet UX Auchan...

A propos d'Auchan

Auchan figure parmi les 15 premiers distributeurs mondiaux et s’appuie notamment sur un réseau de plus de 500 hypermarchés à l’international dont environ 120 implantés en France : les défis à relever en matière de stratégie digitale sont donc à la mesure du poids économique de cet acteur.

Néanmoins, la force de frappe digitale du distributeur reste marginale par rapport à l’activité générée par les magasins physiques et depuis plusieurs années, Auchan tente de rééquilibrer la balance pour peser davantage dans le paysage e-commerce français.

C’est dans ce contexte que des missions diversifiées en architecture de l’information et expérience utilisateur ont pris corps.

Problématique digitale du groupe Auchan

Le dispositif interactif Auchan, en France, reflète les activités du groupe et implique de nombreuses branches d’activités rattachées à l’enseigne mère ; on dénombre les services en ligne suivants :

• auchan.fr : site maître commercialisant les produits non alimentaires
• auchandirect.fr : service dédié aux courses alimentaires en ligne
• auchandrive.fr : service visant à récupérer les courses dans son coffre
• billeterie.auchan.fr : service de billetterie loisirs et spectacles
• voyages-auchan.com : branche dédiée au voyage en ligne
• auchantelecom.fr : branche dédiée aux services de téléphonie
• magazines.auchan.fr : kiosque en ligne dédié aux magazines and co

D’autres services en ligne sont également proposés au sein de sites spécifiques ou rattachés au site maître, il s’agit :

• d’un espace développement photo
• d’une offre traiteur de proximité
• d’un service en ligne de librairie
• etc. - d’autres services à la mesure de la croissance des activités

A ces services en ligne viennent se greffer les dispositifs relatifs aux autres activités du groupe Auchan, dont la banque et le crédit au travers du site banque-accord.fr notamment.

L’ensemble de ces services forment la galaxie interactive du dispositif Auchan auquel l’utilisateur sera exposé lors de ses transactions en ligne avec l’enseigne.

Ce vaste ensemble implique des problématiques commerciales, marketing, ergonomiques, fonctionnelles, techniques, organisationnelles, spécifiques pour chacun des supports, qu’il convient de traiter et rapporter à des enjeux d’expérience utilisateur plus macro, afin de proposer, de la façon la plus fluide et la plus optimale, une expérience de marque unifiée : tel sont les défis et les enjeux du business en ligne de l’enseigne pour les années à venir…

Cette problématique d’agrégation de tous les univers produits et de l’ensemble des services dématérialisés est au cœur de la réorganisation des dispositifs marchands des acteurs généralistes de la distribution : c’est le cas pour Carrefour, Casino, Leclerc…

Autrement dit, il s’agit de reproduire en ligne le principe du guichet unique proposé en magasin physique, au sein d’une interface unifiée concentrant tous les enjeux business… Cette orientation n’est pas sans poser problème en matière d’architecture de l’information et d’ergonomie, puisqu’elle revient, par exemple, à faire converger des logiques d’achat divergentes (voyage vs. courses en ligne par exemple) au travers d’interface partagée (par exemple, un même panier pour tous les sites ouvrant sur des parcours de processus de commande spécifiques…).

Au-delà des aspects transactionnels, il s’agit également de faire converger les différentes informations recueillies dans le cadre des programmes CRM (problématique de l’identifiant unique) afin de rassembler et qualifier des bases clients permettant de maximiser les potentialités de personnalisation en matière de relation client.

La matérialisation de ces parcours utilisateurs complexes et diversifiés sous forme d’interface, exige l’intervention de profils experts, pour travailler sur les problématiques cruciales d’expérience unifiée ; plusieurs missions en architecture de l’information et expérience utilisateur entre 2007 et 2009 ont été menées pour Auchan ; notre intervention en IA et UX s’est articulée, de façon complémentaire, autour de trois axes, reflétant les cycles de vie des produits interactifs :

• les missions de conception et de refonte de services
• les missions d’optimisation et de maintenance
• les missions de création

Conception fonctionnelle

Nous sommes intervenus, en matière d’architecture de l’information, sur la refonte de plusieurs supports interactifs rattachés au dispositif Auchan ainsi que sur la conception fonctionnelle du nouveau master e-commerce déployé en 2010 :

• refonte du site banque-accord en 2006-2007
• mission de conseil pour la refonte du site voyages Auchan en 2007
• mission de conseil pour la refonte du site auchandrive en 2007
• mission de conseil et refonte du site auchan.fr en 2009

Optimisation ergonomique

Le maintien d’un parc de plusieurs dizaines de supports interactifs exige un effort de gestion permanent et complexe, notamment en architecture de l’information (chaque dispositif est amené à évolué rapidement pour agréger les variations des offres) et expérience utilisateur (l’évolution des services et leur traduction sous forme d’interface doivent être qualitatives pour faciliter l’expérience transactionnelle de l’utilisateur final).
C’est dans cette logique que nous avons été amené à effectuer plusieurs missions visant à augmenter les performances transactionnelles et à garantir la cohérence ergonomique des interfaces, en renforçant l’efficacité du dispositif de relation client et en optimisant les fiches produits et le processus de commande :

• Optimisation ergonomique du processus de commande du site auchan.fr en 2007, afin d’agréger les nouveaux modes de livraison et de paiement
• Optimisation fonctionnelle des fiches produits du site auchan.fr en 2008
• Optimisation fonctionnelle de l’espace client du site auchan.fr en 2008
• Optimisation fonctionnelle de l’espace fidélité du site auchan.fr en 2008
• Optimisation fonctionnelle du moteur de recherche de auchan.fr en 2008

Parallèlement à ces missions d’optimisation, nous avons travaillé sur l’architecture de l’information relative aux problématiques de signalétique des prix, afin de ventiler toutes les étiquettes de communication sous des formats homogènes au sein du dispositif marchand.

Enfin, les travaux d’optimisation ergonomique du processus de commande et des fiches produits, directement rattachés aux problématiques logistiques, ont exigé la remise à plat des modalités d’entrée dans le dispositif (choix du magasin de proximité) dont le modèle vise à desservir les usagers par zone de chalandise : la problématique du magasin de proximité a donc été cruciale dans les chantiers de refonte du site maître Auchan.fr.

Homégénéisation

Dès nos premières interventions, nous avons mis en place une démarche visant à cartographier l’ensemble du dispositif interactif afin de repositionner chaque service proposé aux utilisateurs dans le cadre global de la galaxie de site ; ce travail a été complété par la mise en place d’un inventaire fonctionnel visant à identifier toutes les composantes fonctionnelles, afin de faciliter la réutilisation des éléments produits, favoriser les gains de productivité et homogénéiser progressivement les interfaces, quelles que soient les plateformes techniques impliquées.
La pierre angulaire de notre travail s’est concrétisée par la participation à la refonte du nouveau master e-commerce déployé en 2010, pour lequel nous avons notamment mis en place les actions suivantes :

• proposition de nouvelle architecture et d’optimisation du catalogue visant à mieux différencier les univers de vente
• conception d’un dispositif modulaire et flexible, adaptée à la mise en place d’animation commerciale élaborées en phase avec la communication off-line de l’enseigne
• valorisation du magasin de proximité
• mise en relief des services dématérialisés
• prémisse d’interface unifiée agrégeant tous les dispositifs
• mise en place des principes de convergence en matière de panier unique
• mise en place des principes de convergence en matière d’espace client

Bien entendu, tous les chantiers de la refonte du dispositif interactif ont concouru à optimiser l’expérience utilisateur en simplifiant les parcours et en proposant différentes modalités d’exploration du catalogue :

• mise en place de parcours raisonné plus courts
• mise en place de parcours guidés via des guides d’achats simplifiés dont les attributs de filtre produits sont optimisés pour le consommateur
• valorisation des parcours impulsifs par la création de plusieurs voies d’accès permettant d’accéder à l’offre par la clé de filtre du prix et des bonnes affaires…

Au final, les problématiques de convergence business engagés par les acteurs de la grande distribution répondent aux enjeux cruciaux visant à garantir à l’utilisateur, une expérience de marque unifiée et intuitive…

Contraintes

Concrétiser la convergence des services par des interfaces homogènes voire unifiées, n’est pas sans se heurter à des contraintes inhérentes à la conduite de projet en environnement collaboratif complexe : les projets engagent des équipes diversifiées, souvent rattachés à des entités spécifiques, elles-mêmes regroupées autour de service et cellule métier, et autour desquels gravitent par ailleurs de nombreux prestataires…
La garantie d’une expérience client unifiée en terme d’interface dépasse donc largement les problématiques fonctionnelles et ergonomiques, puisqu’elle concentre la conjonction de toutes les problématiques génératrices de complexité dans le projet :

• migration technique des supports existants et convergence vers une méta-plateforme emmagasinant tous les flux
• rapprochement des équipes projets non intégrées et non pilotées par une organisation décisionnaire commune
• transparence des échanges au sein des équipes et entre tous les profils métiers
• mise en place d’objectifs commun
• validation de charte graphique, ergonomique et éditoriale commune à l’ensemble des supports
• etc.

La création de dispositif garantissant la prise en compte de l’expérience utilisateur exige désormais une réorganisation des processus de travail en mode projet, en obligeant à se doter d’entité méta en charge du pilotage de l’ensemble des supports de la galaxie interactive : c’est à la mesure de tels réorganisations que les dispositifs marchands et transactionnels complets gagneront en transparence, en performance et en efficacité.

Bilan des missions IA et UX pour Auchan

Le déploiement de la nouvelle version du dispositif auchan.fr en 2010 a permis de simplifier l’expérience globale de la marque pour l’utilisateur, et moyennant quelques ajustements, a permis d’augmenter les performances du dispositif de façon significative tout en favorisant la synergie entre les univers de vente.

Écrit par Julien Muckensturm

Approfondir la conception ecommerce

Techniques utilisées :

• Inventaire fonctionnel
• Wireframing
• Conception du tunnel d'achat
• Conception du catalogue
• Conception de fiche produit
• Conception d'espace client
• Design de navigation
• Conception web

Formation vidéo à visionner :

• Formation UX design en ligne

Livrables à télécharger :

• Kit ultime projet 150 modèles de livrables à télécharger
• Kit ultime conception 160 écrans de wireframes à télécharger
• Kit UX design 25 modèles à télécharger

Etudes de cas à lire :

• Etude de cas Carrefour
• Etude de cas Conforama
• Etude de cas Courses en ligne

Travaux à visualiser :

• Wireframes
• Zoning
• Design de navigation

Compétences métier évoquées dans ce projet :

• Architecture de l'information
• Design de l'interaction
• Design de l'information
• UI design conception d'interface
• Ergonomie web
• UX design d'expérience utilisateur
• Design conversationnel

Autres ressources sur le web :

• Signalez nous des ressources sympas autour des thèmes abordés dans cette étude de cas UX design en utilisant les commentaires !