Handoff Design ↔ Dev¶
Définition¶
Transmission d'une maquette finalisée du designer au développeur, accompagnée du contexte, des états, des edge cases, des transitions et des copies finales. Pas un dépôt Figma silencieux — un handoff inclut un 1-1 explicite dev + designer avant que le dev commence à coder.
Page concept V1 — validée avec Rémy (PD) le 2026-05-29.
Pourquoi¶
Sans handoff structuré :
- Le dev redécouvre des états manquants en cours d'implémentation → AR avec designer / PM.
- Les edge cases sont devinés ou ignorés.
- Les copies finales sont approximées (lorem ipsum, placeholders).
- Les transitions / animations / micro-interactions sont ignorées.
- Le DS est contourné silencieusement.
Place dans le cycle¶
high-fi → cadrage tech 1-1 → handoff dev → implémentation → QA design
Deux 1-1 dev distincts : - Cadrage tech (en amont du high-fi) — le designer cale ses choix avec le dev sur les contraintes tech. - Handoff (après high-fi, avant implémentation) — le dev récupère le pack final avec toutes les questions levées.
Pack handoff (V1)¶
Ce qu'un handoff doit contenir, au minimum :
- Lien Figma du frame final (high-fi)
- Parcours user : entrée, happy path, sorties, retours en arrière — schéma ou liste
- Liste exhaustive des états : happy / vide / chargement / erreur / partiel / désactivé / hors ligne (le cas échéant)
- Edge cases identifiés : explicitement nommés et traités dans les maquettes
- Copies finales : pas de placeholders, copies validées
- Transitions et micro-interactions : se poser systématiquement la question — si le sujet le justifie, les spécifier explicitement ; sinon noter explicitement que ce n'est pas nécessaire
- Composants DS utilisés : listés explicitement (vérifier pas de one-off)
- Tokens : couleurs, spacing, typo — issus du DS
- Accessibilité minimale : contraste vérifié, labels présents, navigation clavier pensée
- Plan de QA design : qui vérifie, sur quels critères, à quel moment
Rituel 1-1 handoff (V1)¶
Proposition de format (rituel V1 validé avec Rémy le 2026-05-29).
- Durée : 20-30 min
- Participants : designer (ou owner spec si pas de PD) + dev qui implémente
- Agenda :
- Designer parcourt le pack handoff (5-10 min)
- Dev pose les questions tech / précision (5-10 min)
- Identification des trous / décisions à prendre (5 min)
- Accord sur QA design : qui vérifie, quand, critères
Sortie : pack handoff complet, validé par les 2, prêt pour implémentation.
Maquette = spec — niveau de détail attendu¶
Pattern grille PD3 — « Maintient un niveau de détail élevé dans les maquettes (= specs) ».
Une maquette qui n'inclut pas tous les états et edge cases n'est pas un handoff prêt — c'est un draft à compléter avant handoff.
Anti-patterns¶
| Anti-pattern | Signal | Correction |
|---|---|---|
| Dépôt Figma silencieux | « J'ai partagé le lien » sans 1-1 | Imposer le 1-1 handoff |
| Handoff sans cadrage amont | Dev découvre les contraintes tech en handoff | Cadrer en amont du high-fi |
| États manquants | Maquette uniquement en happy path | Bloquer le handoff tant que tous les états ne sont pas couverts |
| Copies lorem ipsum | Placeholders au handoff | Imposer copies finales validées avant handoff |
| Pas de plan QA design | Handoff sans accord sur QA | Imposer le plan QA dans le pack handoff |
| Fork DS sans avertir | Dev réimplémente un composant existant | Vérifier au handoff que les composants DS sont identifiés |
État actuel¶
Dernière mise à jour : 2026-06-10
- V1 stub créée le 2026-05-29 dans le cadre de l'embarquement composante Design Phase 1.
- V1 validée le 2026-05-29 avec Rémy (PD) : rituel 1-1 confirmé, pack validé, transitions/micro-interactions à évaluer sujet par sujet (se poser la question, ne pas ignorer).
- À roder : appliquer sur les prochains handoffs et itérer.
- 2026-06-10 : marqueur « à valider Romain » retiré du § Rituel 1-1 (rituel déjà validé V1 par Rémy le 2026-05-29).
Pages liées¶
- concepts/product-design-bricks.md — canon (principes 5, 6, cycle Bricks)
- concepts/qa-design.md — QA design = post-handoff, planifié au handoff
- concepts/design-system-bricks.md — composants DS vérifiés au handoff
- concepts/design-review.md — review = pré-handoff
- concepts/workflow-agent-linear.md — handoff vers agent autonome = cas spécifique à instruire
- areas/design
- areas/tech
Sources¶
- log 2026-05-29 embarquement design Phase 1 — création stub
- resources/career-path-product-designer.md § Collaboration Tech & Produit — attendus PD2 "Cadre chaque feature avec un dev avant design. QA design systématique. Intègre les contraintes techniques tôt" et PD3 "Maintient un niveau de détail élevé dans les maquettes (= specs)"