Esqueça as caixas: faça o conceito se mover
Cada ferramenta de diagrama que você já usou desenha caixas e setas. Esta nova habilidade de IA, chamada Anatomy, tem uma regra: não faça isso. Sua ideia central é que um diagrama convencional apenas mostra o que existe, enquanto uma máquina física pode mostrar como um mecanismo se comporta.
O Anatomy faz com que a IA invente uma máquina física cujo mecanismo espelha o seu conceito. Uma chave de cache torna-se uma fechadura de pinos, onde a chave correta alinha os pinos para abrir a porta. Um handshake TCP são cartas passadas ao longo de uma corda, e um cache LRU demonstra mudanças de estado conforme é executado.
Estas não são imagens estáticas. O Anatomy renderiza uma máquina interativa que você pode cutucar e explorar. Esta é uma distinção crucial de ferramentas como Mermaid, D2, Excalidraw ou outras habilidades de diagrama de arquitetura.
Essas ferramentas desenham topologia, mapeando o que se conecta ao que em todo um sistema. O Anatomy, no entanto, explica um mecanismo – como uma única coisa se comporta. Ele constrói um modelo pequeno e preciso para iluminar aquele processo específico, não para mapear a arquitetura de todo um sistema.
A parte inteligente acontece antes do desenho
O verdadeiro gênio do Anatomy reside na sua abordagem de "Verdade Primeiro". O agente de IA não começa apenas a desenhar; ele primeiro reúne todas as regras e valores, depois constrói um pequeno modelo matemático puro de como o conceito se comporta. Somente após essa modelagem rigorosa ele planeja e desenha o visual.
Isso significa que as leituras interativas na tela estão conectadas diretamente a esse modelo subjacente, não apenas simuladas. Quando você altera um controle em um diagrama do Anatomy, você não está acionando uma animação decorativa; você está atualizando o estado demonstrado real com base nos cálculos do modelo.
Verificações de geometria também estão integradas. O sistema pode confirmar que nada se sobrepõe a outras partes ou que as conexões terminam onde deveriam. Ele até garante a ordenação z isométrica adequada.
No entanto, existe um limite de validação crucial: essas verificações apenas verificam a imagem, não os fatos. O agente pode confirmar que a geometria está correta, mas não pode estabelecer que os fatos ou a própria metáfora são verdadeiramente precisos. Uma explicação é tão verdadeira quanto sua analogia. É por isso que você deve sempre ler a metáfora antes de confiar no desenho.
De pools de conexões a motores de foguete
Então, como você realmente usa isso? Você solicita ao agente um conceito e seu comportamento, depois adiciona instruções como "interativo". A demonstração do vídeo, por exemplo, modela um pool de conexões de banco de dados de dez conexões, mostrando-as sendo emprestadas, devolvidas e colocadas na fila quando todas estão ocupadas.
O Anatomy vem com vários exemplos integrados que mostram sua versatilidade. Eles incluem um indicador de discagem simples, um computador interativo onde você pode digitar na tela e um motor de foguete Raptor detalhado que explode em 11 conjuntos com uma pluma de exaustão WebGL. Isso demonstra como ele escala de dispositivos básicos para sistemas complexos.
O Anatomy é uma habilidade de agente de código aberto para agentes de codificação compatíveis como Claude Code, OpenAI Codex, OpenCode e Antigravity. Você pode instalá-lo com npx ou clonando o repositório. Para mais detalhes, confira GitHub - wheresryan22/anatomy: An agent skill for creating detailed, interactive isometric illustrations.
O resultado é um arquivo HTML/SVG independente ou um componente React, que você pode controlar com opções como dark mode ou WebGL. Isso significa que os desenvolvedores podem incorporar facilmente esses visuais dinâmicos em documentações, postagens de blog ou landing pages, tornando conceitos abstratos genuinamente interativos.
Gostando do artigo? Receba um assim na sua caixa de entrada toda manhã.
um e-mail por dia · cancele em dois cliques · sem rastreadores de terceiros
Um explicador brilhante—com um medidor de tokens
As explicações brilhantes do Anatomy têm um custo. Gerar uma figura interativa não é um esboço rápido em um quadro branco; espere um tempo significativo e consumo de tokens. Uma figura "normal" pode levar de 30 a 90 minutos, enquanto uma renderização "Epic" pode consumir de 2 a 4 horas, ou até mais de 48 horas para designs altamente complexos. As estimativas variam muito, então planeje seu orçamento de acordo em planos com medição.
Esta ferramenta brilha em casos de uso específicos onde uma explicação única e interativa justifica o esforço. Considere-a para:
- Documentação técnica
- Ensino de conceitos complexos
- Landing pages de produtos
- Postagens de blog envolventes
Aborde sempre o resultado com um olhar crítico. Inspecione a metáfora física subjacente: ela é realmente precisa? Teste a interação você mesmo. Reserve orçamento para revisões, já que as verificações automáticas da IA validam a integridade geométrica, não a correção factual da analogia. Uma auditoria visual não substitui uma revisão rigorosa do assunto.
Perguntas Frequentes
O que é a skill Anatomy AI?
Anatomy é uma skill de agente open-source que cria máquinas ilustradas interativas para explicar como conceitos técnicos se comportam.
Como o Anatomy é diferente dos diagramas Mermaid?
O Mermaid mapeia componentes e conexões; o Anatomy constrói uma metáfora física que modela um mecanismo e pode responder à interação.
O que o Anatomy gera?
Ele pode produzir uma página HTML independente com visuais SVG ou um componente React incorporável, com WebGL opcional ou 3D experimental.
O Anatomy é rápido ou barato de usar?
Não necessariamente. Figuras complexas podem exigir execuções longas do agente e tokens substanciais, portanto, verifique o escopo e o custo antes de começar.
O Anatomy pode verificar se sua explicação está correta?
Ele pode testar aspectos da geometria e da interação, mas essas verificações não provam que a metáfora escolhida ou a explicação técnica estão precisas.