otto-canvaslisted

Use when drawing/generating a diagram for the Otto Canvas, creating or editing canvas scenes, or driving Discovery Chat on a Product story, from an agent session over HTTP. Covers the FILE-BACKED canvas model with THREE modes — Mermaid (edit a per-scene `canvas.mermaid`; any diagram type), Excalidraw (edit a per-scene `canvas.json`; fully editable shapes), and D2 (edit a per-scene `canvas.d2`; modern declarative diagrams — architecture, sequence, SQL tables) — top-notch pretty-Mermaid styling, the D2 shape/class syntax, the Excalidraw simplified element format, the OTTO_API_TOKEN auth model, the Canvas + Discovery-Chat endpoints, and the canvas.mjs helper.
itzikiusa/otto_os · ★ 0 · API & Backend · score 67

Install: claude install-skill itzikiusa/otto_os

# Otto Canvas (Mermaid + Excalidraw + D2 modes) + Discovery Chat over HTTP Otto's **Canvas** is **file-backed** with THREE modes the user picks per scene; the agent edits the scene's file and the board re-renders (manual edits write back to the same file too): - **Mermaid mode** — the agent edits a per-scene **`canvas.mermaid`**. The UI renders it with Mermaid's own renderer, so ANY diagram type works (flowchart, sequence, class/UML, ER, state). Best for rich auto-laid-out diagrams. - **Excalidraw mode** — the agent edits a per-scene **`canvas.json`** (an Excalidraw scene). The UI loads it in the real Excalidraw editor, so the user can also draw / move / restyle shapes by hand. Best for freeform, hand-editable boards. - **D2 mode** — the agent edits a per-scene **`canvas.d2`**. The UI renders it with D2's own layout engine (client-side WASM), with an optional hand-drawn "sketch" render mode. Best for architecture diagrams, SQL schemas (`shape: sql_table`), and anything that benefits from containers/nesting. The scene's `doc_json` stores `{ "type":"otto-canvas", "version":1, "format":"mermaid"|"excalidraw"|"d2", "source":"…", "sketch"?:bool }` (`source` is the file's text; `sketch` only applies to D2). The agent refines the SAME file across the conversation, so follow-ups *change* the diagram instead of regenerating it, and the work is never lost. **Discovery Chat** is a conversational product-discovery agent on a story that can *propose* a canvas you then app