Interactive Architecture Diagrams
Vytváří interaktivní, animovaný jednosouborový HTML diagram architektury plus doprovodný .md.
Otestováno · Funguje
Co umí
Generuje soběstačný interaktivní HTML diagram — záložky toků, animované SVG datové pakety, postranní panel s platbami pro každý krok, přepínače režimů (dev/prod, offline/online), uzly drag-and-drop, tmavý/světlý motiv — plus doprovodný architecture.md, z popisu systému služeb a toků v prostém jazyce. Spouští se na požadavky na vizualizaci mapy služeb, toku RAG/agentního, pipeline CI/CD nebo topologie mikroslužeb pro workshop nebo revizi návrhu; výslovně se vyhýbá statickým diagramům Mermaid, snímkům nebo PDF.
Testovací report
Vytvořil jsem skutečný 3uzlový diagram přihlášení OAuth2 z dodané šablony a lokálně jej obsloužil: navigace kroků, postranní panel s platbami a přepínač režimu dev/prod fungovaly živě v prohlížeči bez chyb v konzoli — skutečně schopnější než cokoli, co bych vytvořil neřízeně. Dokumentace si odebrala body: příkaz 'Claude Code — manual clone' v README klonuje kořen repozitáře přímo do složky skills, což pohřbí SKILL.md dvě složky příliš hluboko a při doslovném dodržení by tiše rozbil instalaci.
Testováno: 2026-07-14 · Claude Code 2.x (agent harness)
Instalace
git clone https://github.com/konraddzbik/architecture-diagram-skill cd architecture-diagram-skill mkdir -p ~/.claude/skills cp -r skills/architecture-diagram ~/.claude/skills/architecture-diagram
Příkazy a ukázkové prompty
/architecture-diagramVytváří interaktivní, animovaný jednosouborový HTML diagram architektury plus doprovodný .md.
Skilly se spouštějí běžnými požadavky — žádné příkazy k zapamatování. Po instalaci ho aktivují prompty jako tyto (anglicky):
Build a clickable diagram showing browser to auth gateway flowMake an animated architecture diagram for our OAuth loginCreate a step-through HTML diagram of our system's request path