Sketchy – interaktivní diagramy pro AI asistenty

Vytvořeno: 3.11.2026 | Aktualizováno: 03.11.2026 21:34

Sketchy je open-source nástroj, který pomáhá AI asistentovi vytvářet interaktivní diagramy, nákresy elektronických zapojení a vizuální vysvětlení. Nabízí skill pro chat a samostatný MCP server pro coding prostředí. Hodí se například pro vysvětlení struktury repozitáře nebo pro nákres zapojení podle Arduino sketche.

Sketchy není samotný AI asistent. Rozdělení práce vypadá takto:

1. AI asistent přečte zadání a dostupné soubory. Určí, jaké prvky, propojení a popisky mají být na obrázku.
2. Sketchy dostane popis scény. Automaticky rozmístí její prvky, vede spojnice a obrázek vykreslí.
3. Uživatel ověří, že výsledný diagram odpovídá projektu nebo skutečnému zapojení.

Asistent popisuje obsah diagramu, nikoli přesné souřadnice prvků. Sketchy se stará o rozložení a jednotný vzhled. Při následných úpravách může zachovat identifikátory prvků a jejich předchozí umístění, aby šly verze snadněji porovnat.

V podporovaném prostředí lze nad prvky zobrazit podrobnosti, projít vysvětlení po krocích a výsledek exportovat do SVG nebo PNG. Některé možnosti závisí na použitém klientovi a způsobu instalace.

Sketchy nabízí dva způsoby použití. Není nutné instalovat oba současně.

Instrukce skillu používají v běžném chatu vloženou vizualizaci, která načte vykreslovací JavaScript. Popisují také náhradní postup pro vytvoření samostatné HTML stránky pomocí přiloženého skriptu a Node.js. Skill tedy není jen instrukce: používá i kreslicí kód Sketchy.

MCP server je naproti tomu běžící program, který asistentovi nabízí nástroje. Pro interaktivní zobrazení v jiném MCP klientovi je potřeba podpora MCP Apps; samotná podpora MCP nemusí stačit.

Sketchy umí zobrazit desku, součástky a propojení pinů. Asistent může vycházet ze souboru .ino a hledat například použití pinMode nebo digitalWrite. Grafické podoby součástek a jejich piny pocházejí z knihovny Wokwi Elements. Podle dokumentace Sketchy nabízí 50 typů desek, senzorů, displejů a dalších prvků.

Praktický postup pro existující projekt:

1. Zpřístupni asistentovi .ino soubor a případné další soubory s definicemi pinů.
2. Přidej dokumentaci projektu nebo vlastní seznam součástek a jejich zapojení.
3. Nech asistenta vytvořit diagram a vypsat údaje, které ze souborů nedokáže zjistit.
4. Výsledek porovnej se skutečným zařízením a dokumentací použitých modulů.

Příklad zadání:

Prozkoumej tento projekt a pomocí Sketchy nakresli zapojení
mikrokontroléru a připojených součástek.

U každého vodiče uveď označení pinu. Rozliš informace, které jsou
přímo uvedené v kódu nebo dokumentaci, od toho, co ze souborů
nelze zjistit. Nevymýšlej napájení ani hodnoty součástek.
Nejasnosti vypiš pod obrázek.

Omezení: Kód nemusí popisovat celé fyzické zapojení. Použitý pin sám o sobě nedokládá napájecí napětí, hodnotu rezistoru ani přítomnost dalších součástek. Sketchy není důkaz elektrické správnosti a nenahrazuje kontrolu parametrů desky a modulů. Nákres také není simulací obvodu ani návrhem desky plošných spojů.

Asistent může podle souborů repozitáře nakreslit moduly, adresáře a vztahy mezi nimi. V podporovaném prostředí lze kliknutím na blok otevřít odpovídající soubor v editoru. To pomáhá při seznamování s projektem nebo při návratu ke staršímu kódu.

Projdi tento repozitář a nakresli jeho hlavní části. U každé uveď,
za co odpovídá, a zobraz hlavní tok dat. Nevymýšlej vazby,
které nedokážeš doložit v kódu.

Sketchy lze použít pro vizualizaci služeb, sítí a toku požadavků. Například může zobrazit cestu od prohlížeče přes reverzní proxy k aplikaci a databázi. Jako podklad mohou sloužit konfigurační soubory nebo vlastní dokumentace.

Podle těchto Docker Compose souborů nakresli služby, jejich propojení
 a vystavené porty. Odliš vazby doložené konfigurací od nejasností.

Diagram vychází z dostupných podkladů. Nemusí zachytit skutečný stav běžící sítě, pravidla firewallu ani ruční změny mimo poskytnuté soubory.

Diagram může vysvětlit tok události od senzoru přes MQTT nebo Home Assistant k výsledné akci. Postupné zvýrazňování kroků se hodí pro pochopení spouštěče, podmínek a následných akcí.

Projdi tuto automatizaci Home Assistantu. Nakresli spouštěč,
podmínky a akce. Potom krok za krokem vysvětli, co se stane
při detekci pohybu.

Sketchy podporuje diagramy struktury, toků a srovnání. Hodí se například pro cestu webového požadavku, vysvětlení cache nebo porovnání TCP a UDP. U složitějšího procesu může asistent připravit posloupnost kroků a postupně zvýrazňovat příslušné prvky.

Pro jiný přístup k tvorbě technických diagramů existuje také Diagram Design, skill zaměřený na tvorbu diagramů jako HTML a SVG.

Sketchy může použít fotografii z volně licencovaných zdrojů a označit na ní části nebo tištěný text. Dokumentace uvádí například označení konektorů na fotografii Raspberry Pi nebo částí desky Arduino. Původ a licence fotografie se zobrazují u obrázku.

Popisování fotografie je jiná úloha než nákres zapojení: model hledá, kde se položka nachází na fotografii. Pro tento účel Sketchy používá samostatný lokální obrazový model.

Varianty Small, Medium a Large označují obrazové modely založené na Florence-2, které hledají součástky a text na fotografii. Nejde o velikosti AI asistenta ani o modely potřebné pro běžné diagramy a nákresy zapojení. Model se stahuje odděleně při prvním použití této funkce.

Podle definice modelů ve zdrojovém kódu používá Small menší variantu modelu ve formátu q8. Medium a Large používají větší variantu; Medium ve formátu q8 a Large v plné přesnosti fp32. Údaje o velikosti jsou orientační; zdrojový kód uvádí měření na macOS s ARM procesorem.

Pro první pokus s fotografiemi doporučuje autor Small. Zdrojový kód zároveň uvádí, že v desktopové aplikaci Claude nejsou Medium a Large kvůli omezení běhového prostředí dostupné; pro větší modely odkazuje na Claude Code v terminálu.

1. Stáhni sketchy-skill-<version>.zip ze stránky posledního vydání.
2. V Claude otevři Settings → Capabilities → Skills a nahraj ZIP.
3. V chatu požádej o diagram nebo nahraj soubor s projektem a popiš, co má obrázek zobrazovat.

Běžná varianta skillu načítá vykreslovací balíček z jsDelivr a podle autora průběžně získává opravy v rámci dané minor verze. Varianta pinned odkazuje na konkrétní commit a kontroluje integritu načteného souboru; pro aktualizaci je potřeba nahrát nový ZIP.

Pro záložku Code autor nabízí balíček .mcpb na stránce vydání. Po otevření balíčku nebo jeho přidání přes Settings → Extensions lze rozšíření potvrdit a případně nastavit editor a datový adresář.

Podle dokumentace záložka Chat nezobrazuje interaktivní výstupy z lokálních rozšíření. Pro běžný chat se proto používá skill. Dostupnost instalačních balíčků je potřeba ověřit pro konkrétní operační systém a architekturu.

Pro sestavení projektu je podle autora potřeba Node.js 20 nebo novější. Následující postup zaregistruje server pro uživatele, tedy pro použití ve více projektech:

git clone https://github.com/ddkbs/sketchy.git
cd sketchy
npm install
npm run build
claude mcp add sketchy --scope user -- node "$PWD/dist/index.js"
claude mcp list

Adresář s repozitářem musí zůstat na místě, protože registrace odkazuje na sestavený soubor dist/index.js. Před připojením cizího MCP serveru je vhodné zkontrolovat jeho kód a oprávnění: běží jako lokální program pod účtem uživatele.

Autor uvádí konfiguraci pro klienta s podporou MCP Apps. Cestu je potřeba nahradit skutečným umístěním sestaveného serveru:

{
  "mcpServers": {
    "sketchy": {
      "command": "node",
      "args": ["/path/to/sketchy/dist/index.js"],
      "env": { "SKETCHY_EDITOR": "cursor" }
    }
  }
}

Samotné připojení serveru ještě neověřuje, že klient umí jeho interaktivní výstup zobrazit. Instalace ani zobrazení v konkrétním prostředí Alpine Linux / ARM64 zde nebyly prakticky ověřeny.

Přesný způsob nastavení proměnných závisí na použitém MCP klientovi. Lokální zpracování fotografie modelem samo o sobě neznamená, že celý workflow asistenta nebo vyhledání fotografie probíhá bez síťové komunikace.

• Sketchy – repozitář a dokumentace
• Sketchy – instrukce skillu
• Sketchy – definice obrazových modelů
• Sketchy – poslední vydání
• Wokwi Elements – knihovna elektronických součástek
• Florence-2 – obrazový model
• MCP Apps – interaktivní aplikace pro MCP
• jsDelivr – distribuce vykreslovacího balíčku