Você criou um app com ajuda de IA e ele funciona, mas se alguém perguntar o que acontece quando um cliente finaliza a compra, ou o que quebra se você mexer em uma tabela, a resposta honesta é "não sei". O Floorplan existe para isso: ele desenha o mapa que ninguém desenhou.
O Floorplan é um plugin grátis e de código aberto (licença MIT) para o Claude Code e para o Codex. Ele lê o código do seu app e abre um mapa interativo no navegador, em que cada parte, cada arquivo e cada requisição ganha um nome em linguagem simples, e as ligações entre eles aparecem desenhadas.
Ele roda no plano que você já tem do Claude Code ou do Codex, sem chave de API. Tudo roda na sua máquina e nada é gravado no git do seu projeto.
Link do repositório e da demo
- Repositório e README: https://github.com/haydenschmitty/floorplan
- Demo para testar no navegador, sem instalar nada: https://haydenschmitty.github.io/floorplan-demo/
- Vídeo oficial de apresentação: https://youtu.be/NTUUzC7L_NQ
A demo mostra o mapa de um app de exemplo, o Brewline (uma assinatura de café), ao lado de uma conversa roteirizada. É a forma mais rápida de entender o que você vai receber antes de instalar.
Comandos de instalação
Você precisa do Node.js 18 ou mais novo e do Claude Code ou do Codex. Versão conferida: 0.6.3, em 06/11/2026.
No Claude Code (no app, aba Code, ou no terminal):
claude plugin marketplace add haydenschmitty/floorplan
claude plugin install floorplan@floorplan
Abra uma sessão nova e ele já está pronto. O README recomenda instalar também o Claude Code de terminal, mesmo para quem usa o app, porque assim a barra de perguntas do mapa consegue ler o seu código de verdade.
No Codex, sem terminal: abra Plugins, escolha "Add a marketplace", em Source digite haydenschmitty/floorplan, clique em "Add marketplace", ache o Floorplan e clique em +. Ou pelo terminal:
codex plugin marketplace add haydenschmitty/floorplan
codex plugin add floorplan@floorplan
Abra uma conversa nova e peça a planta, ou digite $floorplan.
Como pedir a planta
- Abra o seu projeto no Claude Code ou no Codex. Se o site e o servidor ficam em repositórios separados, abra a pasta que tem os dois.
- Peça, em inglês como no README:
Make me a floorplan of this app.Em português o pedido também costuma funcionar, mas o README documenta o pedido em inglês. - Em alguns minutos o mapa abre sozinho, começando por um tour curto.
Depois de mexer no app, peça Update the floorplan. Só o que mudou é lido de novo, e o que você acabou de alterar acende em verde na área "Recent work".
Ainda não tem código? Entregue um PRD (o documento que descreve o que você quer construir) e peça a planta do que seria preciso. Você recebe um "blueprint", o mesmo mapa com os cartões tracejados para mostrar que é um plano.
Perguntas para fazer ao mapa
A barra de perguntas responde com um texto e com um mini-mapa só das peças envolvidas. Exemplos do README:
- "What happens when someone places an order?" (o que acontece quando alguém faz um pedido)
- "Where do we talk to Stripe?" (onde falamos com o Stripe)
- "If I change the users table, what breaks?" (o que quebra se eu mudar a tabela de usuários)
- "Which files handle login?" (quais arquivos cuidam do login)
Você também pode partir de uma tela que conhece e ver tudo que existe por trás dela: as peças, as requisições, o código do servidor, os dados e os serviços de fora.
O que o Health check confere
O Health check procura os erros clássicos de app feito com IA:
- chave ou senha escrita no código, ou enviada para o navegador;
- tabela do Supabase que qualquer pessoa consegue ler;
- regras abertas do Firebase;
- webhook do Stripe que qualquer um poderia falsificar;
- rota do servidor sem exigir login.
Cada problema vem com um prompt pronto para colar e corrigir. Para corrigir tudo de uma vez, peça: Fix the important issues from the floorplan's Health check.
Limites que valem saber
- O Health check é uma checagem, não uma auditoria. O próprio autor diz "a check, not an audit". Um app que passa nele não está garantidamente seguro, e app que lida com dinheiro ou dado de cliente merece revisão de alguém da área.
- Precisa do Claude Code ou do Codex e do Node.js 18+. Sem um dos dois, não roda.
- Os nomes simples dos cartões são gerados pelo agente que você usa, então o idioma do mapa depende dele.
- Se você tiver chave ou senha escrita no código, mudar o código não basta: troque a chave no serviço de origem, porque ela já pode ter ido para o histórico do git.
Fontes
- README do Floorplan, conferido em 06/11/2026: https://github.com/haydenschmitty/floorplan
- Demo: https://haydenschmitty.github.io/floorplan-demo/