ADR : les PD livrent l'UI dans Storybook, hors apps¶
Contexte¶
Après le hackaton, Rémy et Pierre veulent travailler dans le Storybook de prod plutôt qu'en bac à sable. Le handoff actuel (maquette Figma → Hugo → IA) fait d'Hugo un relais d'intégration, alors que sa plus-value est l'archi et le garde-fou. Le point du 2026-08-20 a tranché un premier palier, pas la fin de Figma.
Source : fiche meeting.
Options envisagées¶
Option A : tuer Figma, designer 100 % dans Storybook¶
- Description : les PD ne produisent plus de maquettes Figma ; Storybook est la spec.
- Avantages : une seule source ; plus de drift Figma↔code.
- Inconvénients : Hugo ne se projette pas encore ; pas de critère de merge posé. — L917
- Coût estimé : élevé, non cadré.
Option B : statut quo (PD Figma, Hugo intègre)¶
- Description : le PD passe le lien Figma, Hugo le donne à l'IA.
- Avantages : déjà en place.
- Inconvénients : double relais ; les PD ne voient pas les contraintes code. — L937
Option C : Figma inchangé, les PD prennent le dernier kilomètre dans Storybook¶
- Description : design toujours dans Figma ; une fois validé, le PD génère le composant / screen dans Storybook (
uimmo), ouvre une PR. L'autre PD review le design, Hugo review le code. Pas de branchement apps ni d'API. - Avantages : plus petit test ; Hugo review au lieu d'intégrer ; les PD apprennent le DS réel.
- Inconvénients : Figma et code restent deux mondes ; les PD ne mergent pas.
- Coût estimé : 1re PR de prise en main (court terme).
Décision¶
Option retenue : C — proposée par Rémy, validée par Hugo. — L943
Garde-fous actés dans le même point :
- Hors-scope : rester dans Storybook ; ne pas toucher Investors / EF ni brancher d'API. — L947
- Merge : les PD ne mergent pas ; Hugo review le code. — L493
- Publication : Storybook auto sur chaque PR, sans label Chromatic. Chromatic = tests CI seulement. — L523
- Rules : pas de rules Cursor par rôle designer. Doc de composant OK. — L557
Conséquences¶
Positives attendues¶
- Hugo arrête d'être le relais Figma → IA.
- Les PD voient le DS réel (tokens, variants, stories) et peuvent corriger ce que Figma a déjà changé mais pas le code.
- Les PR PD servent de test des rules / de la codebase (signal, pas blâme). — L549
Négatives acceptées¶
- Figma et Storybook restent deux sources pendant ce palier.
- Les PD ne livrent pas dans les apps : un screen Storybook n'est pas « en prod ».
- Features liées à la nav (ex. centre de notifs) restent plus dures ; préférer screens / modals. — L1007
Reversibilité¶
- Coût d'annulation : bas — on reprend le handoff Figma → Hugo.
Plan d'implémentation¶
- [ ] Hugo : publication auto Storybook sur les PR + plugin de doc
- [ ] Rémy + Pierre : 1re PR de prise en main dans
uimmo(rangement / correctif) - [ ] Rémy + Pierre : inventaire AppInvest / PDP / Shared → ce qui monte dans
uimmo - [ ] Questions sur
#techfront - Ownership : Hugo (outillage) · Rémy + Pierre (PRs) · Hugo (review merge)
- Definition of done : une PR PD reviewable avec Storybook publié, sans toucher aux apps
- Hors-scope : connexion API, merge par les PD, tuer Figma
Métriques de succès¶
[outcome non formulé] dans le meeting. Proposition à valider : une PR PD mergée (rangement ou correctif) avec Storybook publié, sans toucher aux apps, d'ici 2 semaines.
Vérification post-implémentation¶
- Storybook d'une PR s'ouvre sans label Chromatic
- Plugin docs visible dans Storybook
- 1re PR PD : Hugo a pu reviewer sans cloner en local
Review design¶
- Parcours user impactés : aucun parcours user en prod (hors-scope apps)
- États / edge cases : stories interactives attendues ;
[états non listés]au-delà - Fidélité : high-fi code (Storybook) à partir de maquettes Figma déjà validées
- Plan de test UX : review PD croisée sur la PR + inspection tokens / JSX
- QA design : variant + color ; JSX plutôt qu'inspecteur CSS — L831
- Impact DS : rangement
uimmo+ ajouts tokens/variants/composants par les PD
Sources¶
Révisions¶
- 2026-08-20 : créée (status: proposed) — ingest du transcript Leexi