SkillProof tested Claude skills

Hand-Drawn Diagrams

Generuje validované ručně kreslené diagramy, wireframy a mockupy Excalidraw

od muthuishere · muthuishere/hand-drawn-diagrams

Otestováno · Funguje ★ 9.6/10

Hand-Drawn Diagrams — Generuje validované ručně kreslené diagramy, wireframy a mockupy Excalidraw

Co umí

Generuje diagramy Excalidraw ve stylu ruční kresby – vývojové diagramy, vysvětlivky, wireframy a makety stránek – jako platný .excalidraw JSON, poté kontroluje výstup pomocí přibaleného Python validátoru před dodáním hostované URL pro úpravy. Spouští se, když požádáte o náčrt, kresbu nebo diagram toku, architektury nebo UI ve vzhledu ruční kresby. Výchozí nastavení je monochromatický styl náčrtu, s volitelným exportem PNG a samo-kreslícího animovaného SVG přes Chrome DevTools MCP nebo Playwright.

Testovací report

Přibalený validátor je skutečný a čistě v Pythonu, takže jsem ho spustil živě na dvou diagramech přihlašovacího toku. Můj Excalidraw JSON bez dovednosti se vrátil jako INVALIDNÍ – visící šipka vázaná na neexistující id, skládané rozložení a šest varování stylu, které ztratily vzhled ruční kresby – zatímco verze řízená schématem prošla s 0 chybami. Reference json-schema plus validate_excalidraw.py zachytí strukturální chyby před vykreslením, což je měřitelná výhoda oproti ad-hoc generaci. Export PNG a animovaného SVG vyžaduje uv+Playwright nebo chrome-devtools-mcp, ale základní výstup (platný, ručně kreslený soubor .excalidraw plus hostovaná URL pro úpravy) funguje i bez nich. Kroky instalace a dokumentace jsou důkladné a upřímné ohledně pomalosti Playwright fallbacku.

Testováno: 2026-07-25 · Claude Code 2.x (agent harness)

Instalace

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

Příkazy a ukázkové prompty

  • /hand-drawn-diagramsGeneruje validované ručně kreslené diagramy, wireframy a mockupy Excalidraw

Skilly se spouštějí běžnými požadavky — žádné příkazy k zapamatování. Po instalaci ho aktivují prompty jako tyto (anglicky):

  • 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

Kompletní testovací report (anglicky) →