Orquestra a criação ou atualização do protótipo visual (telas/wireframes) de uma feature a partir do PRD existente. Gera um único arquivo `ai-sdd/prd-[slug]/design.md` por feature. Paper-first: tenta usar o Paper Desktop (via MCP) chamando design-in-paper, que registra cada tela com seu Paper artboard ID. Fallback agnóstico: se o Paper não estiver disponível ou o usuário preferir outra ferramenta (Figma, Sketch, screenshots, descrição textual), registra as telas com referências externas no mesmo design.md. Detecta automaticamente criação (sem design.md) vs edição (design.md existe). Use quando o usuário pedir "criar o design", "criar protótipo", "wireframe da feature", "atualizar design", "/cria-design [feature-slug]". Posição no pipeline: após cria-prd, antes de cria-techspec. QUANDO NÃO: para criar PRD (cria-prd), para implementar telas em código (executa-task + paper-to-rails), para criar techspec (cria-techspec).
Converte PRD e Tech Spec em uma lista detalhada e sequencial de tarefas de implementação. Cada tarefa é um entregável funcional e incremental com sua própria suíte de testes. Gera tasks.md (resumo) e arquivos de tarefas individuais com subtarefas, critérios de sucesso e testes. Use quando o usuário solicitar criar tarefas, decompor trabalho ou planejar implementação a partir de PRD e Tech Spec existentes. Não use para criação de PRD, criação de tech spec ou implementação real de código.
Cria Especificações Técnicas a partir de um PRD existente, traduzindo requisitos de produto em decisões arquiteturais e orientação de implementação. Realiza análise profunda do projeto, pesquisa técnica, pesquisa regras de negócio e esclarecimento com o usuário. Use quando o usuário solicitar criar uma spec técnica, definir arquitetura ou planejar implementação de uma funcionalidade com PRD existente. Não use para criação de PRD, detalhamento de tarefas ou implementação direta de código.
Cria ou atualiza wireframes e designs de UI no Paper (paper.design) a partir de um PRD existente. Gera artboards estruturados e Rails-ready (flex layouts, tokens do design system, conteúdo real) para revisão humana antes da techspec. REQUER: Paper Desktop app rodando + MCP Paper configurado no editor. Use quando o usuário pedir "crie o design no Paper", "wireframe no Paper", "gere os artboards", "monte a UI no Paper a partir do PRD". QUANDO NÃO: Use sem Paper disponível. Para converter design em código Rails (ver paper-to-rails). Para criar o PRD (ver cria-prd). PRÉ-REQUISITO NO PIPELINE AI-SDD: após cria-prd, antes de cria-techspec.
Implementa tarefas de funcionalidades lendo o contexto do PRD/TechSpec, analisando dependências, executando a implementação com testes e verificações de qualidade. Marca as tarefas como concluídas em tasks.md e aciona revisão ao finalizar. Use quando o usuário solicitar implementar uma tarefa, executar uma tarefa ou começar a trabalhar em um número de tarefa específico. Não use para criar tarefas, rodar QA, revisão de código ou correção de bugs avulsos.
Converte designs do Paper (paper.design) em código Rails idiomático: views ERB, partials, helpers, layouts e i18n. Lê o design via Paper MCP (get_jsx, get_computed_styles, get_screenshot) e produz código Rails seguindo os padrões do projeto (Tailwind CSS v4, Hotwire, Stimulus). REQUER: Paper Desktop app rodando + MCP Paper configurado no editor. Use quando o usuário pedir "implemente o design do Paper", "converta esse artboard em Rails", "gere o código a partir do Paper". Pode ser invocada diretamente ou pela skill executa-task quando a task tem referências de artboards Paper em seu arquivo de task ou em design.md. QUANDO NÃO: Use sem Paper disponível. Para criar designs no Paper (ver design-in-paper).
Implementa animações CSS e micro-interações para projetos Rails com Turbo. Garante que transições e animações funcionem corretamente com Turbo Drive (sem quebrar na navegação), Turbo Frames e Turbo Morph. Use quando precisar adicionar animações, transições de página, skeleton loaders, estados de loading, hover effects ou micro-interações em views Rails. Palavras-chave: "adicionar animação", "transição", "loading", "skeleton", "hover effect", "micro-interação", "fade", "slide", "animação suave". QUANDO NÃO: Para interatividade complexa com JS (ver stimulus-patterns) ou atualizações reativas do servidor (ver turbo-patterns).
Cria componentes de UI reutilizáveis e Rails-idiomáticos: partials ERB, helpers de classe, layouts aninhados e slots com content_for/yield. Use quando precisar criar, extrair ou organizar componentes de interface em um projeto Rails — botões, cards, navbars, sidebars, modais, formulários, empty states e afins. Palavras-chave: "crie um componente", "partial reutilizável", "botão", "card", "navbar", "sidebar", "modal", "formulário", "layout". QUANDO NÃO: Para animações (ver rails-animations), design tokens (ver tailwind-design-system) ou interatividade JS (ver stimulus-patterns).