# Editor Basics

Source: https://docs.skaz.io/guide/editor-basics

> A tour of the Skaz Studio editor: the canvas, the toolbar, the inspector, selecting and moving blocks, frames, notes and shortcuts.

The Studio editor is a canvas where your story's blocks appear as cards,
connected by lines that represent choices. This page is a tour of the layout
so you know where everything lives before you start building.

## The canvas

The middle of the screen is an infinite canvas:

- **Pan** by dragging an empty area.
- **Zoom** with your scroll wheel or trackpad.
- **Select** a block by clicking it — its details open in the right-hand panel.
- **Move** a block by dragging it. Position is purely visual; it doesn't
  change your story's logic or the order things happen in.

Lines between blocks are the [choices](/guide/choices) connecting them, and
they show which way the story flows.

## Status badge

The top-left corner shows two things:

- A **Live** / **Draft** badge — your story's [publish status](/guide/publishing).
  Click it to open the publish & share panel.
- A **Saved** / **Unsaved changes** indicator, telling you whether your latest
  edits have been saved yet.

## Left toolbar

A floating toolbar on the left edge gives you:

- **Undo** / **Redo** — step back and forth through your edit history (also
  `Ctrl+Z` / `Ctrl+Y`).
- **Save story** — saves immediately.
- **Preview story** (the eye icon) — play-test your story right inside the
  editor, without publishing. See [Previewing](/guide/previewing).
- **Add block** buttons — one per [block type](/guide/blocks). Clicking one
  drops a new block onto the canvas.

> Your story also autosaves as you work, but it's a good habit to hit **Save
> story** before closing the tab — and preview always plays the last *saved*
> version, so save before previewing to see your newest edits.

## Right-hand panel

The panel on the right has four tabs:

- **Node** — the inspector for whichever block you've selected. This is where
  you edit a block's content and its outgoing choices.
- **Story** — story-level settings: title, description, and cover image.
- **Variables** — the list of [variables](/guide/variables) your story can
  read and write, with buttons to create and delete them.
- **AI** — the [AI co-writer](/guide/ai-cowriter) chat (Creator and Pro
  plans). On the Free plan this tab shows an upgrade prompt instead.

### Node inspector

When a block is selected, the **Node** tab shows:

- **Node Properties** — the fields specific to that block type (text, image,
  variable name, and so on) — see [Blocks](/guide/blocks).
- **Branching** — the block's outgoing choices, with an **+ Add choice**
  button to add more — see [Choices & Branching](/guide/choices).
- **Set as start** — makes this block the one players see first. Every story
  needs exactly one starting block.
- **Delete node** — removes the block (and its choices) from the story.

### Story inspector

The **Story** tab lets you edit:

- **Title** — shown on your dashboard, in the publish panel, and to players.
- **Description** — a short summary shown to players before they start.
- **Cover** — an image used as your story's thumbnail and intro art.

> Categories and the 18+ flag aren't here — they're set once when you first
> [create the story](/guide/creating-a-story) and can't be changed afterward.

## The story dashboard

Every story also has its own dashboard, separate from the editor — click into
a story from the Studio home to reach it. It shows your story's structure at a
glance (block, choice, and variable counts) and, for published stories, a live
view of who's playing right now and who's finished. See
[Tracking Plays](/guide/tracking-plays).
