Visual Explainer

Visão geral

Visual Explainer transforma informações técnicas em páginas HTML prontas para publicação. Seja para explicar a arquitetura de sistemas, alterações no código, métricas ou planos de projeto, ele gera recursos visuais com navegação por teclado, estados de foco e suporte automático ao modo escuro, sem exigir dependências externas.

Destaques

• Renderiza fluxogramas Mermaid, diagramas de sequência, esquemas ER, modelos C4 e máquinas de estados com controles de zoom e movimentação
• Produz HTML totalmente autocontido com marcação semântica
• Garante acessibilidade por teclado, indicadores de foco e suporte à redução de movimento
• Oferece apresentações e layouts comparativos para exposições e revisões
• Inclui um modo Quick opcional para especificações JSON leves, com validação separada

Para quem é indicado

Use esta habilidade sempre que o conteúdo técnico for essencialmente visual e a arte ASCII não for suficiente. Ela esclarece revisões de arquitetura, explica diferenças de código, resume dados e organiza planos estratégicos, transformando a complexidade em recursos visuais acessíveis que as partes interessadas podem compreender rapidamente.