Espace client B2B

Espace client B2B

Espace client B2B

Contexte

Contexte

Disposant d'un socle technique ancien, l'espace client B2B devenait difficile à mettre à jour et ne répondait plus aux besoins de nos clients B2B provoquant des appels vers les commerciaux et des actions « hors web » en conséquence.

Disposant d'un socle technique ancien, l'espace client B2B devenait difficile à mettre à jour et ne répondait plus aux besoins de nos clients B2B provoquant des appels vers les commerciaux et des actions « hors web » en conséquence.

Problèmes identifiés

Sur-sollicitation des commerciaux

Sur-sollicitation des commerciaux

Sur-sollicitation des commerciaux

Actions « en hors web » trop élevées

Actions « en hors web » trop élevées

Actions « en hors web » trop élevées

Socle technique obsolète

Socle technique obsolète

Socle technique obsolète

Clients manquant d'autonomie

Clients manquant d'autonomie

Clients manquant d'autonomie

Objectif

Objectif

Concevoir un espace client « MVP » disposant d'une nouvelle architecture technique et d'une interface repensée, pour permettre aux clients B2B de gagner en autonomie sur des actions clés : suivi de commande, activation de cartes, validation de devis, téléchargement des factures et contrats

Concevoir un espace client « MVP » disposant d'une nouvelle architecture technique et d'une interface repensée, pour permettre aux clients B2B de gagner en autonomie sur des actions clés : suivi de commande, activation de cartes, validation de devis, téléchargement des factures et contrats

Contraintes

Temps réduit (MVP)

Aucune donnée historique

Aucun Figma historique

Recherche

Recherche

Au cours du projet, des tests utilisateurs furent menés sur un panel représentatif de clients pour identifier l'ensemble des actions manquantes et maximiser la représentativité des résultats. Ces interviews, menées sur Google Meet par notre UX researcher, ont générées des insights nous permettant de formaliser un user-flow critique.

En amont du projet, des entretiens utilisateurs furent menés sur un panel représentatif de clients pour maximiser la représentativité des résultats. Ces interviews, menées sur Google Meet par notre UX researcher, ont générées des feedbacks clés qui m'ont permis d'identifier les pain-points récurrents de nos clients B2B.

Au cours du projet, des tests utilisateurs furent menés sur un panel représentatif de clients pour identifier l'ensemble des actions manquantes et maximiser la représentativité des résultats. Ces interviews, menées sur Google Meet par notre UX researcher, ont générées des insights nous permettant de formaliser un user-flow critique.

Feedbacks de nos clients

Impossibilité d'activer les cartes

Impossibilité d'activer les cartes

Commandes invisibles

Commandes invisibles

Factures et contrats introuvables

Factures et contrats introuvables

Difficultés de connexion

Difficultés de connexion

Mon rôle

À partir de ces retours, j'ai mené un audit sur l'interface existante, me permettant de créer un Figma contenant l'ensemble des interfaces, puis j'ai priorisé les parcours clés en binôme avec le PM, pour apporter de la valeur et alimenter nos développeurs efficacement.

À partir de ces retours, j'ai mené un audit sur l'interface existante, me permettant de créer un Figma contenant l'ensemble des interfaces, puis j'ai priorisé les parcours clés en binôme avec le PM, pour apporter de la valeur et alimenter nos développeurs efficacement.

Chiffres clés

12 entretiens utilisateurs réalisés

3 types de clients ciblés

1 audit de l'existant

Conception

Conception

L'interface repose sur les librairies existantes du DSV1, dans sa variante « B2B » pour garantir une cohérence avec l'univers de marque et simplifier l'intégration technique. La structure de l'interface repose sur un layout très standard, commun sur les solutions SaaS, pour minimiser la courbe d'apprentissage des utilisateurs (loi de Jacob).

L'interface repose sur les librairies existantes du DSV1, dans sa variante « B2B » pour garantir une cohérence avec l'univers de marque et simplifier l'intégration technique. La structure de l'interface repose sur un layout très standard, commun sur les solutions SaaS, pour minimiser la courbe d'apprentissage des utilisateurs (loi de Jacob).

Inclus dans le hand-off

Cas d'erreurs, états des composant s

Cas d'erreurs, états des composant s

Annotations techniques

Annotations techniques

Spécifications d'accessibilité

Spécifications d'accessibilité

Prototype interactif

Prototype interactif

Ambition

Permettre aux développeurs d'intégrer chacune des fonctionnalités de manière pixel-perfect et garantir une homogénéité et cohérence visuelle sur l'ensemble de l'espace client.

Permettre aux développeurs d'intégrer chacune des fonctionnalités de manière pixel-perfect et garantir une homogénéité et cohérence visuelle sur l'ensemble de l'espace client.

Figma

72 écrans différents réalisés

12 composants spécifiques

3 variantes (desktop, tablet, mobile)