Réduire le taux d'erreur et le temps de production sur un outil interne

Équipe interne Gingerminds en salle de réunion
Client
Date
2023 – 2025
Compétences
Recherche UX
Conception
Design system

Contexte

Repenser le système de conception de wireframes* interne de Gingerminds. Système devenu inadapté à leur manière de travailler : différents concepteurs, pas tous la même aisance avec l'outil de conception, besoin de raconter une histoire, volonté de ne pas repartir de zéro à chaque début de projet.

*Maquettes permettant de structurer la page rapidement, afin d'avoir une idée globale de la direction que prend le design, sans perdre du temps.

Objectif

Créer un système riche permettant de construire des wireframes simplement, efficacement et de manière homogène. Rendre le processus plus efficient pour concentrer l'énergie sur les spécificités du projet.

En résumé ?

Les points clés

  • Aligner l'équipe sur les enjeux

    Comprendre les enjeux métier de chaque partie prenante était essentiel pour s'aligner sur les choix de conception de la future solution.

  • Structurer une solution modulable

    Après avoir sélectionné le support de la solution (Figma), il a fallu concevoir un système adapté aux différents niveaux d'aisance de chacun.

  • Former l'équipe et tester la solution

    Puisque les profils utilisant le nouveau système étaient différents, un temps de formation était nécessaire. Vient ensuite une phase de test et d'itération pour affiner la solution.

Quel était le processus ?

Les grandes étapes

  1. État des lieux du processus actuel
  • Organiser et mener un atelier avec des représentants de chaque partie prenante (commerciaux, product owner, designer, développeurs).
  • Analyser les retours de l'atelier et en identifier les points de friction et les besoins.
  • Identifier les éléments à conserver de l'ancien système et ceux à modifier ou supprimer.
  1. Conception d'un système adapté aux usages
  • Créer un fichier qui sert de bibliothèque de blocs modifiables.
  • Créer l'ensemble des composants avec leurs variants et le responsive (desktop, mobile).
  • Homogénéiser l'appellation de chaque bloc, avec tous les pôles de la chaîne de production. L'objectif est de parler tous le même langage.
  • Organiser le fichier sous forme matricielle afin de faciliter la recherche des blocs.
  • Création d'une « étiquette technique » pour estimer le coût minimum de chaque bloc, selon les langages de programmation de l'agence.
  1. Former et documenter
  • Créer un fichier séparé contenant l'ensemble des composants. Modifiable uniquement par les designers.
  • Créer des modes d'emploi de l'outil Figma et un guide de la nouvelle bibliothèque UX.
  1. Tester la solution et l'améliorer
  • Mettre en place une phase pilote et un système de prise de retour.
  • Utiliser le nouveau système sur des projets concrets.
  • Modifier les composants dans le fichier source.

Et concrètement ?

Les résultats

Conception de plus de 170 blocs intégrant les contraintes front-end et back-end et les bonnes pratiques d'architecture de l'information.

Réduction ~30 % du temps de production (diminution des allers-retours correctifs et meilleure anticipation des contraintes techniques).

Envie d'en voir plus ?

Mes autres projets

Quelques missions récentes, dans des contextes différents.