Passage Builder

Getting around

Drag any empty part of the canvas to move it, or scroll. Zoom with the − and + buttons, or hold Ctrl / ⌘ while scrolling. Fit frames the whole story on screen.

The cards

Each card is one passage: its id at the top, a small ▶ you can click to preview its video, and a snippet of its text. The green rocket marks the entry passage — the one whose id is start.

Preview a video

For any passage that has a video, click the ▶ on its card — or the ▶ Preview button beside the video id when editing — to play it in a popup. It’s shown almost exactly as it will appear in the finished story: filling the frame with the player’s controls hidden, so you can confirm you’ve attached the right clip and that it actually plays. You may spot faint YouTube player remnants near the edges that the published story trims away more fully — that’s expected, the preview just isn’t cropped quite as tightly. Close it anytime with the button, Esc, or by clicking outside — you don’t have to watch the whole thing.

Add a passage

Click + New. A fresh passage appears in the middle of the view, selected and ready to edit. (You can also add passages from the Passages list.)

Move passages

Drag a card anywhere. Its position is remembered and saved with your project, so the layout you arrange is the layout you get back.

Link passages

Drag the small dot on a card’s right edge onto another card. That adds a choice leading there, drawn as an arrow.

Unlink

Hover over a connecting line and click the ✕ that appears at its middle to remove that choice.

Edit a passage

Double-click a card, or select it and click Edit. A dialog opens right over the map with every field — passage id, YouTube video id, heading, narrative text, and choices. Close it with Done, Esc, or by clicking outside it.

Delete a passage

Select a card and click Delete, or press the Delete key. You’ll be asked to confirm.

Broken links

A red dashed line means a choice points to a passage that doesn’t exist (often after a rename or delete). Open the passage and fix or remove that choice.

Saving & exporting

Load, Save, and Generate & Download stay at the bottom while you’re on the map. Save keeps your layout; Generate & Download builds and downloads the playable story-title.html, which you can then open from your web host to test.

Good to know

To link, the target card must already exist — make it first, then connect to it. New links start without a label, which you add in the editor. And a passage becomes the beginning by being given the id start.