Flow Builder

The Flow Builder is the visual editor where you design your bot's conversation logic. It provides a drag-and-drop canvas where you place nodes, connect them with edges, and configure each step of the conversation.

Interface Overview

The Flow Builder interface has four main areas:

Area	Location	Purpose
Canvas	Center	The main workspace where you build flows
Nodes Panel	Left sidebar	Lists all available node types, grouped by category
Config Panel	Right sidebar	Shows configuration options for the selected node
Toolbar	Top bar	Save, undo/redo, zoom, test, and deploy actions

imageAnnotated flow builder interface with labeled arrows pointing to the four main areas: Canvas (center), Nodes Panel (left sidebar), Config Panel (right sidebar), and Toolbar (top bar)

The four main areas of the flow builder interface

Canvas

The canvas is an infinite, pannable workspace built on Vue Flow. You can zoom in and out, pan across the canvas, and arrange nodes freely. Connections between nodes are drawn as curved edges.

Learn more: Canvas & Navigation

Working with Nodes

Nodes are the building blocks of a flow. Each node performs a specific action -- sending a message, calling an LLM, checking a condition, or executing an API call. You add nodes by dragging them from the Nodes Panel onto the canvas.

Learn more: Working with Nodes

Connections

Edges connect nodes together to define the order of execution. Some nodes have multiple output handles for branching logic (e.g., a Condition node has "true" and "false" outputs).

Learn more: Connections & Routing

Templates

Speed up development by starting with a pre-built flow template. You can also save your own flows as templates for reuse across bots.

Learn more: Templates

Testing

Test your flows directly in the builder using the built-in conversation simulator. Step through execution, inspect variables, and debug issues without deploying.

Learn more: Testing Flows

Keyboard Shortcuts

Shortcut	Action
Ctrl+S	Save flow
Ctrl+Z	Undo
Ctrl+Shift+Z	Redo
Ctrl+T	Open test panel
N	Toggle nodes panel
Delete	Delete selected node or edge
Ctrl+A	Select all nodes
Ctrl+D	Duplicate selected node
Ctrl+F	Search nodes
Space + drag	Pan canvas
Scroll	Zoom in/out

TIP

Right-click on the canvas to open a context menu with quick access to node creation, paste, and alignment options.