# Pack Design : Atelier interroge d’abord, puis construit, audite et refond

> Atelier, moteur de design de BMAD+ : intake de 13 questions, puis construction, revue ou refonte via trois compétences, preuves étiquetées, verdict de pré-vol cité. Installation, vraie session.

Canonical: https://bmad-plus.rochetta.fr/fr/docs/packs/design/
Language: fr
BMAD+ version: 0.23.1
Documentation reviewed: 2026-10-19
Author: Laurent Rochetta
License: MIT

Documentation BMAD+ › [Packs](https://bmad-plus.rochetta.fr/fr/docs/packs/) › Pack Design : Atelier interroge d’abord, puis construit, audite et refond

Le pack Design installe Atelier, l’agent BMAD+ pour les interfaces : pages marketing, tableaux de bord, tableaux d’enregistrements, formulaires, parcours de connexion et de première utilisation, vues mobiles et e-mails. Atelier ne commence pas par dessiner. Il lance d’abord un intake, une courte liste de questions sur l’usage de l’écran et ses utilisateurs, et consigne les réponses dans un brief qui devient le contrat de tout ce qui est construit ensuite. Il planifie, construit, audite ou retravaille ensuite l’interface en ouvrant trois compétences qui détiennent les règles de design, et termine en citant le verdict d’une liste de contrôle de livraison, le pré-vol.

<a id="video-atelier-design"></a>
Video: [Atelier, le pack Design](https://bmad-plus.rochetta.fr/media/atelier-design-fr.mp4) — La lecture du design, les tokens et les états, et un verdict de contrôle tiré de la checklist.
[Sous-titres (WebVTT)](https://bmad-plus.rochetta.fr/media/atelier-design-fr.vtt)

Transcription:

> Atelier, le dixième pack, conçoit, audite et refond des interfaces selon des règles vérifiables. Il commence par une lecture du design : des questions sur la surface, le public et l’unique mission de la page. Un réglage que vous laissez ouvert est fixé d’après la surface, et le brief précise qu’il a été déduit. Il construit ensuite avec des tokens sémantiques, un contraste WCAG AA et tous les états couverts. Il termine par un contrôle avant livraison. Prêt ou non prêt se lit dans la checklist, pas dans l’allure de l’écran. L’installeur copie ses trois skills, et doctor les vérifie.

Transcription avec description visuelle:

- **0:00** À l’écran : Des plaques de verre translucides dérivent dans un espace bleu sombre, puis glissent l’une sur l’autre pour former une pile nette, qui rayonne d’une lumière chaude. La légende indique « Atelier · Pack Design ». Voix off : Atelier, le dixième pack, conçoit, audite et refond des interfaces selon des règles vérifiables.
- **0:07** À l’écran : Une fenêtre de terminal intitulée « ~/app ». On tape la commande bmad-plus intake plan, avec le fichier intake.yaml du pack Design et un fichier de réponses. L’image zoome sur le résultat : « design-read (design): not ready — 0 answered, 0 defaulted… » et, entouré en orange, « Must-haves still open: surface_kind, audience, job ». Une liste de questions suit, chacune avec son type et « (must-have) » quand elle s’applique. On tape ensuite la commande bmad-plus intake record avec trois réponses (surface_kind=dashboard ; audience=« Accountants in a practice, on a desktop, at month end » ; job=UNKNOWN) et une valeur par défaut pour design_system. Elle affiche « Recorded surface_kind, audience, job, design_system in _bmad-output/design/intake.json. » et « design-read (design): ready — 2 answered, 1 defaulted, 1 unknown, 9 not asked yet. » Les questions encore ouvertes défilent, dont les trois réglages ; « [number] Layout variance » est entouré, puis viennent motion, density et stack. L’écran se termine avec « Unknown: job » entouré : « risk: There is no goal to review against, so hierarchy and the primary action cannot be judged, only decorated. » Tout le texte du terminal est en anglais. Voix off : Il commence par une lecture du design : des questions sur la surface, le public et l’unique mission de la page. Un réglage que vous laissez ouvert est fixé d’après la surface, et le brief précise qu’il a été déduit.
- **0:24** À l’écran : De petites tuiles de verre apparaissent une à une et remplissent une grille, rangée après rangée, jusqu’à former un bloc de huit colonnes sur quatre rangées. Certaines tuiles brillent en ambre. La légende indique « Tokens · WCAG AA · tous les états ». Voix off : Il construit ensuite avec des tokens sémantiques, un contraste WCAG AA et tous les états couverts.
- **0:32** À l’écran : Un fin trait horizontal de lumière chaude repose sur un horizon sombre. Un faisceau doux s’ouvre au-dessus de lui et se reflète dans l’eau sombre en dessous. La légende « Contrôle avant livraison » apparaît en fondu. Voix off : Il termine par un contrôle avant livraison.
- **0:36** À l’écran : Un terminal. On tape la commande sed -n '7,28p' .agents/skills/design/references/80-preflight.md. Le fichier s’affiche lentement sous forme de liste de contrôle, chaque élément commençant par une case vide « [ ] ». La section « A. Foundations » couvre les jetons de couleur sémantiques OKLCH, le contraste, deux familles de polices au plus, l’échelle d’espacement de 4 px et les rayons. La section « B. Accessibility (blockers — any fail blocks delivery) » liste le HTML sémantique, l’utilisation au clavier, les champs étiquetés, la taille des cibles, le reflow à 320 px, la réduction des animations, les titres et les repères, et le focus qui ne doit pas être masqué par des éléments collants. La section « C. States (the most-forgotten section) » commence par « Empty (first-run) designed with a CTA ». Tout le texte du terminal est en anglais. Voix off : Prêt ou non prêt se lit dans la checklist, pas dans l’allure de l’écran.
- **0:46** À l’écran : Un terminal. On tape la commande bmad-plus doctor. L’écran affiche « BMAD+ Doctor v0.23.0 » et « Manifest found: v0.23.0 », puis un « BMAD+ Health Report » dont la première ligne, « 87/87 checks passed », est entourée en orange. Dessous : « 0 error(s), 0 warning(s) », « Installed: v0.23.0 | Executing CLI: v0.23.0 » et « Ownership inventory: complete ». L’écran se termine sur une note indiquant que la version publiée n’est pas vérifiée ici (la commande bmad-plus update-check --json interroge npm), et « Installation checks passed. » en vert. Tout le texte du terminal est en anglais. Voix off : L’installeur copie ses trois skills, et doctor les vérifie.

<a id="when-to-use"></a>
## Quand l’utiliser

- Vous construisez un nouvel écran et voulez un résultat adapté à son public, qui couvre les états vide, chargement et erreur, pas un modèle générique.
- Il vous faut une feuille de tokens de design (couleurs, typographie, espacements) pour votre stack, ou un audit d’accessibilité de l’existant.
- Un produit en ligne, avec des utilisateurs, une marque et des adresses indexées, doit changer d’apparence sans perdre ce qui fonctionne.

<a id="installed"></a>
## Ce qui est installé

Deux choses arrivent dans votre projet. Le pack lui-même, dans `.agents/skills/pack-design/` : le dispatcher `SKILL.md` (compétence `design-engine`), la persona `design-engine.md`, l’intake `intake.yaml` et un manifeste. Et les règles, copiées par l’installateur depuis le paquet npm `design-skill`, épinglé exactement à la version 0.2.1, dans trois dossiers de compétences à côté du pack. BMAD+ copie le dossier `skills/` de ce paquet et rien d’autre ; le paquet fournit aussi une commande de liaison que BMAD+ n’exécute jamais.

**Les trois compétences de design (design-skill 0.2.1)**

| Compétence | Installée dans | Prend en charge |
| --- | --- | --- |
| `design` | `.agents/skills/design/` | Ce qu’un nouvel écran doit satisfaire, les modules de référence par type de surface, les feuilles de tokens, et la liste de contrôle de livraison (pré-vol) qui le clôt |
| `design-review` | `.agents/skills/design-review/` | Le protocole d’audit et son échelle de gravité |
| `redesign` | `.agents/skills/redesign/` | Comment changer un produit en ligne sans perdre ce qui marche : audit, décision, plan de migration, construction, vérification |

Ce pack ne possède lui-même aucune règle de design. Si `.agents/skills/design/SKILL.md` manque (le paquet n’a pas été résolu, ou la copie a été interrompue), Atelier le signale, renvoie à `bmad-plus doctor`, qui nomme les fichiers manquants, et s’arrête au lieu d’improviser des règles. L’installateur liste chaque fichier de chaque pack choisi avant d’écrire : un `design-skill` manquant dans la bonne version fait donc échouer l’installation sans toucher à votre projet.

<a id="commands"></a>
### Commandes et rôles

**Le routeur /design**

| Commande | Rôle | Ce qu’elle fait |
| --- | --- | --- |
| `/design read` | Builder | Lance ou reprend l’intake, fixe les réglages et la stack, écrit `_bmad-output/design/brief.md`, affiche une lecture design en une ligne (surface, public, famille esthétique) et les trois réglages avec leur origine, fixés ou déduits |
| `/design build <surface>` | Builder | Brief prêt, ouvre `design`, construit la surface et livre avec le verdict de la liste de contrôle cité |
| `/design review <chemin ou url>` | Reviewer | Ouvre `design-review`, audite les fichiers ou la page et écrit `_bmad-output/design/review.md`, chaque constat étiqueté `tool` ou `inspection` |
| `/design redesign` | Redesigner | Ouvre `redesign` et le suit jusqu’au bout : audit, décision motivée, plan de migration avec risques de référencement et d’accessibilité, construction, vérification face à l’ancienne version |
| `/design tokens` | Builder | Produit la feuille de tokens pour la stack consignée dans le brief |
| `/design` ou `/design help` | - | Affiche ce tableau et l’état de l’intake |

Les trois rôles basculent automatiquement quand la demande s’y prête. Des mots comme Atelier, /design, design tokens, maquette, wireframe, landing page, make it look good, accessibilité, refonte ou redesign réveillent l’agent. Atelier annonce le changement et vous pouvez répondre skip pour rester dans le mode actuel.

<a id="intake"></a>
## L’intake : 13 questions, 3 indispensables

La lecture design est un intake de pack : une liste de questions validée dans `intake.yaml`, posées quelques-unes à la fois (six par message au plus) et dans votre langue, indispensables d’abord. Elle compte 13 questions en cinq sections (surface, public, éléments existants, direction, contraintes). Trois sont indispensables, sans lesquelles l’intake ne peut pas être prêt : `surface_kind`, `audience` et `job`. Chaque réponse garde l’un de trois statuts dans tous les livrables : `answered` (vous l’avez dit), `defaulted` (une valeur proposée a été retenue) ou `unknown` (vous ne saviez pas, consigné avec son risque). À part, quand Atelier lit quelque chose dans le produit ou le dépôt lui-même, comme un réglage laissé ouvert ou la stack, ses livrables l’étiquettent inferred. C’est la convention propre à la persona, pas un quatrième statut de l’intake, et une déduction n’est jamais consignée comme votre réponse.

**Les 13 questions de la lecture design**

| Identifiant | Section | Type | Indispensable | Défaut | Porte sur |
| --- | --- | --- | --- | --- | --- |
| `surface_kind` | `surface` | choice | oui | - | Quel type de surface : landing, dashboard, table, form, auth, onboarding, mobile, email, ai-chat, checkout, settings ou other |
| `audience` | `audience` | text | oui | - | Qui l’utilise et dans quelle situation (appareil, urgence, expertise, fréquence) |
| `job` | `audience` | text | oui | - | La seule tâche que la page doit accomplir, et comment vous saurez que c’est fait |
| `brand_assets` | `assets` | choice | non | - | Éléments de marque existants : aucun, partiels ou complets |
| `design_system` | `assets` | choice | non | none | Système de design ou bibliothèque de composants en usage (shadcn, radix, mantine, material, fluent, carbon, polaris, other) |
| `aesthetic_family` | `direction` | choice | non | none | Famille esthétique : minimalist, brutalist, soft-editorial, premium-dense ou none |
| `variance` | `direction` | number 1-10 | non | - | Variance de mise en page, de symétrique et sûr à asymétrique et audacieux |
| `motion` | `direction` | number 1-10 | non | - | Mouvement, de statique à chorégraphié |
| `density` | `direction` | number 1-10 | non | - | Densité, de aérée comme une galerie à dense comme un cockpit |
| `stack` | `constraints` | text | non | - | Pile technique qui le rend ; laissée ouverte, Atelier la lit dans le dépôt |
| `accessibility_target` | `constraints` | choice | non | AA | Niveau de conformité WCAG : AA ou AAA |
| `languages` | `constraints` | text | non | one language, LTR | Langues à servir et présence éventuelle d’une écriture de droite à gauche |
| `required_states` | `constraints` | list | non | - | États à concevoir au-delà du cas nominal : vide, chargement, erreur, aucun résultat, hors ligne, permission partielle |

Les trois réglages (`variance`, `motion`, `density`, de 1 à 10) n’ont volontairement pas de valeur par défaut. Un réglage laissé ouvert est fixé par la compétence `design` d’après la surface et le brief, et le brief indique qu’il est déduit. Un point indispensable auquel vous ne pouvez pas répondre est consigné `UNKNOWN` avec son risque, et ce risque remonte dans le paragraphe d’ouverture de tout ce qui est construit dessus.

<a id="preflight"></a>
### Étiquettes de preuve et verdict de pré-vol

- Chaque constat est étiqueté `tool` quand une commande a été exécutée dans cette session et que le rapport la nomme et cite sa sortie, ou `inspection` quand Atelier a lu les fichiers face à la liste de contrôle. Un chiffre n’apparaît que sous `tool`. Un contrôle attendu par la compétence qui n’a pas pu être exécuté figure sous « not run », jamais estimé.
- La compétence `design` se termine par une liste de contrôle de livraison (le pré-vol, dans son module de référence `references/80-preflight.md`). Chaque livrable finit par les points de cette liste et leur état, et « prêt » ou « pas prêt » vient d’elle, pas de l’allure de l’écran.
- Le périmètre suit la demande : une construction touche les fichiers nommés ou impliqués par le brief, une revue ne change rien, une refonte commence par son audit. Installer un paquet, ouvrir un navigateur ou lancer un scanner est proposé nommément et attend votre accord.

<a id="handoffs"></a>
### Passations vers d’autres agents

**Ce qu’Atelier transmet, et à qui**

| À | Quand | Ce qui est transmis |
| --- | --- | --- |
| Sentinel | Après une construction ou une refonte | La matrice d’états et les parcours clavier à tester ; tant que ce pack est installé, la revue UX de Sentinel cède à Atelier le design visuel et l’accessibilité |
| Pack SEO (Scout, Chief) | Avant le lancement, et avant une refonte qui change adresses, titres ou données structurées | Le plan de migration avec les risques de référencement signalés par la compétence `redesign` |
| Shield | Surfaces de consentement et de vie privée : bandeaux cookies, demandes de données, avis de conservation | La surface construite selon le module de consentement ; Shield garde la base légale et les registres |
| Dev Studio (Rachel, Oholiab) | Des parcours et wireframes existent avant la couche visuelle, ou l’implémentation relève d’un sprint | Les parcours de Rachel alimentent l’intake ; soit Rachel soit Atelier a un écran donné, et la passation dit lequel |
| Nexus | L’autopilot ou un pipeline atteint une étape de design | Nexus exécute l’intake de ce pack via Atelier avant l’étape et ne passe jamais outre un point indispensable ouvert |

<a id="quick-start"></a>
## Démarrage rapide

1. **Installer le pack** Core est ajouté automatiquement. La dépendance `design-skill` arrive avec le paquet BMAD+ ; l’installateur en copie les trois compétences et liste chaque fichier avant d’écrire.

   ```sh
   npx bmad-plus install --packs design
   ```
2. **Vérifier l’installation** Le diagnostic vérifie les fichiers du pack, y compris les trois compétences copiées.

   ```sh
   npx bmad-plus doctor
   ```
3. **Commencer par la lecture design** Atelier pose d’abord ses questions, quelques-unes à la fois, puis écrit le brief.

   ```sh
   /design read
   ```
4. **Construire, relire ou refondre** Appuyez-vous sur le brief pour une nouvelle surface, ou pointez Atelier vers l’existant.

   ```sh
   /design build dashboard
   ```

<a id="real-session"></a>
## Une vraie session, enregistrée

Ces transcriptions ont été capturées en exécutant la CLI 0.23.0 dans un projet jetable. L’installateur a été lancé en français ; les commandes d’intake affichent de l’anglais. Les lignes sans intérêt ici sont omises.

**Installer les packs Core et Design**

```text
$ npx bmad-plus install --yes --lang fr --packs core,design --tools claude-code --directory ./demo-app
*  Packs sélectionnés: ⚙️ Core, 🎨 Design
o  ✅ 5 agents, 9 skills, 4 fichiers copiés
—  BMAD+ est prêt ! Parle à Atlas pour commencer 🚀
$ npx bmad-plus doctor --directory ./demo-app
87/87 checks passed
0 error(s), 0 warning(s)
```

Sortie capturée lors d’une exécution réelle. Source: bmad-plus 0.23.0, 2026-10-19

**Valider l’intake et voir ce qui reste ouvert**

```text
$ npx bmad-plus intake check .agents/skills/pack-design/intake.yaml
.agents/skills/pack-design/intake.yaml: valid intake design-read (design), 13 questions, 3 must-have.
$ npx bmad-plus intake plan --intake .agents/skills/pack-design/intake.yaml --answers _bmad-output/design/intake.json
design-read (design): not ready — 0 answered, 0 defaulted, 0 unknown, 13 not asked yet.
Must-haves still open: surface_kind, audience, job
Ask next (at most 6 per message):
  - surface_kind [choice] Which surface is this? A marketing landing page, a dashboard, a data table, a form, an auth or onboarding flow, a mobile screen, an email, a chat or AI surface, a checkout, a settings page, or something else? (must-have; choices: landing, dashboard, table, form, auth, onboarding, mobile, email, ai-chat, checkout, settings, other)
  - audience [text] Who uses it, and in what situation (device, time pressure, expertise, frequency)? (must-have)
  - job [text] What is the one job this page must get done, and how will you know it did? (must-have)
# Le plan sort avec le code 2 tant qu’un point indispensable reste ouvert. La liste continue avec brand_assets, design_system et aesthetic_family.
```

Sortie capturée lors d’une exécution réelle. Source: bmad-plus 0.23.0, 2026-10-19

**Consigner les trois points indispensables, puis rendre le brief**

```text
$ npx bmad-plus intake record --intake .agents/skills/pack-design/intake.yaml --answers _bmad-output/design/intake.json --set surface_kind=dashboard --set "audience=Comptables en cabinet, sur ordinateur, en fin de mois" --set "job=Repérer les factures en retard et relancer en un clic"
Recorded surface_kind, audience, job in _bmad-output/design/intake.json.
design-read (design): ready — 3 answered, 0 defaulted, 0 unknown, 10 not asked yet.
$ npx bmad-plus intake render --intake .agents/skills/pack-design/intake.yaml --answers _bmad-output/design/intake.json --out _bmad-output/design/brief.md
Brief written to _bmad-output/design/brief.md (3022 bytes); the intake is ready.
# La première ligne du brief est « # Design read » ; la deuxième est un marqueur indiquant qu’il appartient à bmad-plus intake et ne doit pas être modifié à la main.
```

Sortie capturée lors d’une exécution réelle. Source: bmad-plus 0.23.0, 2026-10-19

<a id="examples"></a>
## Exemples à copier

<a id="example-design-read-build-preflight"></a>
### Lecture design, construction, puis verdict de pré-vol

La boucle complète sur un écran. Atelier pose d’abord ses questions, soyez prêt à répondre.

**Dans votre assistant IA**

```text
Atelier, fais la lecture design de la liste des factures de mon application, construis l’écran et termine par le verdict de pré-vol.
```

**Ce que vous devriez obtenir** La lecture design est consignée (`_bmad-output/design/intake.json` et `brief.md`), l’écran est construit avec les états que le brief énumère, et la réponse se termine par la liste de contrôle de livraison, chaque point avec son état, et le verdict prêt ou pas prêt qui en découle.

<a id="example-design-read-only"></a>
### Seulement la lecture design

À utiliser pour arrêter le brief avec un client ou une équipe avant que quiconque dessine ou code.

**Dans votre assistant IA**

```text
Atelier, fais la lecture design avec moi pour l’onboarding de première utilisation de notre outil de planning. Je n’ai pas d’avis sur la densité ni le mouvement, laisse-les ouverts et règle-les d’après la surface.
```

**Ce que vous devriez obtenir** Atelier lance ou reprend l’intake avec la compétence `bmad-plus-intake`, six questions par message au plus et les indispensables d’abord, consigne les réponses avec `bmad-plus intake record`, s’arrête quand `bmad-plus intake plan` dit prêt, rend `_bmad-output/design/brief.md` et affiche une ligne (surface, public, famille esthétique) avec les trois réglages et leur origine, fixés par vous ou déduits ; ceux que vous avez laissés ouverts reviennent marqués inferred.

<a id="example-design-build-dashboard"></a>
### Construire une surface à partir du brief

À lancer une fois le brief établi. Les surfaces incluent landing, dashboard, table, form, auth, onboarding, mobile, email, ai-chat, checkout et settings.

**Dans votre assistant IA**

```text
/design build dashboard
```

**Ce que vous devriez obtenir** Atelier ouvre la compétence `design`, suit son routage pour un tableau de bord et construit dans la stack consignée au brief (lue dans le dépôt si vous l’avez laissée ouverte). Les questions indispensables restées ouvertes remontent avec leur risque dans le paragraphe d’ouverture du résultat, et la livraison se termine par le verdict de la liste de contrôle cité.

<a id="example-design-tokens"></a>
### Produire ou normaliser une feuille de tokens

Utile quand des valeurs de couleur sont saisies directement dans les composants, ce qui déclenche aussi le rôle Builder. Si l’intake n’est pas encore prêt, Atelier le lance d’abord.

**Dans votre assistant IA**

```text
/design tokens
```

**Ce que vous devriez obtenir** Atelier ouvre `design` et ses modules de tokens et produit la feuille de tokens pour la stack du brief, de sorte que les composants prennent couleurs, typographie et espacements dans des tokens plutôt que dans des valeurs brutes. La feuille va sous `_bmad-output/design/`.

<a id="example-design-review-pricing"></a>
### Auditer une page existante, avec preuves étiquetées

Une revue ne change rien ; elle écrit seulement le rapport. Indiquez un dossier, un fichier ou une URL.

**Dans votre assistant IA**

```text
/design review src/pages/pricing
```

**Ce que vous devriez obtenir** Le protocole de la compétence `design-review` s’exécute et `_bmad-output/design/review.md` liste les constats classés par ce qui bloque la livraison, puis ce qui gêne, puis ce qui polit. Chaque constat est étiqueté `tool` (une commande a tourné et sa sortie est citée) ou `inspection` (lu face à la liste de contrôle). Les contrôles qui n’ont pas pu tourner figurent sous « not run ».

<a id="example-design-redesign-live-site"></a>
### Refondre un site en ligne sans perdre son trafic de recherche

Des mots comme refonte, redesign, refresh, modernize ou rebrand font passer Atelier en rôle Redesigner.

**Dans votre assistant IA**

```text
/design redesign le site marketing https://example.com. Conserve le logo et ces URL indexées : /pricing, /features et /blog. Dis-moi quels changements mettent le référencement ou l’accessibilité en risque.
```

**Ce que vous devriez obtenir** La compétence `redesign` est suivie de bout en bout : d’abord un audit, une décision conserver ou refondre avec sa raison, un plan de migration qui signale les risques de référencement et d’accessibilité pour les URL que vous avez citées, la construction via `design`, et une vérification face à l’ancienne version. Atelier ne peut pas savoir d’après la consigne quelles URL se classent, d’où l’intérêt de les nommer. Une étape de navigateur, de scanner ou d’exploration est proposée nommément et ne s’exécute qu’après votre accord. Le plan de migration est transmis au pack SEO avant que tout changement d’adresse, de titre ou de données structurées soit livré.

<a id="example-design-unknown-answer"></a>
### Dire ce que vous ne savez pas

Un point indispensable inconnu est permis. Il est consigné avec son risque plutôt qu’inventé.

**Dans votre assistant IA**

```text
Atelier, conçois un écran de réglages pour notre console d’administration. Je ne sais pas encore qui est l’administrateur type ; consigne-le comme inconnu et fais suivre le risque.
```

**Ce que vous devriez obtenir** `audience` est consigné `UNKNOWN` avec le texte de risque propre à l’intake (en anglais) : « Density, tone and the size of touch targets are guessed instead of chosen; the page serves nobody in particular. », soit la densité, le ton et la taille des cibles tactiles devinés plutôt que choisis, et une page qui ne sert personne en particulier. Le brief le marque ouvert, et l’écran livré indique dans son paragraphe d’ouverture qu’il repose sur cet inconnu. Atelier demande encore la surface et la tâche avant de construire : l’intake n’est prêt que lorsque les trois points indispensables ont une réponse ou sont marqués inconnus.

<a id="example-design-handoff"></a>
### Passer l’écran terminé à Sentinel

Après une construction, la matrice d’états et les parcours clavier sont ce dont un testeur a besoin.

**Dans votre assistant IA**

```text
Atelier, la liste des factures est construite. Prépare la passation à Sentinel : la matrice d’états et les parcours clavier à tester. Puis Sentinel, écris la recette correspondante.
```

**Ce que vous devriez obtenir** Atelier liste chaque état conçu et chaque parcours clavier comme passation. Le rôle Recette de Sentinel les transforme ensuite en étapes d’une recette ; tant que le pack Design est installé, Sentinel laisse le jugement sur le design visuel et l’accessibilité à Atelier.

<a id="outputs"></a>
## Ce qu’il écrit et où

**Fichiers écrits sous _bmad-output/design/**

| Fichier | Écrit par | Contenu |
| --- | --- | --- |
| `intake.json` | `bmad-plus intake record` | Les réponses avec leur statut : answered, defaulted, unknown |
| `brief.md` | `bmad-plus intake render` | La lecture design ; la ligne 2 porte un marqueur d’appartenance, et le fichier n’est jamais modifié à la main |
| `review.md` | `/design review` | Les constats avec les étiquettes tool ou inspection |
| Feuille de tokens | `/design tokens` | Les tokens pour la stack du brief |

Le code lui-même est écrit dans les sources de votre projet là où vous l’avez demandé. Le rendu n’écrase jamais un brief qu’il n’a pas écrit, et l’intake refuse d’écrire sous `.git/`, `_bmad/`, `.bmad-plus/` ou `node_modules/`.

<a id="data-and-prerequisites"></a>
## Flux de données et prérequis

- Node.js 20 seulement. Le paquet npm `design-skill`, épinglé à 0.2.1, est récupéré par l’installation normale de BMAD+ (c’est l’une de ses sept dépendances d’exécution) ; l’installateur en copie les compétences.
- Le pack n’exécute aucun script, ne lance aucun processus propre et n’envoie rien nulle part. Un contrôle qui demande un navigateur ou un scanner ne passe que par l’outillage de votre projet, proposé nommément, avec votre accord. Les flux hors machine de l’outil hôte s’appliquent comme pour tout agent.

<a id="limits"></a>
## Limites et pièges

> **Attention · Sans compétences, pas de design** Atelier repose entièrement sur les trois compétences copiées. Sans elles il s’arrête plutôt que de citer des règles de mémoire. Après une installation interrompue ou une suppression manuelle, lancez `bmad-plus doctor` et réinstallez.

> **Remarque · Un chiffre exige un outil** Les ratios de contraste, scores de performance ou nombres de constats n’apparaissent que si une commande a tourné dans la session. Sinon le constat est une inspection sans chiffre, et le contrôle est listé comme non exécuté. Ne lisez pas une inspection comme une mesure.

> **Astuce · Qui a la charge de l’écran** Atelier recoupe la revue UX de Sentinel et Rachel dans Dev Studio. Avec le pack Design installé, ses règles gouvernent le design visuel et l’accessibilité et les autres les lui cèdent. Pour un écran donné, choisissez un responsable et laissez la passation dire lequel.

**Voir aussi**

- [Les dix packs côte à côte](https://bmad-plus.rochetta.fr/fr/docs/packs/packs-overview/)
- [Référence de la commande intake](https://bmad-plus.rochetta.fr/fr/docs/reference/cli-intake/)
- [L’intake, comment ça marche](https://bmad-plus.rochetta.fr/fr/docs/concepts/intake/)
- [Pack SEO / GEO](https://bmad-plus.rochetta.fr/fr/docs/packs/seo/)
- [Pack Dev Studio (Rachel)](https://bmad-plus.rochetta.fr/fr/docs/packs/dev-studio/)
- [Référence de la commande doctor](https://bmad-plus.rochetta.fr/fr/docs/reference/cli-doctor/)

[Documentation BMAD+](https://bmad-plus.rochetta.fr/fr/docs/) · [Packs](https://bmad-plus.rochetta.fr/fr/docs/packs/)

[Code sur GitHub](https://github.com/lrochetta/BMAD-PLUS)