How it works
Live output of the real render engine — edit the settings and it updates instantly.
Flowchart
diagramselegant3dfold
Steps and a yes/no decision; connectors draw on, each step pops in as the line reaches it.
Best for: A process with a branch.
Settings
Font
Theme
Size
Mood
Use it in a film
What you can change:
nodes/edgeshighlightFor developers (MCP and JSON)
This is the exact scene to send to create_animation (MCP): keep the shape, change the words, and write the narration — the voice sets how long the scene lasts. Paste it into update_storyboard with set_data to change a film you already made.
{
"visual": "diagram",
"motion": "foldInBlock",
"heading": "Diagram",
"caption": "From a link to a film",
"narration": "Write the sentence the voice says over this scene; its length is the scene's.",
"data": {
"diagram": {
"nodes": [
{
"id": "paste",
"label": "Paste a link",
"icon": "🔗"
},
{
"id": "ok",
"label": "Is the page public?"
},
{
"id": "film",
"label": "Film it in a browser"
},
{
"id": "login",
"label": "Open a capture session"
},
{
"id": "done",
"label": "Finished MP4"
}
],
"edges": [
{
"from": "paste",
"to": "ok"
},
{
"from": "ok",
"to": "film",
"label": "yes"
},
{
"from": "ok",
"to": "login",
"label": "no"
},
{
"from": "film",
"to": "done"
},
{
"from": "login",
"to": "done"
}
],
"highlight": "done",
"kind": "flow"
},
"caption": "From a link to a film"
}
}