Canvas Overview - Builder Studio Docs

The canvas is the infinite, pannable workspace where you build in Builder Studio. Everything you create lives here as a node — an image, a block of text, a prompt, an AI generation step — positioned freely on a 2D plane. You connect nodes with edges to pass data between them, and the whole workspace zooms and pans like a design tool rather than scrolling like a document.

One canvas, many node types

A canvas is not tied to a single medium. The same surface holds media you upload, primitives you draw, and AI nodes that generate new images, video, audio, and text. The connections between them are what turn a pile of nodes into a workflow.

The interaction model

The canvas behaves like a spatial editor. You move the camera over a fixed world of nodes; the nodes themselves keep stable world coordinates unless you move them. The core gestures are:

Pan to move the camera across the workspace, and zoom to scale it in and out. See Viewport for the exact controls and shortcuts.
Select a node by clicking it, or drag a marquee across empty canvas to select several at once. Selection drives the contextual tools described in Panels.
Move and resize selected nodes by dragging the node body or its resize handle.
Connectnodes by dragging from one node's output port to another node's input port, creating an edge.

What lives on the canvas

Nodes are the unit of work — media, primitives, and AI steps. They carry their own data and sizing. See Nodes.
Edges are typed connections from an output port to an input port. They define how data flows when a workflow runs. See Edges.
The camera (pan and zoom state) is yours — it is not part of the shared document, so where you are looking does not move other collaborators.

Persistence and live editing

Node and edge changes are committed to durable canvas storage as you work, so a canvas survives reloads and is shared across everyone with access to its workspace. Position, size, type, and per-node data are all stored on the node record; connections are stored as separate edge records keyed by source and target ports.

When more than one person opens the same canvas, you see each other's live cursors and presence, and nodes move and resize live as someone drags them. Read Multiplayer for what is and is not live during a shared session.

Where to go next

Start with Nodes to understand the unit of work, then Edges for how data moves between them. Panels covers the toolbar and side surfaces, and Viewport covers navigating the space.

Was this page helpful?