CommunityBildgithub.com

spillwavesolutions/design-doc-mermaid

Erstelle Mermaid-Diagramme (Aktivität, Deployment, Sequenz, Architektur) aus Textbeschreibungen oder Quellcode. Verwende es, wenn du gebeten wirst „ein Diagramm zu erstellen“, „Mermaid zu generieren“, „Architektur zu dokumentieren“, „Code in Diagramm umzuwandeln“, „ein Designdokument zu erstellen“ oder „Code in Diagramm zu konvertieren“. Es unterstützt hierarchisches bedarfsorientiertes Laden von Anleitungen, Unicode-Semantiksymbole und Python-Dienstprogramme zur Diagrammextraktion und Bildkonvertierung.

Was ist design-doc-mermaid?

Diese Skill, `spillwavesolutions/design-doc-mermaid`, befähigt KI-Agenten wie Claude Code, Cursor oder Codex, automatisch technische Diagramme im Mermaid-Format aus Textbeschreibungen oder direkt aus Quellcode zu generieren. Es deckt gängige Diagrammtypen wie Aktivitätsdiagramme, Deployment-Diagramme, Sequenzdiagramme und Architekturdiagramme ab. Der Hauptnutzen liegt darin, dass Entwickler schnell visuelle Darstellungen von Systemabläufen, Code-Strukturen oder Architekturentscheidungen erstellen können, ohne manuell Diagrammwerkzeuge bedienen zu müssen. Die Skill unterstützt ein hierarchisches System zum bedarfsgerechten Laden von Anleitungen, sodass spezifische Diagrammtypen oder Notationen nachgeladen werden können. Außerdem werden Unicode-Semantiksymbole für eine klarere Darstellung genutzt. Integrierte Python-Dienstprogramme ermöglichen die Extraktion von Mermaid-Code aus Dateien und die Konvertierung in Bildformate wie PNG oder SVG. Dies macht die Skill besonders nützlich für die Dokumentation von Systemarchitekturen und die schnelle Erstellung von Designdokumenten auf verschiedenen Entwicklungsplattformen.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/spillwavesolutions/design-doc-mermaid/tree/main/skills/design-doc-mermaid

Installed? Explore more Bild skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

Was macht design-doc-mermaid?

Erstelle Mermaid-Diagramme (Aktivität, Deployment, Sequenz, Architektur) aus Textbeschreibungen oder Quellcode. Verwende es, wenn du gebeten wirst „ein Diagramm zu erstellen“, „Mermaid zu generieren“, „Architektur zu dokumentieren“, „Code in Diagramm umzuwandeln“, „ein Designdokument zu erstellen“ oder „Code in Diagramm zu konvertieren“. Es unterstützt hierarchisches bedarfsorientiertes Laden von Anleitungen, Unicode-Semantiksymbole und Python-Dienstprogramme zur Diagrammextraktion und Bildkonvertierung.

Verwandte Skills