CineCode
Reference

Simulations

Every built-in simulation — terrain, pathfind, particles, graph, life, and boids — with parameters and live output.

Simulations are deterministic algorithms rendered as scene nodes. Create one with s.<sim>(...), configure it with a fluent chain, then drive it on the timeline or link it to code.

Timeline control

Every simulation node supports these timing methods:

start, dur, and cycle accept raw frames or time helpers. Prefer helpers in new scripts: ms(500) is half a second, sec(2) is two seconds, and s(2) is the short seconds alias.

MethodDescription
reveal(start, dur)Reveal the simulation building in.
run(start, dur)Advance the simulation over a window.
hold(value, start, dur)Hold at a fixed progress value.
loop(start, cycle, cycles)Loop a cycle a number of times.

terrain / noise

A procedural heightmap.

let t = s.terrain(680, 160, 500, 400);
t.seed(7).frequency(3.0).octaves(4).cells(48, 32).mode("heightmap");
t.reveal(ms(333), sec(1.67));
MethodDescription
seed(n)Random seed (determinism).
frequency(f)Noise frequency.
octaves(n)Octaves of detail.
cells(x, y)Grid resolution.
mode(m)heightmap, heatmap, or grayscale.
terrain — a seeded heightmap.
Files that made this video

A terrain simulation bound to the line of code that computes a height value.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18

pathfind

A* search on a grid.

let grid = s.pathfind(700, 150, 440, 420);
grid.seed(11).cells(24, 18).wall_density(0.28);
grid.run(ms(667), sec(3));
MethodDescription
seed(n)Random seed.
cells(x, y)Grid resolution.
wall_density(d)Fraction of walls, 0–0.6.

Color legend: start = green (top-left), goal = red (bottom-right), explored = blue, frontier = cyan, final path = gold.

pathfind — A* exploring toward the goal.
Files that made this video

An A* grid simulation bound to the loop that explores neighbors.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18

particles

Streams of particles between two points.

// particles(from_x, from_y, to_x, to_y)
let p = s.particles(200, 360, 1080, 360);
p.count(400).spread(40.0).speed(6.0);
p.run(ms(333), sec(4));
MethodDescription
count(n)Number of particles.
spread(s)Emission spread.
speed(v)Particle speed.
particles — routing packets across the frame.
Files that made this video

A particle stream showing packets moving from code to server.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18

graph

Graph traversal (BFS/DFS).

let g = s.graph(640, 200, 520, 380);
g.seed(3).nodes(18).algorithm("bfs");
g.run(ms(667), sec(3.33));
MethodDescription
seed(n)Random seed.
nodes(n)Number of nodes.
algorithm(a)bfs or dfs.
graph — breadth-first traversal.
Files that made this video

A breadth-first traversal spreading across a graph.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18

life / automata

Conway's Game of Life (and other rules).

let l = s.life(640, 160, 520, 420);
l.seed(5).cells(64, 36).density(0.3).generations(60).rule("B3/S23");
l.run(ms(0), sec(4));
MethodDescription
seed(n)Random seed.
cells(x, y)Grid resolution.
density(d)Initial alive fraction.
generations(n)Number of generations.
rule(s)Birth/survival rule, e.g. "B3/S23".
life — Conway's Game of Life evolving.
Files that made this video

Conway's Game of Life bound to the neighbor-counting logic.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18

boids

Flocking simulation.

let b = s.boids(640, 160, 520, 420);
b.seed(9).count(120).steps(200).separation(1.4).alignment(1.0).cohesion(0.8);
b.run(ms(0), s(5.33));
MethodDescription
seed(n)Random seed.
count(n)Number of boids.
steps(n)Simulation steps.
separation(w)Separation weight.
alignment(w)Alignment weight.
cohesion(w)Cohesion weight.
boids — emergent flocking.
Files that made this video

A flocking simulation bound to separation, alignment, and cohesion.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18

All six together

terrain
Files that made this video

A terrain simulation bound to the line of code that computes a height value.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18
pathfind
Files that made this video

An A* grid simulation bound to the loop that explores neighbors.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18
particles
Files that made this video

A particle stream showing packets moving from code to server.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18
graph
Files that made this video

A breadth-first traversal spreading across a graph.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18
life
Files that made this video

Conway's Game of Life bound to the neighbor-counting logic.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18
boids
Files that made this video

A flocking simulation bound to separation, alignment, and cohesion.

codescene.toml
Project manifest: output size, theme, scene order, transitions, and shader names.
Open full file
scenes = ["scenes/intro.ccs", "scenes/terrain.ccs", "scenes/pathfind.ccs", "scenes/particles.ccs", "scenes/graph.ccs", "scenes/life.ccs", "scenes/boids.ccs", "scenes/tweens.ccs", "scenes/inserts.ccs", "scenes/edit.ccs", "scenes/edit_source.ccs", "scenes/editor_theme.ccs", "scenes/font_set.ccs", "scenes/remove_styles.ccs", "scenes/morph.ccs", "scenes/shapes.ccs", "scenes/effects.ccs"]
theme = "dark_documentary"

[episode]
title = "How Rivers Form"

[output]
fps = 30
width = 1280
height = 720

[shaders]
aurora = "shaders/aurora.wgsl"
glitch = "shaders/glitch.wgsl"
scanlines = "shaders/scanlines.wgsl"

[transition]
kind = "crossfade"
frames = 18

Every simulation is a pure function of its parameters and the frame number — so the same seed always produces the same animation. See Determinism.

Code & node animations

Every animation, style, focus, and shape method you can chain onto a node.

Camera

focus_on, move_to, and zoom_to — the camera controls.

On this page

Timeline controlterrain / noisepathfindparticlesgraphlife / automataboidsAll six together