Sobre o projeto

fireworks-tech-graph é um Agent Skill que funciona sem alterações no Codex e no Claude Code. Ele converte descrições em linguagem natural (inglês ou chinês) em diagramas SVG com verificação geométrica, exportações PNG de alta resolução, movimento semântico SVG-para-GIF validado e um único arquivo HTML interativo offline. Capacidades principais - 12 estilos visuais: 11 perfis com suporte de gerador mais um estilo criado por IA (Dark Luxury). Quatro estilos voltados à engenharia adicionam contratos executáveis para revisões C4, implantações em nuvem, fluxos de eventos e investigações de confiabilidade. - 14 tipos de diagrama com suporte completo a UML: Classe, Componente, Implantação, Pacote, Estrutura Composta, Objeto, Caso de Uso, Atividade, Máquina de Estados, Sequência, Comunicação, Timing, Visão Geral de Interação e Diagrama ER, além de padrões de domínio AI/Agent como RAG, Agentic Search, Mem0, Multi-Agent e Tool Call. - Vocabulário semântico: as formas codificam papéis (LLM como retângulo de borda dupla, Agent como hexágono, Vector Store como cilindro com anéis) e os padrões de cor/traço das setas codificam significado (escrita, leitura, assíncrono, loop). - Roteamento e layout: rotas ortogonais determinísticas com waypoints exatos, portas distintas, relocação automática de legenda, rótulos mantidos dentro da tela e saltos de ponte verificados para cruzamentos inevitáveis. - Validação: um IR de diagrama versionado normaliza JSON legado para o schema v1 e falha em IDs duplicados, referências pendentes, waypoints malformados ou geometria não finita; verificações estruturadas de SVG cobrem integridade de XML e marcadores, além de condições de nó, região reservada, rótulo, tela, sobreposição de arestas e cruzamento de arestas. - Saída: SVG para edição e PNG de 1920px para incorporação; SVG inline puro sem busca externa de fontes, destinado a renderizar em cairosvg, rsvg-convert e Chrome headless. Uma CLI unificada oferece render, validate, check, export-html e animate, e a exportação HTML adiciona pan/zoom, temas claro/escuro, cópia do código-fonte e downloads em SVG/PNG/JPEG/WebP em 1x-4x. - Movimento: o comando animate aceita um SVG semântico gerado que carrega um dos doze contratos de movimento aprovados e emite um GIF mais um relatório de verificação motion.json. O padrão documentado é 960px, 5,75 segundos, 20fps, 115 amostras de quadros, com conectores desenhados em ordem semântica; linhas do tempo mais curtas de 75 e 55 quadros também são suportadas. - Portão de revisão visual: os PNGs exportados são inspecionados quanto a recortes, sobreposição, posicionamento de rótulos e regressões de roteamento, com no máximo duas passagens de correção focadas por padrão; se o runtime não conseguir ler imagens, o skill reporta visual_review como ignorado em vez de alegar verificação. - Ícones de produtos: mais de 40 produtos com cores de marca, além de agrupamento automático em raias (swim-lanes) para arquiteturas complexas. Instalação e requisitos A instalação é feita via CLI de skills usando o caminho aninhado skills/fireworks-tech-graph, ou clonando o repositório em ~/.agents/skills (Codex) ou ~/.claude/skills (Claude Code); um checkout compartilhado com symlinks também é documentado. É necessário Python 3.9+. Os scripts de SVG/PNG precisam de cairosvg (recomendado) ou rsvg-convert; a exportação opcional de GIF precisa de FFmpeg/FFprobe, Chrome/Chromium e puppeteer ou puppeteer-core, com Node.js 22.12+ para o caminho via Puppeteer. O README posiciona o projeto em relação ao Mermaid e ao draw.io, observando que ele aceita entrada em linguagem natural, inclui padrões de domínio AI/Agent, traz estilos integrados, exporta PNG de alta resolução automaticamente e não precisa de ferramenta online. É distribuído sob a licença MIT.