Création du nouveau Design System de Fleet

01 — Contexte

Depuis sa création, les développeurs Fleet avaient construit une bibliothèque de composants Storybook entièrement sur mesure, sans fondation commune ni logique systémique. Cela avait généré 3 ans de dette design : composants dupliqués, styles incohérents, absence de documentation. Chaque nouvelle feature prenait 30% de temps supplémentaire à cause du manque de cohérence. Le rebranding de Fleet a été l'occasion de moderniser l'interface pour un public B2B plus exigeant et de poser les bases d'un Design System cohérent, modulaire et scalable.

Mon rôle : co-piloter la création du design system, en s'appuyant sur Material UI et les principes d'Atomic Design, avec une adoption mesurable.

02 — Recherche

Nous avons débuté par un audit complet des 4 produits Fleet, avec des interviews de 8 développeurs et 3 designers, pour identifier les incohérences UI, les variations de composants et les problèmes d'interaction. L'analyse a révélé des doublons, un manque d'uniformité et l'absence de standards partagés : 340 composants dans le code pour seulement 80 patterns distincts nécessaires. Pour structurer la refonte, nous avons adopté Material UI comme fondation open-source React, accélérant le développement et réduisant la complexité technique. Nous avons ensuite défini une structure atomique, organisant les composants en atomes, molécules et organismes pour faciliter la réutilisation et la maintenance.

03 — Livraison

Nous avons livré un Design System robuste et actionnable pour les équipes design et développement : couleurs et typographie harmonisées avec le nouveau branding, border-radius réduit pour un aspect B2B plus structuré, un jeu d'icônes cohérent et des illustrations mises à jour alignées avec l'identité de marque. 80 composants documentés livrés avec une bibliothèque Figma connectée au code via Storybook et un site de documentation sur Zeroheight. Chaque composant est accompagné de guidelines d'usage claires. Résultats à 6 mois : −40% de temps de développement, onboarding ramené à 3 jours.

04 — Apprentissages

Un design system n'est pas un projet de design : c'est un produit dont les utilisateurs sont les équipes. Adopter cette posture dès le départ (interviews, roadmap, feedback loops) a été la clé de l'adoption. Le timing a aussi compté : coupler le DS au rebranding a créé les conditions rares où design et engineering étaient alignés sur le besoin de changement, facilitant la justification de l'investissement et accélérant l'adoption.