LiveFlow
Closed beta by invitation

Code becomes nodes, edges, and a runtime story you can follow.

LiveFlow turns execution into a readable system. Follow control flow, inspect changing state, and move across a timeline that keeps graph structure and source context aligned.

Live
streamed execution context
Replay
deterministic timeline playback
Graph
runtime shape made visible
About LiveFlow

Built to make execution understandable while your mental model is still forming.

The project treats runtime behavior as a visual system. Instead of only reading logs, stack traces, or raw values, you can see how functions connect, where data moves, and how the program shape changes step by step.

Code stays grounded

Source context, timeline position, and graph state stay connected so the interface supports reasoning instead of distracting from it.

Graph tells the story

Nodes and connections surface execution relationships in a way that feels immediate, spatial, and easier to follow under pressure.

How Code Becomes Graph

Read the source, then watch the same runtime appear as a real graph.

This section is meant to tell the story plainly. The code stays readable on the left, and the right side uses actual LiveFlow React Flow nodes so the graph looks like the tool, not a decorative stand-in.

Step 01

Start with readable source

The Python snippet stays intact, including indentation, so loops and conditions still read the way you wrote them.

Step 02

Lift runtime pieces into nodes

LiveFlow turns the live function call and the values around it into graph elements you can inspect without losing code context.

Step 03

Follow movement through edges

Bezier connections show where data enters the function and where execution continues next, making the runtime path easier to follow.

Source to runtime graph
actual React Flow nodes

Source

main.py

Python
main.py
1numbers = [2, 4, 6, 8]
2def square_all(values):
3 output = []
4 for value in values:
5 output.append(value * value)
6 return output
7squared = square_all(numbers)

Graph

Runtime shape

execdata
Capability Strip

Built for runtime readability, not just spectacle.

Execution Flow

Warm edges and guided motion keep the call path visible while control moves through your code.

State Inspection

Cool data channels keep variables, objects, and collections readable as values change over time.

Replay Confidence

The interface stays deterministic so rewinding the timeline restores the same graph and context.