Add camera moves

Goal

Choreograph a camera so the frame moves with your narration — pushing in on a detail, then pulling back to a wide.

Request a camera

Each scene can have one camera:

let cam = s.camera();

All coordinates are in the scene's pixel space (e.g. 1280×720), before the camera transform.

Focus on an element

focus_on frames a node, optionally a specific line, at a given zoom:

// focus_on(node, x, y, zoom, line)
cam.focus_on(code, 96, 24, 1.7, 2); // push in on line 2 of `code`

Pan to a point

// move_to(x, y, start, dur)
cam.move_to(640, 360, sec(5), sec(1)); // glide to centre over one second

Zoom

// zoom_to(zoom, start, dur)
cam.zoom_to(1.0, sec(5), sec(1)); // ease back to 1× while panning

A complete camera arc

Push in on the code, hold, then pull back to reveal the whole scene:

let s = scene("Introduction", sec(6));
let code = s.code(read("src/main.rs"), "rust", 96, 160);
code.fade_in(0, ms(600)).typewriter(ms(267), ms(2333));

let cam = s.camera();
cam.focus_on(code, 96, 24, 1.7, 2);  // open tight on line 2
cam.move_to(640, 360, sec(5), sec(1)); // pull back…
cam.zoom_to(1.0, sec(5), sec(1));      // …and zoom out together

A camera push-in and pull-back over typing code.

Files that made this video

The opening scene from the `rivers-project` example.

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

Tips

Move and zoom in the same time window so they feel like one motion.
Combine with easing for cinematic accel/decel.
Keep moves slow and purposeful — a documentary camera rarely hurries.

Reference

See Camera reference for exact signatures.

On this page