Atelier, el paquete de diseño
Transcripción con descripción visual
En pantalla: Paneles de cristal translúcidos flotan separados en un espacio azul oscuro y luego se deslizan hasta formar una pila ordenada que brilla con una luz cálida. El rótulo, en inglés, dice «Atelier · Design pack».
Narración: Atelier, el décimo paquete, crea, audita y rediseña interfaces con reglas verificables.
En pantalla: Una ventana de terminal titulada «~/app». Se escribe el comando bmad-plus intake plan, con el archivo intake.yaml del pack Design y un archivo de respuestas. La imagen se acerca al resultado: «design-read (design): not ready — 0 answered, 0 defaulted…» y, enmarcado en naranja, «Must-haves still open: surface_kind, audience, job». Sigue una lista de preguntas, cada una con su tipo y «(must-have)» cuando corresponde. Se escribe el comando bmad-plus intake record con tres respuestas (surface_kind=dashboard; audience=«Accountants in a practice, on a desktop, at month end»; job=UNKNOWN) y un valor por defecto para design_system. Muestra «Recorded surface_kind, audience, job, design_system in _bmad-output/design/intake.json.» y «design-read (design): ready — 2 answered, 1 defaulted, 1 unknown, 9 not asked yet.» Las preguntas aún abiertas se desplazan, entre ellas los tres ajustes; «[number] Layout variance» aparece enmarcado, y después motion, density y stack. La pantalla termina con «Unknown: job» enmarcado: «risk: There is no goal to review against, so hierarchy and the primary action cannot be judged, only decorated.» Todo el texto del terminal está en inglés.
Narración: Empieza con una lectura del diseño: preguntas sobre la superficie, el público y la única tarea que debe cumplir la página. Un ajuste que dejas abierto se fija a partir de la superficie, y el brief indica que fue deducido.
En pantalla: Pequeñas teselas de cristal aparecen una a una y llenan una cuadrícula, fila a fila, hasta completar un bloque de ocho columnas por cuatro filas. Algunas teselas brillan en ámbar. El rótulo, en inglés, dice «Tokens · WCAG AA · every state».
Narración: Después construye con tokens semánticos, contraste WCAG AA y todos los estados cubiertos.
En pantalla: Una fina línea horizontal de luz cálida descansa sobre un horizonte oscuro. Un haz suave se abre por encima de ella y se refleja en el agua oscura de abajo. El rótulo «Pre-flight», en inglés, aparece con un fundido.
Narración: Termina con una revisión previa a la entrega.
En pantalla: Un terminal. Se escribe el comando sed -n '7,28p' .agents/skills/design/references/80-preflight.md. El archivo se muestra despacio como una lista de comprobación, con cada elemento precedido de una casilla vacía «[ ]». La sección «A. Foundations» abarca los tokens de color semánticos OKLCH, el contraste, como máximo dos familias tipográficas, la escala de espaciado de 4 px y los radios. La sección «B. Accessibility (blockers — any fail blocks delivery)» enumera el HTML semántico, el manejo con teclado, los campos con etiqueta, el tamaño de los destinos, el reflow a 320 px, la reducción de movimiento, los encabezados y las regiones, y el foco que no debe quedar tapado por elementos fijos. La sección «C. States (the most-forgotten section)» empieza con «Empty (first-run) designed with a CTA». Todo el texto del terminal está en inglés.
Narración: «Listo» o «no listo» se lee en la lista de comprobación, no en el aspecto de la pantalla.
En pantalla: Un terminal. Se escribe el comando bmad-plus doctor. La pantalla muestra «BMAD+ Doctor v0.23.0» y «Manifest found: v0.23.0», y después un «BMAD+ Health Report» cuya primera línea, «87/87 checks passed», aparece enmarcada en naranja. Debajo: «0 error(s), 0 warning(s)», «Installed: v0.23.0 | Executing CLI: v0.23.0» y «Ownership inventory: complete». La pantalla termina con una nota que indica que aquí no se comprueba la versión publicada (el comando bmad-plus update-check --json consulta npm) y con «Installation checks passed.» en verde. Todo el texto del terminal está en inglés.
Narración: El instalador copia sus tres skills, y doctor las comprueba.