Skip to content
Docs
flero.ai

Editor overview

The workflow editor is where you spend most of your time. It's a single screen split into four regions and a floating assistant.

๐Ÿ“ธ Screenshot needed: editor__layout-annotated.png, full editor view with the four regions labelled (palette / canvas / inspector / toolbar) plus the bottom execution chrome and the AI chat bubble.


The four regions

โ”Œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”
โ”‚              TOOLBAR  (save ยท run ยท undo ยท history ยท settings)โ”‚
โ”œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ฌโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ค
โ”‚          โ”‚                                        โ”‚           โ”‚
โ”‚  NODE    โ”‚              CANVAS                    โ”‚ INSPECTOR โ”‚
โ”‚  PALETTE โ”‚       (infinite, pan + zoom)           โ”‚ (config   โ”‚
โ”‚ (search, โ”‚                                        โ”‚  of the   โ”‚
โ”‚  cats)   โ”‚                                        โ”‚  selected โ”‚
โ”‚          โ”‚                                        โ”‚  node)    โ”‚
โ”‚          โ”‚                                        โ”‚           โ”‚
โ”œโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ดโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ดโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”ค
โ”‚   EXECUTION CHROME  (status ยท last runs ยท run / stop)         โ”‚
โ””โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”˜
                                                   โ•ญโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ•ฎ
                                                   โ”‚  AI chat โ”‚
                                                   โ•ฐโ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ”€โ•ฏ

Toolbar (top)

Left side:

  • Workflow name (click to rename inline).
  • Status badge (draft / active / inactive). Click to change.
  • Tags chip, open the tag picker.

Right side:

  • Undo / Redo (โŒ˜Z / โŒ˜โ‡งZ).
  • Version history dropdown, restore prior versions.
  • Save (โŒ˜S).
  • Run, execute the workflow now.
  • Settings โš™, open the workflow-settings drawer (timeout, concurrency, error policy, schedule).

Node palette (left)

Searchable, scrollable, categorised list of every node type available in your workspace. Expand a category, drag a node onto the canvas. See Adding and connecting nodes.

Bottom of palette has two extra sections:

  • User workflows, your own workflows surfaced as sub-workflow nodes.
  • System templates, quick-start template stubs.

Canvas (centre)

Infinite drawing surface for placing nodes and drawing connections. Supports pan, zoom, fit-to-screen, and a minimap. See Canvas controls.

Inspector (right)

Shows the configuration for the currently selected node. The inspector header displays the node's icon, display name (click to rename), and type. The body has the configuration form, which varies per node type.

You can pin the inspector for a node by clicking the pin icon, the panel stays open even when you select a different node, and a new inspector for the new selection stacks below it. Useful when configuring two nodes that share data.

Execution chrome (bottom)

A thin status bar:

  • Left: current execution state (Idle, Runningโ€ฆ, Completed, Failed, Waiting for approval) and duration.
  • Middle: a dropdown of the five most recent executions; click to load one.
  • Right: Run / Stop controls, plus a Sandbox toggle (see Sandbox mode).

AI chat (floating, bottom-right)

The AI builder assistant. Ask for nodes, connections, or whole-workflow suggestions in plain language. See AI builder.


Selection and the active node

Click a node to select it; the inspector switches to show its configuration. Click empty canvas to deselect.

Multi-select with โŒ˜-click (Mac) / Ctrl-click (Windows/Linux), or by rubber-band drag on empty canvas. With multiple nodes selected, you can drag them all together; the inspector goes blank.


Saving

The toolbar Save button (โŒ˜S / Ctrl+S) writes a new version. The status badge briefly flashes "Savingโ€ฆ" then "Saved". If validation fails (a node is missing a required field), Save is blocked and the offending node gets a red border, hover for the error chip.

Autosave is off by default, you control when versions are created. Workflow settings has a toggle if you want autosave on.


Quick orientation

You want toโ€ฆ Where
Add a node Adding and connecting nodes โ†’
Fill in a node's fields Configuring nodes โ†’
Test one node in isolation Testing a node โ†’
Run the whole workflow Running a workflow โ†’
Navigate a big canvas Canvas controls โ†’
Speed up with keys Keyboard shortcuts โ†’
Build with AI help AI builder โ†’
Edit with a teammate live Collaboration โ†’

Found something out of date? This page lives in the Flero docs content set.