# Editor basics

The slide editor lives at **Agents → [your agent] → Slides**. It's a three-pane workspace: **scene strip** on the left, **canvas** in the middle, **inspector** on the right.

{/* TODO(screenshots): /docs-images/slides/editor-overview.png — full three-pane view with one slide and one element selected */}

## The three panes

1. **Scene strip (left)**

   A vertical list of slide thumbnails. Click a slide to make it active. Drag to reorder. Right-click (or use the toolbar) to duplicate or delete. Keyboard shortcuts: `⌘D` duplicate, `Delete` or `Backspace` to remove the current slide.

2. **Canvas (center)**

   The slide preview at 16:9. Click an element to select it. Shift-click or `⌘`-click to multi-select. Click empty canvas to deselect (the inspector flips to slide-level controls).

3. **Inspector (right)**

   Context-sensitive properties for whatever you have selected. **Nothing selected** → the **Deck inspector** (deck title, theme colors, font, text size, spacing, corners). **Slide selected (no elements)** → the **Slide inspector** (script, AI instructions, avatar dock, speaker notes, per-slide theme override). **Element selected** → the matching **Element inspector** (typography for text, fit + alt for image, etc.). **Multiple elements selected** → the **Multi-select inspector** (layer order, opacity, lock/hide). **Avatar widget selected** → the **Avatar inspector** (position, shape, dock, voice override).

## Top toolbar

{/* TODO(screenshots): /docs-images/slides/top-toolbar.png — close-up of the top toolbar showing element-creation pills + deck actions */}

The top toolbar splits into two halves:

- **Left — element creation**: Text · Shape · Image · Button · Quiz · Embed · Video. Click to insert at the canvas center; for text, the cursor lands ready for typing.
- **Right — deck actions**: Layers (toggle the layer panel) · Test slide (preview this slide with the agent's voice) · Preview deck (open the published `/a/<slug>` URL) · Use template · Save as template · Save status indicator.

## Save behavior

Every change auto-saves. The indicator on the top-right shows **Saving…** during in-flight requests, **Saved** when up to date, or **Error** if the most recent save failed (typically a 409 conflict from concurrent edits — refresh the page to pick up the latest version).

Saves happen in two formats under the hood:

- **Ops** (the default) — incremental patches, lightweight.
- **Full doc** (fallback) — when ops would exceed 5 MB, the editor sends the entire SlideDoc instead.

Both go to `PATCH /api/slide-docs/[id]` with optimistic concurrency control. You don't have to think about it; the editor picks the right format automatically.

## Keyboard shortcuts

| Action | Shortcut |
|---|---|
| Duplicate selected slide | `⌘D` / `Ctrl+D` |
| Delete selected slide | `Delete` / `Backspace` |
| Nudge element | Arrow keys |
| Nudge by 10px | `Shift +` arrow |
| Multi-select | `Shift` + click, or `⌘` + click |
| Deselect all | `Esc` |

## Read next

- [Creating slides](/docs/build/slides/creating-slides) — add, duplicate, reorder
- [Elements](/docs/build/slides/elements/overview) — the 7 element types
- [Theming](/docs/build/slides/theming) — deck colors and per-slide overrides
