Avodado Studio

Avodado Studio is the visual side of Avodado. There are two ways in.

Try it without installing anything — avodado.dev/studio runs the whole editor in your browser tab. No signup, nothing uploaded, and every template is one click away.

Run it over your own files — one command, and your .md files stay the source of truth:

avo studio                   # --port, --no-open

It opens on a Home page: a searchable grid of your docs, most recent first, plus a New-doc card with templates. Click a doc to open it — the wordmark in the top bar always takes you back Home.

Working in a doc

An open doc shows a sidebar on the left ("‹ Home", your document list with the open doc highlighted, and "+ New doc") and the rendered document on the right. The page you see is the editor — click anything to change it:

• Click to select — a whole block, or a part inside one (a message in a sequence diagram, a node, a table cell). Click the rendered cover to edit the title and subtitle ("✎ Edit cover" appears on hover).
• Enter to edit the selection. Blocks open an edit sheet with a form and a raw YAML tab. Diagram parts open a small inline editor for just that value.
• Arrow keys move the selected part — nodes move between grid cells, list items reorder, table cells navigate. ⌫ deletes, Tab cycles parts, Esc steps back out.
• Drag works too — nodes snap to the grid, lists show a live insertion marker.
• Insert with the + menu or the / command — a searchable gallery of every block with live thumbnails. ? shows all shortcuts.
• Drop a file onto the page: a .csv becomes a ready-filled table or chart block at that spot, and an OpenAPI spec offers to create a whole new doc.

A few direct-manipulation touches worth knowing:

• ERD drag-to-connect. Select an entity, drag the connect dot onto another entity, pick the cardinality (1:1 / 1:N / N:1 / N:M) — the relation is appended to the YAML.
• Annotate sequence steps. Select a message and press n (or click "＋ add note ②") — the note lands as that message's summary, and the rendered doc shows a numbered step list whose numbers match the diagram badges.

Present, publish, export

• ▶ Present (⇧⌘P) turns the current doc into a slide deck on the spot — the same deck avo slides renders. Esc returns to the doc.
• Site ↗ opens the full built site in a new browser tab.
• The Export menu saves the current doc as standalone HTML, a slide deck, a PDF, or a PowerPoint file.
• The Theme button opens the theme panel: pick a base theme, tune eleven colors and three fonts over a live preview, and Install writes a *.theme.json (project or global) and activates it.

The hosted studio

avodado.dev/studio is the same editor with its storage swapped: the parse → validate → render pipeline already runs in the browser, so the only thing the local version needs a server for is your files.

• Nothing is uploaded. Documents live in the tab, and the page has no backend to send them to.
• They do not survive a reload. That is the trade for having no account and no database. Use Share to keep a copy — the link carries the entire document, deflated into the URL fragment, so it never touches a server. Hold ⇧ while clicking Share for a link that opens straight into the deck.
• ?template=<name> opens a prefilled document — avodado.dev/studio?template=adr lands you in a finished ADR. That is what the Templates gallery links to.
• What needs a server is hidden, not broken: PDF and PowerPoint export (they drive a real Chromium), the built site, and live file-change events. Everything the browser can do on its own stays — editing, validation, rendering, presenting, and HTML export.

Durable storage is the next step, and it lands behind the same interface — the editor above it does not change.

Your files stay the source of truth

The studio reads and writes your .md files directly — it doesn't keep its own copy. Every edit rewrites just the block you changed, so diffs stay small and reviewable.

That also means outside changes appear live: ask an AI agent to edit a doc while the studio has it open, and the page updates the moment the file is saved. Human in the studio, agent in the terminal, same files — no sync, no conflicts.