Aller au contenu

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

Sources