Skillzwave Logo
Skillzwave

design-doc-mermaid

87.0
B

Create Mermaid diagrams (activity, deployment, sequence, architecture) from text descriptions or source code. Use when asked to "create a diagram", "generate mermaid", "document architecture", "code to diagram", "create design doc", or "convert code to diagram". Supports hierarchical on-demand guide loading, Unicode semantic symbols, and Python utilities for diagram extraction and image conversion.

#diagram#design#guide#document#diagrams#diagram guides#Load#Design Document

Third-Party Agent Skill: Review the code before installing. Agent skills execute in your AI assistant's environment and can access your files. Learn more about security

Installation for Agentic Skill

View all platforms →
skilz install SpillwaveSolutions/design-doc-mermaid/design-doc-mermaid
skilz install SpillwaveSolutions/design-doc-mermaid/design-doc-mermaid --agent opencode
skilz install SpillwaveSolutions/design-doc-mermaid/design-doc-mermaid --agent codex
skilz install SpillwaveSolutions/design-doc-mermaid/design-doc-mermaid --agent gemini

First time? Install Skilz: pip install skilz

Works with 22+ AI coding agents

Cursor, Aider, Copilot, Windsurf, Qwen, Kimi, and more...

View All Agents
Download Agent Skill ZIP

Extract and copy to ~/.claude/skills/ then restart Claude Desktop

1. Clone the repository:
git clone https://github.com/SpillwaveSolutions/design-doc-mermaid
2. Copy the agent skill directory:
cp -r design-doc-mermaid ~/.claude/skills/

Need detailed installation help? Check our platform-specific guides:

Related Agentic Skills

article-extractor

by I-Onlabs

Extract clean article content from URLs (blog posts, articles, tutorials) and save as readable text. Use when user wants to download, extract, or save...

70
C
generalreact code

nextjs

by jezweb

| Build Next.js 16 apps with App Router, Server Components/Actions, Cache Components ("use cache"), and async route params. Includes proxy.ts (replace...

54
generalreact code
CommandsMarketplace

cc-trace

by alexfazio

Interactive assistant for intercepting, debugging, analyzing and reviewing Claude Code API requests using mitmproxy. Guides setup, certificate configu...

53
generalreact code

cloudflare-browser-rendering

by jezweb

| Add headless Chrome automation with Puppeteer/Playwright on Cloudflare Workers. Use when: taking screenshots, generating PDFs, web scraping, crawlin...

52
generalreact code
CommandsMarketplace

Agentic Skill Details

Type
Non-Technical
Meta-Domain
general
Primary Domain
general
Sub-Domain
react code
Market Score
87.0

Agent Skill Grade

B
Score: 87/100 Click to see breakdown

Score Breakdown

Spec Compliance
13/15
PDA Architecture
26/30
Ease of Use
23/25
Writing Style
8/10
Utility
18/20
Modifiers: -1

Areas to Improve

  • Multiple complete Mermaid diagram examples embedded in SKILL.md consume tokens on every load
  • Resilient workflow explained twice with overlapping detail; Pattern 6 duplicates resilient workflow section
  • File organization tree duplicates information already conveyed through guide references table

Recommendations

  • Add trigger phrases to description for discoverability
  • Add table of contents for files over 100 lines

Graded: 1/18/2026

Developer Feedback

I took a look at your design-doc-mermaid skill and wanted to share some thoughts.

Links:

The TL;DR

You're at 87/100, solid B territory. This is based on Anthropic's best practices for agent skills. Your strongest area is Ease of Use (23/25) – the trigger phrases, decision tree, and "When to Use What" table are chef's kiss. Weakest is Progressive Disclosure Architecture (26/30) – mainly because you're carrying too much weight in SKILL.md itself.

What's Working Well

  • Trigger phrases are dialed in – "create a diagram", "generate mermaid", "code to diagram" – developers will find this skill easily
  • Hierarchical structure is clean – References are organized by diagram type (deployment, architecture, sequence, activity) with clear paths and no guessing
  • Comprehensive troubleshooting guide – 28 documented errors with fixes shows you thought through real problems developers hit
  • Framework examples pay dividends – Spring Boot, microservices, K8s patterns give people immediate wins without hunting for templates

The Big One

Inline examples are killing your token efficiency. You've got three complete, styled Mermaid diagrams embedded directly in SKILL.md (Infrastructure, Activity Flow, Microservices sections). Every time someone invokes this skill, they're loading those diagrams even if they don't need them.

The fix: Move the detailed styled examples to references/guides/unicode-symbols/guide.md where they belong, and keep just one minimal example in SKILL.md to show the concept. This single change gets you +2 points and makes the skill snappier for real-world use.

Other Things Worth Fixing

  1. Resilient workflow is explained twice – The full workflow appears in both the Resilient Workflow section AND Pattern 6. Pick one location, reference it cleanly. This redundancy adds ~10 lines of noise. +1 point.

  2. File organization tree is redundant – Your guide reference tables already map the structure. The 40+ line directory tree duplicates this info visually. Keep the tree OR the tables, not both. +1 point.

  3. A few second-person constructions – Phrases like "validate your work" and "your specific request" pop up occasionally. Rephrase to imperative: "validate the work", "the specific request". Keeps it crisp. +1 point.

Quick Wins

  • Move 3 inline diagrams → separate reference file (fixes PDA, +2 points)
  • Deduplicate workflow explanation → single source of truth (fixes Writing Style, +1 point)
  • Consolidate structure documentation → either tables or tree, not both (+1 point)
  • Trim second-person language → purely imperative voice (+1 point)

These four changes are low-effort, high-impact. You're looking at 87 → 92, easy A-range territory.


Checkout your skill here: SkillzWave.ai | SpillWave We have an agentic skill installer that installs skills in 14+ coding agent platforms. Check out this guide on how to improve your agentic skills.

AI-Detected Topics

Extracted using NLP analysis

diagram design guide document diagrams diagram guides Load Design Document API Design Unicode Symbols

Report Security Issue

Found a security vulnerability in this agent skill?