O problema
Alguém do produto pergunta "o que acontece se a pessoa não confirmar o e-mail?" e a resposta mora em três arquivos, num teste A/B e numa flag. Você abre o app, tira print de quatro telas, cola num documento e explica numa reunião. Na semana seguinte o fluxo muda, e o documento passa a mentir sem ninguém perceber.
Quem decide o produto nunca vê o fluxo inteiro, só pedaços, e decide em cima do pedaço. E cada pergunta nova volta pra sua mesa.
O que a skill faz
Ela desenha a planta do fluxo: cada tela do seu app, fotografada de verdade e na ordem da jornada, com os estados em que ela pode estar e as regras que fazem ela se comportar assim. Cada regra vem numa frase que qualquer pessoa entende, com o link pra linha do código que faz aquilo. Ninguém precisa acreditar em ninguém: está escrito.
Os passos que o produto ainda não tem aparecem também, tracejados, com duas ou três opções desenhadas, pra conversa começar de algo concreto. Antes de entregar, cada regra é conferida contra o código por um segundo agente, e a página é testada no celular e no computador, nos temas claro e escuro.
O resultado é um link (ou um arquivo HTML) que a pessoa de produto abre, percorre como um passeio e usa nas conversas: "a E5b, não a E5a". Quando o fluxo muda, a planta se refaz numa rodada.
O que vem no pacote
- A skill pro Claude Code, pronta pra copiar pra dentro do seu projeto;
- O motor da página: abas pra vários fluxos, telas de celular e de computador, busca por código e os temas claro, escuro e do sistema;
- O conferidor que dirige a página antes da entrega e reprova o que ficou ruim;
- Um exemplo completo que roda no primeiro minuto, sem precisar fotografar nada;
- O guia de instalação, a tabela do que adaptar e as respostas pras dúvidas mais comuns.
O que ela NÃO faz
- Não redesenha telas. Ela mostra o fluxo como ele é hoje; propor telas novas é outro trabalho.
- Não fotografa produção. Ela precisa do seu app rodando local, com um banco novo e dados inventados. Se o seu app não sobe local, ela só consegue desenhar.
- Não inventa o que a IA do seu app responde. Se o fluxo tem IA, os prints precisam de uma chamada de verdade: uma chave de teste ou o modo local do próprio app.
- Não mapeia a arquitetura do código. O leitor é quem decide o produto, não quem programa.
- Precisa de Claude Code, Node 22 ou mais novo e um navegador automatizado (agent-browser ou Playwright). Sair como link depende de a sua conta publicar Artifacts; sem isso, sai um arquivo HTML que abre em qualquer navegador.
Pra quem é
Pra quem já entrega produto com IA e precisa que gente de fora da engenharia (sócio, cliente, PM, operação) entenda e discuta o fluxo sem depender de você explicar tela por tela.
Não é pra quem está começando: você vai precisar subir o app local com um banco separado e dizer à skill como fazer isso.
A skill nasceu e foi refinada em dois produtos SaaS em produção, com rodadas de feedback de quem decide o produto.
