Workflow Designer
Status
Owner: TBD · Status: draft · Canonical source: flezi.app.frontend.main/src/pages/workflows/WorkflowDesigner.tsx
Who is this for?
Solution architects and workflow automation designers.
What can you do?
- Drag and drop processing nodes onto an infinite React Flow canvas.
- Wire data connections between upstream outputs and downstream inputs.
- Configure specialized nodes: Classify, LLM, Tool, Skill, Agent, Human Input.
- Leverage keyboard shortcuts, Undo/Redo, and automatic layout alignment.
Core Node Types
| Node Icon | Node Type | Purpose |
|---|---|---|
| 🔀 | Classify | Branch logic based on intent or conditions |
| 🤖 | LLM | Text processing, summarization, extraction |
| 🔧 | Tool / Skill | Execute specialized tools or Python scripts |
| 🧑💼 | Agent | Delegate execution to an autonomous subagent |
| 🙋 | Human Input | Pause pipeline and request human form input or approval |
Steps
- Drag a node from the left palette onto the canvas.
- Click the card to open its properties drawer to configure prompts or select models.
- Drag edge wires from output ports (right) to target input ports (left).
- Click Save Workflow to commit changes.