Workflow Builder
The visual canvas for designing workflows — from laying out nodes on the canvas to configuring every field correctly.
Time to complete (configuration walkthrough): 15 minutes
Interface
Canvas
- Infinite scrolling workspace
- Zoom in/out controls
- Mini-map navigation
- Grid snap for alignment
Node Palette
Drag nodes from categories:
- Triggers: Start nodes
- CRM Actions: Update contacts, deals, etc.
- Channel: Email, SMS, WhatsApp
- AI: LLM, knowledge search, agents
- Logic: Conditions, loops, delays
- Data: Transform, filter, aggregate
- Integration: HTTP, webhooks, APIs
Properties Panel
Configure the selected node:
- Input mappings
- Settings
- Output preview
Node Categories
CRM Actions
- Create/Update/Delete Contact
- Create/Update/Delete Deal
- Create Task
- Add Note
- Update Custom Field
Channel
- Send Email
- Send SMS
- Send WhatsApp
- Make Voice Call
AI Nodes
- LLM (GPT, Claude, etc.)
- Knowledge Base Search
- Embedding Generator
- AI Agent
Logic
- If/Else Condition
- Switch (multiple branches)
- Loop (iterate array)
- Delay (wait time)
- Human Input (pause for input)
Data
- Set Variable
- Transform Data
- Filter Array
- Aggregate
Integration
- HTTP Request
- Webhook Response
- Database Query
Connections
Creating
- Click output port (right side)
- Drag to input port (left side)
- Release to connect
Data Flow
- Data passes through connections
- Reference with
{{node_id.field}} - Auto-complete suggestions
Configuring Nodes
Every node needs configuration to know what to do. This section walks you through the configuration process, from opening the settings panel to filling in all the fields correctly.
The Configuration Panel
When you click on a node, the configuration panel opens on the right side of the screen.
Panel Structure
┌─────────────────────────────────────┐
│ 📧 Email Send ✕ │ ← Header with node name
├─────────────────────────────────────┤
│ Basic | Configuration | Advanced │ ← Tabs
├─────────────────────────────────────┤
│ │
│ Alias: emailsend_1 │
│ ───────────────────── │
│ │
│ To * │
│ ┌─────────────────────────────┐ │
│ │ {{contact.email}} {x}│ │ ← Field with variable picker
│ └─────────────────────────────┘ │
│ │
│ Subject * │
│ ┌─────────────────────────────┐ │
│ │ Welcome to our platform │ │
│ └─────────────────────────────┘ │
│ │
│ Body │
│ ┌─────────────────────────────┐ │
│ │ Hello {{contact.name}}, │ │
│ │ │ │
│ │ Welcome! │ │
│ └─────────────────────────────┘ │
│ │
└─────────────────────────────────────┘
Configuration Tabs
Basic Tab
General node settings:
| Field | Description |
|---|---|
| Alias | Unique identifier for the node |
| Description | Optional notes about this node |
| Enabled | Toggle to enable/disable |
Configuration Tab
Node-specific settings - varies by node type.
Advanced Tab
Error handling and performance:
| Field | Description |
|---|---|
| Timeout | Max execution time (seconds) |
| Retry on Error | Automatically retry failures |
| Retry Count | Number of retry attempts |
| Continue on Error | Don't stop workflow on failure |
Field Types
Text Input
Simple text entry field.
┌─────────────────────────────────────┐
│ Subject line text here │
└─────────────────────────────────────┘
How to use:
- Type directly
- Paste text
- Insert variables with
{{
Variable Field
Field that accepts variables.
┌─────────────────────────────────┬───┐
│ {{contact.email}} │{x}│
└─────────────────────────────────┴───┘
↑
Variable picker
How to use:
- Type
{{to open variable picker - Or click
{x}icon - Select variable from list
Dropdown Select
Choose from predefined options.
┌─────────────────────────────────┬───┐
│ OpenAI GPT-4 │ ▼ │
└─────────────────────────────────┴───┘
How to use:
- Click to open dropdown
- Select from options
- Search if many options
Integration Selector
Select a configured integration.
┌─────────────────────────────────┬───┐
│ My Gmail Connection │ ▼ │
└─────────────────────────────────┴───┘
⚙️ Configure Integration
How to use:
- Select existing integration
- Or click "Configure" to add new
Code Editor
JavaScript or template code.
┌─────────────────────────────────────┐
│ 1 │ const email = input.payload.email│
│ 2 │ const name = input.payload.name; │
│ 3 │ │
│ 4 │ return { │
│ 5 │ greeting: `Hello ${name}` │
│ 6 │ }; │
└─────────────────────────────────────┘
Features:
- Syntax highlighting
- Line numbers
- Auto-completion
- Error indicators
Rich Text Editor
For email bodies and formatted content.
┌─────────────────────────────────────┐
│ B I U │ 🔗 │ {x}│ ≡ │ • │ 1.│ │ ← Toolbar
├─────────────────────────────────────┤
│ Hello {{contact.name}}, │
│ │
│ Welcome to our platform! │
└─────────────────────────────────────┘
Features:
- Bold, italic, underline
- Links
- Variable insertion
- Lists
Toggle Switch
On/off settings.
○──● Enable retry
Number Input
Numeric values with optional constraints.
┌─────────┐
│ 1000 │ tokens
└─────────┘
Min: 1 Max: 4096
Required vs Optional Fields
Required Fields
Marked with * (asterisk) or red indicator.
To *
┌─────────────────────────────────────┐
│ │ ← Must fill this
└─────────────────────────────────────┘
If missing:
- Node shows validation error
- Cannot save workflow
- Won't execute properly
Optional Fields
No asterisk, have reasonable defaults.
CC
┌─────────────────────────────────────┐
│ │ ← Can leave empty
└─────────────────────────────────────┘
If missing:
- Uses default value
- Node works normally
Step-by-Step Configuration
Example: Configuring an Email Send Node
Step 1: Select the node
- Click on the Email Send node on canvas
- Configuration panel opens on right
Step 2: Choose integration
Integration *
┌─────────────────────────────────┬───┐
│ Select email integration... │ ▼ │
└─────────────────────────────────┴───┘
- Click dropdown
- Select your Gmail, SMTP, or other email integration
Step 3: Set recipient
To *
┌─────────────────────────────────┬───┐
│ {{webhooktrigger_1.payload.email│{x}│
└─────────────────────────────────┴───┘
- Type
{{to open picker - Navigate: webhooktrigger_1 → payload → email
- Click to insert
Step 4: Write subject
Subject *
┌─────────────────────────────────────┐
│ Welcome to {{company.name}}, {{contact.first_name}}!│
└─────────────────────────────────────┘
- Type text directly
- Insert variables as needed
Step 5: Compose body
Body *
┌─────────────────────────────────────┐
│ Hello {{contact.first_name}}, │
│ │
│ Welcome to our platform! │
│ │
│ Your account: {{contact.email}} │
└─────────────────────────────────────┘
Step 6: Optional settings
- CC/BCC if needed
- Attachments if needed
- Reply-To if different from sender
Step 7: Review
- Check all required fields filled
- Preview with test data
- Save workflow
Using the Variable Picker
The variable picker helps you find and insert variables correctly.
Opening the Picker
Method 1: Type trigger
Field: {{ ← Typing {{ opens picker
Method 2: Click icon
┌─────────────────────────────────┬───┐
│ │{x}│ ← Click {x} icon
└─────────────────────────────────┴───┘
Navigating Variables
┌─────────────────────────────────────┐
│ 🔍 Search variables... │
├─────────────────────────────────────┤
│ ▼ webhooktrigger_1 │
│ ├── payload │
│ │ ├── email │
│ │ ├── name │
│ │ └── company │
│ ├── headers │
│ └── method │
│ │
│ ▼ transformdata_1 │
│ └── formatted_data │
└─────────────────────────────────────┘
- Expand nodes to see their outputs
- Search to filter variables
- Click to insert
Variable Preview
When you hover or select a variable, see its current value:
{{webhooktrigger_1.payload.email}}
Preview: "john@example.com"
Type: string
Validation Errors
Common Validation Issues
Missing required field:
❌ To: This field is required
→ Fill in the required field
Invalid variable:
❌ Invalid variable: {{contact.emial}} (typo)
→ Fix the variable path
Wrong data type:
❌ Expected number, got string
→ Use type conversion: {{value|int}}
Integration not selected:
❌ Please select an integration
→ Choose from dropdown or configure new
Fixing Validation Errors
- Look for red indicators on fields
- Hover for error message
- Fix the issue
- Errors clear automatically
Configuration Patterns by Node Type
Trigger Configuration
Webhook Trigger:
| Field | Value |
|---|---|
| Webhook | Select or create webhook |
| HTTP Methods | POST (typical) |
Database Trigger:
| Field | Value |
|---|---|
| Entity | contacts, deals, etc. |
| Operations | INSERT, UPDATE, DELETE |
| Filters | Optional conditions |
Scheduler:
| Field | Value |
|---|---|
| Schedule Type | Cron, Daily, Weekly |
| Time/Expression | When to run |
| Timezone | Your timezone |
Action Configuration
Email Send:
| Field | Value |
|---|---|
| Integration | Email service |
| To | {{contact.email}} |
| Subject | Email subject line |
| Body | Email content |
WhatsApp Send:
| Field | Value |
|---|---|
| Integration | WhatsApp BSP |
| Phone | {{contact.phone}} |
| Template | Select template |
| Variables | Template variables |
API Request:
| Field | Value |
|---|---|
| URL | API endpoint |
| Method | GET, POST, etc. |
| Headers | Auth, content-type |
| Body | Request payload |
Logic Configuration
Condition:
| Field | Value |
|---|---|
| Variable | {{contact.lead_score}} |
| Operator | greater_than |
| Value | 80 |
Loop:
| Field | Value |
|---|---|
| Array | {{data.items}} |
| Max Iterations | 100 |
AI Configuration
LLM Integration:
| Field | Value |
|---|---|
| Integration | OpenAI, Claude, etc. |
| Model | gpt-4o-mini |
| System Prompt | AI instructions |
| Prompt | {{message}} |
| Temperature | 0.7 |
| Max Tokens | 1000 |
Tips for Better Configuration
Use Descriptive Aliases
Default: emailsend_1
Better: send_welcome_email
This makes variables easier to understand:
{{emailsend_1.success}} → unclear
{{send_welcome_email.success}} → clear
Add Descriptions
Use the description field to document:
- What this node does
- Why it's configured this way
- Any special considerations
Test with Sample Data
Before finalizing:
- Fill in configuration
- Run a test with sample data
- Check outputs in node panel
- Adjust as needed
Use Defaults Wisely
For optional fields:
- Leave empty to use defaults
- Only fill if you need different behavior
- Document when using non-default values
Advanced Settings
Timeout Configuration
Timeout: 30 seconds
Set appropriate timeouts:
- API calls: 30-60 seconds
- AI generation: 60-120 seconds
- Email sending: 30 seconds
Retry Logic
☑ Retry on Error
Retry Count: 3
Retry Delay: 5 seconds
Use for:
- External API calls (rate limits)
- Email sending (temporary failures)
- Database operations (lock contention)
Continue on Error
☑ Continue on Error
When enabled:
- Workflow continues even if this node fails
- Error stored in
{{node.error}} - Use condition to check and handle
Quick Reference
Field Types
Text Input → Type directly or paste
Variable Field → Type {{ or click {x}
Dropdown → Click and select
Code Editor → Write JavaScript
Rich Text → Format with toolbar
Toggle → Click to switch
Number → Enter numeric value
Configuration Tabs
Basic → Alias, description, enabled
Configuration → Node-specific settings
Advanced → Timeout, retry, error handling
Variable Picker
Type {{ → Opens picker
Click {x} → Opens picker
Navigate → Expand nodes, drill down
Search → Filter by name
Click → Insert variable
Validation Indicators
* → Required field
Red border → Validation error
Hover → See error message
Next Steps
Now that you can lay out and configure nodes, continue with:
- Working with Variables - Advanced variable techniques
- Using Conditions - Add logic to workflows
- Testing Workflows - Verify your configuration