Eptimum.com - e-commerce B2C
Refonte et unification de plusieurs boutiques e-commerce
La refonte de A.com avait pour objectif de réunir plusieurs boutiques e-commerce indépendantes au sein d'une plateforme unique. Le projet a permis de repenser l'expérience, l'identité UI et l'architecture du site, tout en mettant en place un système de composants capable d'accompagner ses futures évolutions.
1 — Quel était le contexte ?
Historiquement, la société A disposait de plusieurs boutiques en ligne indépendantes, chacune dédiée à un éditeur ou à une offre spécifique. Un site général, b.com, servait principalement de portail et redirigeait les utilisateurs vers ces différentes boutiques.
La refonte avait pour objectif de réunir l’ensemble de ces offres et de leurs catalogues au sein d’un nouveau site e-commerce unique : A.com.
Cette évolution impliquait de repenser l’expérience utilisateur, l’interface et l’organisation du contenu afin de proposer un parcours cohérent et homogène.
2 — Ma mission
Analyse
Audit de l'existant - Analyse des parcours - Benchmark Ui
Conception
Architecture et parcours - Principes UI - Wireframes - Maquettes HD - Responsive
Système UI
Kit UI - Conception des modules
Collaboration
Présentation et argumentation des choix - Échanges avec les équipes métier et développement - Tests de conformité
3 — Problématiques
Une identité difficile à appréhender
Les différentes boutiques partageaient un univers commun, mais celui-ci était peu lisible pour l’utilisateur. Il était difficile de comprendre qu’elles faisaient partie d’un même écosystème, ce qui limitait la perception d’une identité globale cohérente.
Une expérience vieillissante
L'interface ne répondait plus aux standards actuels du web et manquait de modernité.
Un manque de cohérence UX/UI
Les interfaces, les composants et certains parcours différaient d'une boutique à l'autre, créant une expérience hétérogène.
Une architecture parfois peu intuitive
La relation entre le site principal B.com et les différentes boutiques manquait de logique. B.com permettait d'accéder aux différentes boutiques, mais la navigation inverse n'était pas systématiquement possible.
Comment réunir plusieurs boutiques en ligne au sein d'une plateforme unique, tout en proposant une expérience cohérente, identifiable et intuitive pour l'utilisateur ?
4 — Objectifs
Unifier l’expérience
Créer une expérience commune à l’ensemble des catalogues et renforcer l’identité globale de la société.
Moderniser l’interface
Définir une nouvelle identité UI et proposer une interface plus actuelle et cohérente.
Simplifier les parcours
Repenser l’architecture et la navigation afin de faciliter l’accès aux contenus et aux produits.
Garantir la cohérence sur tous les supports
Concevoir une expérience responsive permettant une utilisation fluide sur desktop comme sur mobile.
Préparer l'évolution du site
Mettre en place un système suffisamment flexible pour accompagner les futures évolutions du site, notamment la refonte du tunnel d’achat et son déploiement à l'international.
5 — Démarche
Analyser
Audit des sites actuels (héritage, charte graphique, incohérences, frictions, ergonomie, accessibilité…).
Benchmark UI
Sites concurrents et pratiques actuelles.
Structurer
Réfléchir à la navigation et aux parcours utilisateurs.
Concevoir
Principes UI, composants, wireframe, maquettes HD.
Systématiser
Sur le principe de l’atomic design, création d’un Kit UI et de modules réutilisables.
Décliner
Responsive
Collaborer
Échanges avec les équipes métier et développement.
Itérer
Ajustements, retours, validation.
6 — Solutions
Une identité assimilable
Une nouvelle identité capable de s'inscrire dans la continuité des anciens sites.
Un langage UI commun
Des principes visuels et des composants permettant d'assurer une expérience homogène sur l'ensemble du site.
Une architecture plus cohérente
Une nouvelle organisation permettant d'intégrer les différents catalogues et les landing pages éditeurs au sein d'une même plateforme.
Un système évolutif
Un ensemble de composants et de modules réutilisables permettant de faire évoluer le site plus facilement.
7 — Résultats & enseignements
Ce qui a changé
La nouvelle expérience a été particulièrement bien accueillie par les partenaires et les utilisateurs, notamment pour son évolution graphique et ergonomique.
La mise en place d'un système de composants a également permis de fluidifier les mises à jour et de renforcer la cohérence des nouvelles interfaces.
La navigation est plus fluide et permet à l’utilisateur se diriger plus aisément
Ce que le projet m’a apporté
Ce projet m'a permis de développer une approche plus systémique du design. Au-delà de la conception des interfaces, il m'a amené à réfléchir à leur cohérence globale, à leur évolutivité et aux règles permettant de maintenir cette cohérence dans le temps.
Apprendre à prioriser et à arbitrer
La complexité du projet m'a appris à prioriser les sujets, à faire des choix et à trouver un équilibre entre les besoins utilisateurs, les objectifs métier et les contraintes de production.
Développer ma capacité d'adaptation
Les contraintes et les évolutions du projet m'ont amené à ajuster régulièrement les solutions proposées. Cette expérience m'a permis de développer davantage de flexibilité tout en conservant une vision cohérente de l'expérience globale.