AI Workflow Builder – Demo applications & examples

All demos

AI Workflow Builder<br>JointJS+

AI Workflow Builder<br>JointJS+

All demos

START fREE TRIAL

About DemoAbout demo

AI Workflow Builder<br>Enable your users to design AI agents through a drag-and-drop interface built into your web app. This demo shows how JointJS for React handles agent-building UIs: adding skills and prompts, wiring up tools, and defining agent behavior visually. It ships with automatic layout, custom shapes, a navigator and many more features out of the box — the same pieces you'd use to build this into your own product.<br>Made with JointJS+

Made with JointJS+

Made with JointJS+ and Bryntum

Coming soon in JointJS+

Made with JointJS

Made with JointJS

Demo instructions

Extend the default workflow or build your own from scratch—add new actions, configure agents, jot down notes, and explore everything the diagram can do.

Features<br>Zoom & Pan

Automatic layout

Custom shapes

Toolbar

Minimap

Property editor & viewer

Popups

Element palette

Undo/Redo

Import/Export

Export to JSON

Export to PNG/JPEG

Link labels

Ports

Tooltips

Drag & Drop

Animation

Element tools

Content-driven shapes

Copy & Paste

Keyboard

Selection

Validation

Simulation

Graph API

Integration

Menus

Responsive

Guidelines

Save/Load

Shape transformation

Text content

Context Toolbar

VIEW SOURCE CODE

See all demos<br>AI Workflow Builder<br>JointJS+

fREE TRIAL

Get code

Full preview

Made with JointJS+<br>The source code of this demo is available as part of the JointJS+ commercial license. Don't have a license yet? Start a trial and use the source code of this and many other demos for free, with no obligations, for 30 days.<br>Compatible with:

Learn about Jointjs+

Start free trial

Made with JointJS+<br>All features required to build this demo are included in the commercial JointJS+ package. Don't have a license yet? Start a trial and build professional applications with ease.<br>Compatible with:

Learn about Jointjs+

Start free trial

Made with JointJS+ and Bryntum<br>This demo was created in collaboration with Bryntum. All the features used are available in the commercial versions of JointJS and Bryntum.<br>Compatible with:

Learn about bryntum

Start free jointjs+ trial

Coming soon in JointJS+<br>All the features required to build this demo are included in the upcoming JointJS+ release. Don't have a license yet? Start a trial and build professional applications with ease.<br>Compatible with:

Learn about Jointjs+

Start free trial

Made with JointJS<br>The source code of this demo is available in the JointJS open-source library which helps developers create simple visual applications in less time.<br>Compatible with:

Download JointJS

View code on github

Made with JointJS<br>All features required to build this demo application are included in our open-source library, JointJS. Download the package and create basic visual applications in no time.<br>Compatible with:

Download JointJS

View code on codepen

About demo<br>Enable your users to design AI agents through a drag-and-drop interface built into your web app. This demo shows how JointJS for React handles agent-building UIs: adding skills and prompts, wiring up tools, and defining agent behavior visually. It ships with automatic layout, custom shapes, a navigator and many more features out of the box — the same pieces you'd use to build this into your own product.<br>Made with JointJS+

Made with JointJS+<br>All features required to build this demo are included in the commercial JointJS+ package. Don't have a license yet? Start a trial and build professional applications with ease.

Made with JointJS+ and Bryntum<br>This demo was created in collaboration with Bryntum. All the features used are available in the commercial versions of JointJS and Bryntum.

Coming soon in JointJS+<br>All the features required to build this demo are included in the upcoming JointJS+ release. Don't have a license yet? Start a trial and build professional applications with ease.

Made with JointJS<br>The source code of this demo is available in the JointJS open-source library which helps developers create simple visual applications in less time.

Made with JointJS<br>All features required to build this demo application are included in our open-source library, JointJS. Download the package and create basic visual applications in no time.

Demo instructions

Extend the default workflow or build your own from scratch—add new actions, configure agents, jot down notes, and explore everything the diagram can do.

Features<br>Zoom & Pan

Automatic layout

Custom shapes

Toolbar

Minimap

Property editor & viewer

Popups

Element palette

Undo/Redo

Import/Export

Export to JSON

Export to PNG/JPEG

Link labels

Ports

Tooltips

Drag & Drop

Animation

Element tools

Content-driven shapes

Copy & Paste

Keyboard

Selection

Validation

Simulation

Graph API

Integration

Menus

Responsive

Guidelines

Save/Load

Shape transformation

Text content

Context Toolbar

Boilerplate...