Canvas

The canvas is the centre of the flow builder. It shows the Begin tag, every node as a card, the transitions between them, and sticky notes. A badge in the top left shows the node count and the start node, for example "6 nodes · start: Greeting".

Add nodes#

The Node tab in the left column lists every node type. Either:

• click a type to add it in the middle of the visible canvas, or
• drag a type onto the canvas to drop it where you want.

The new node is selected and its settings open in the right column. If the flow has no start node, the new node becomes the start. An empty flow shows "Your flow is empty. Add a Conversation node from the left to begin."

Node cards#

Each card has a coloured header with the node type icon and name. Cards that speak show a Prompt / Static Sentence switch and the instruction text. Select the card to edit the instruction in place.

The Transition section lists every outgoing edge with its condition and its destination ("→ Collect details"). On a selected card:

• Click a prompt transition to edit its text inline; Enter saves, Escape cancels.
• Click an equation transition to open it in Node settings.
• The + (Add transition) menu offers Prompt, Equation, Else and Always/Skip, where the node type allows them.
• Hover a transition and click the cross to delete it. Failure edges and a logic split's Else cannot be deleted.

Global nodes have a dashed border and a Global badge.

Connect nodes#

Each transition has its own handle on the right edge of the card. Drag from the handle to another node to connect it. Drag from the Begin tag to a node to make it the start node.

Click a node or a line to highlight its transitions. Highlighted lines show two buttons: Go to the next node (centres the canvas on the destination) and Remove this connection (disconnects the transition but keeps it on the card).

Canvas toolbar#

The floating toolbar at the bottom of the canvas:

Organize#

Organize runs an automatic left-to-right layout of the Begin tag and all nodes, following the transitions,, then fits the view. When a flow opens and its node cards overlap (for example a flow created through the API without positions), the builder organizes it once automatically.

Find node#

Find node (Cmd+F) opens a search box that matches node names, node types and instruction text. Use the arrow keys and Enter to jump to a node, Escape to close.

Notes#

Click Note at the bottom of the node list to add a sticky note. Notes are for your team and do not affect the call. Hover a note to pick one of four colours or delete it. Notes are saved in the flow's notes[] with their text, position, colour and size.

Undo and redo#

Undo covers changes to nodes, the start node and notes, up to 100 steps. Changes made within 0.6 seconds of each other count as one step.

Copy, paste and duplicate#

• Copy node (Cmd+C) copies the selected node, and the flow function it uses, to the browser's local storage.
• Paste (Cmd+V) pastes it into this flow or any other flow in the same browser. Pasted nodes get new ids and are offset on the canvas; a name that already exists gets " (copy)". Transitions between pasted nodes are kept; transitions to nodes outside the pasted set are disconnected. Functions are added if the target flow does not have them.
• Duplicate in the node's settings header copies the node in place, 40 px down and right, with "(copy)" in the name.

Delete#

Select a node or note and press Delete, or use the bin in the node's settings header. Transitions pointing at a deleted node are disconnected. Deleting the start node makes another node the start.

Keyboard shortcuts#

Undo, redo, copy and paste shortcuts are ignored while you type in a text field.

Saving#

The builder saves changes automatically shortly after each edit. Saving errors show a "Couldn't save flow" message. Publish in the header publishes the agent.

Related#