Architecture Diagrammer
Transforma uma especificação em texto simples de componentes e conexões em um diagrama de arquitetura SVG validado, com um relatório que descarta arestas desconhecidas, rejeita IDs duplicados e aponta componentes isolados e ciclos.
Funciona com: Claude Code, Codex, Cursor, Muse · Versão 1.0.0 · Você precisa de: Uma especificação de arquitetura (spec.txt: [components] id: Rótulo | tipo, [connections] a -> b: rótulo).
Obtenha este Skill com o Premium Ver planos
Prévia

Resultado de exemplo
Um exemplo do que este Skill produz. Conteúdo de amostra, mostrado para ilustração.
Architecture Diagrammer report — sample Diagram report: Shop API Components: 5 | Edges drawn: 5 | Columns: 4 Components: Web App (client, column 0); API Server (service, column 1); Redis Cache (cache, column 2); Job Worker (service, column 2); Postgres (database, column 3). Edges: Web App -> API Server: HTTPS; API Server -> Redis Cache: GET; API Server -> Postgres: SQL; API Server -> Job Worker: Enqueue; Job Worker -> Postgres: SQL. Errors: none. Warnings: none. Messy draft check: 5 components, 3 edges drawn, 2 errors (duplicate api id; edge to unknown ghost dropped), 4 warnings (unknown type, 2 orphans, cycle api -> db -> api).
O que você recebe
- Um diagrama SVG validado: colunas por dependência, setas rotuladas, ciclos desviados por baixo
- Um relatório do diagrama: tabelas de componentes e arestas mais todos os erros e avisos
- Validação antes de desenhar: descarta arestas desconhecidas e rejeita IDs duplicados
- Um formato de especificação que você pode versionar junto com o diagrama que ele produz
Sobre este Skill
Lê uma especificação em texto simples ([components] com id, rótulo e tipo; [connections] com setas rotuladas) e gera um diagrama SVG em colunas por dependência mais um diagram-report.md: tabelas de componentes e arestas, uma coluna por componente e todos os erros e avisos. Uma conexão que nomeia um componente desconhecido é descartada, nunca desenhada para uma caixa inventada; um ID duplicado mantém sua primeira definição; componentes isolados e ciclos são relatados, não ocultados. Apenas local, apenas biblioteca padrão; o diagrama mostra somente o que a especificação lista — nada é inferido para completar a imagem.
Experimente
Desenhe o diagrama de arquitetura da minha Shop API a partir desta especificação.
Ideal para
- Documentar um sistema para um README, um documento ou uma revisão de PR
- Verificar um esboço de arquitetura feito à mão antes de compartilhá-lo
- Manter um diagrama honesto: só se desenha o que está listado
Não serve para
- Gerar um diagrama a partir do código por engenharia reversa — a especificação é escrita por você
- Inventar componentes, armazenamentos ou conexões ausentes para completar a imagem
- Provar que uma arquitetura está correta — um relatório limpo significa que ela coincide com a especificação, não com a realidade
Como instalar
- Copie o prompt de instalação no seu agente:
Read https://skillu.dev/install/agent.md, then install the Architecture Diagrammer skill (architecture-diagrammer). - Ou baixe o pacote do Skill nesta página após o lançamento e coloque a pasta dele no diretório de skills do seu agente.
- Chame-o com um comando de barra, ex.:
/architecture-diagrammer, e descreva o que você quer em palavras simples.
Perguntas frequentes
O que acontece se minha especificação tiver um erro?
O diagrama ainda é gerado a partir das partes válidas, e o relatório lista todos os erros e avisos: arestas desconhecidas são descartadas, IDs duplicados mantêm sua primeira definição e isolados e ciclos são apontados. Corrija a especificação e execute novamente.
Ele desenha algo que eu não listei?
Não. Só aparecem os componentes e arestas da sua especificação. Um cache ou caminho alternativo ausente é uma lacuna da especificação a corrigir, não algo que a skill preencha.