Do PRD ao código: o workflow completo com skills do Matt Pocock
por Fabricio Telles··design.app.br
Instalação
De “vou codar isso” para “vou planejar, validar, explorar, implementar e testar isso”
A diferença entre um projeto que funciona e um que funciona bem geralmente não está no código — está no que aconteceu antes. As skills do Matt Pocock formam um pipeline completo de desenvolvimento em 5 etapas. Vou percorrer cada uma.
Etapa 1: write-a-prd, definir o que construir
A skill inicia uma entrevista interativa. Explora o codebase existente para entender o contexto, faz perguntas sobre o problema que você quer resolver, investiga edge cases e requisitos não-funcionais, propõe design de módulos. O resultado é um PRD completo registrado como GitHub Issue, não um documento Word que ninguém lê.
Etapa 2: grill-me, stress-test do plano
Antes de implementar, passe o PRD pelo grill-me. A skill te interroga sobre cada decisão: “Por que você escolheu essa abordagem em vez de X?”, “O que acontece quando Y falha?”, “Como isso escala para Z usuários?”
O processo continua até que cada branch da árvore de decisão esteja resolvida. É desconfortável, e é esse o ponto. Melhor descobrir problemas agora do que em produção.
Etapa 3: design-an-interface, explorar opções
A skill usa sub-agentes paralelos para gerar múltiplos designs radicalmente diferentes para o mesmo módulo. Não são variações sutis, são abordagens completamente distintas.
Exemplo para um módulo de autenticação: Design A com login tradicional email/senha + OAuth. Design B com magic link only, zero passwords. Design C com passkey-first e fallback para email. Design D com progressive authentication (começa anônimo, pede auth quando necessário).
Cada design vem com trade-offs explícitos. Você escolhe ou combina elementos de vários.
Etapa 4: prd-to-plan, plano de implementação
Transforma o PRD em fases de implementação usando “tracer-bullet vertical slices”. Cada slice atravessa todas as camadas: route, controller, service, database, UI. Cada slice é deployável independentemente. Nada de “construir todo o backend primeiro, depois todo o frontend”.
Etapa 5: tdd, implementação com qualidade
Para cada slice, a skill aplica o loop red-green-refactor: escreve um teste que falha, escreve o código mínimo para passar, melhora o código mantendo os testes verdes. Resultado: código testado, incremental, com commits pequenos.
O poder da combinação
Nenhuma dessas skills gera UI bonita. Mas quando você combina esse workflow com uma skill visual (Impeccable, Taste Skill ou UI/UX Pro Max), o resultado é superior:
- write-a-prd define o que construir
- grill-me valida as decisões
- design-an-interface explora opções de design
- prd-to-plan planeja a implementação
- tdd implementa com qualidade
- Impeccable/Taste/ProMax aplica design visual
É a diferença entre “pedi pra IA fazer um dashboard” e “planejei, validei, explorei opções, implementei com testes, e apliquei design profissional”. Dá mais trabalho? Dá. Mas o resultado não se compara.
Como instalar
npx skills@latest add mattpocock/skills/write-a-prd
npx skills@latest add mattpocock/skills/tddFonte: github.com/mattpocock/skills