SkillProof tested Claude skills

Hand-Drawn Diagrams

Generer validerede håndtegnede Excalidraw-diagrammer, wireframes og mockups

Af muthuishere · muthuishere/hand-drawn-diagrams

Testet · Virker ★ 9.6/10

Hand-Drawn Diagrams — Generer validerede håndtegnede Excalidraw-diagrammer, wireframes og mockups

Hvad det gør

Genererer Excalidraw-diagrammer i håndtegnet stil – flowcharts, forklaringer, wireframes og side-mockups – som gyldig .excalidraw JSON, og kontrollerer derefter outputtet med en medfølgende Python-validator, før en hostet redigerings-URL leveres. Udløses, når du beder om at skitsere, tegne eller diagrammere et flow, en arkitektur eller en UI i et håndtegnet look. Standardindstillingen er monokrom skitse-styling, med valgfri PNG og selvtegnende animeret SVG-eksport via Chrome DevTools MCP eller Playwright.

Testrapport

Den medfølgende validator er ægte og ren Python, så jeg kørte den live på to signup-flow-diagrammer. Min Excalidraw JSON uden skill returnerede INVALID – en dinglende pil, der bandt til et ikke-eksisterende id, et stablet layout og seks stiladvarsler, der havde fjernet det håndtegnede look – mens den skemaguidede version bestod med 0 fejl. json-schema-referencen plus validate_excalidraw.py fanger strukturelle brud før rendering, en målbar fordel i forhold til ad-hoc generering. PNG og animeret SVG-eksport kræver uv+Playwright eller chrome-devtools-mcp, men det primære leverede (en gyldig, håndtegnet .excalidraw-fil plus hostet redigerings-URL) fungerer uden dem. Installationsvejledninger og dokumentation er grundige og ærlige omkring Playwright-fallback'ens langsomhed.

Testet: 2026-07-25 · Claude Code 2.x (agent harness)

Installation

git clone https://github.com/muthuishere/hand-drawn-diagrams
mkdir -p ~/.claude/skills
cd hand-drawn-diagrams && cp -r . ~/.claude/skills/hand-drawn-diagrams

Kommandoer og eksempelprompter

  • /hand-drawn-diagramsGenerer validerede håndtegnede Excalidraw-diagrammer, wireframes og mockups

Skills udløses af almindelige forespørgsler — ingen kommandoer at huske. Efter installationen aktiverer prompter som disse skillen (på engelsk):

  • Sketch a hand-drawn flowchart of our signup flow in Excalidraw
  • Draw a wireframe mockup for the onboarding screen, sketch style
  • Make a hand-drawn architecture diagram for this system

Læs hele rapporten →