Concepts

A script has two halves. One says what happens in the browser and makes the take; the other says how the take is filmed.

The take#

capture runs the script's actions in a real headless browser and keeps:

• the frames: what the page showed, as the browser painted it (a screencast at the page's pixel density, 2 by default, so the camera can zoom in and stay sharp);
• the event log: when each step started, acted and settled, where every element was, the pointer's path, each key, and the page's address and title;
• the element snapshots: after each step, the elements on screen and the targets that find them, for targets and the studio's picker.

The take depends only on the actions (with their ids and timeouts) and the capture settings (browser except its frame, capture, typing.wpm, typing.typos, seed). It is cached by a key made from them, in .browser-clip/takes/ next to the script.

Compose#

Everything else is composed from the take, as terminal-clip composes its terminal sessions:

• the camera: an automatic director, or explicit shots, zooming into the page's own pixels;
• the speed: long waits sped up, ramps, a global rate;
• the pointer: drawn in the page's CSS pixels along the recorded path, with click ripples;
• the browser window: a frame with an address bar and tabs, on a backdrop;
• text over the video: captions, title cards and key badges;
• sound: keys at the times they were typed, and optional mouse clicks.

Editing these is instant: the studio re-composes as you type, and render never runs the browser again for them.

Scene time and video time#

The take's clock is scene time: it starts when the first page has settled. Video time is what the viewer sees: pauses freeze the picture, speed-ups compress waits, and the lead and hold add a still at both ends. Commands such as still --at and render --range take video seconds, or markers: save or save.act for the step with id: save, step3.end, end, with an offset such as save.act+0.5.

What changes the take#

Repeatable#

The same script and take render the same video. render --deterministic writes identical files, byte for byte (software VP9 in MP4), sound included.

Source: docs-src/pages/concepts.md · browser-clip 0.1.0