Timing and motion

The timeline

The dock under the transport: element bars, cue chips, the seconds axis, and dragging something to a different moment.

The transport carries a collapsed 24-pixel strip by default. The chevron opens a resizable dock below it, with a lane per kind of thing.

The dock is a sibling of the scrubber, never an overlay on it — so it cannot swallow a pointer press meant for the playhead.

It speaks seconds

Both the strip and the dock label a proper time axis: 0.5, 2, 1:30, with unlabelled minor ticks between. Not candle numbers.

That distinction matters because a pause stretches the seconds between two columns — a tick every fifth candle would not even be evenly spaced. If you want column numbers, they are a canvas option: see candle numbers.

The dock also marks the end of motion — the moment the chart is finished, before the tail hold. "Why is the video still running when the chart is done" is a question you have in front of a timeline, so the timeline answers it.

Element bars

One bar per element, packed into rows like a calendar so non-overlapping bars share a row. Four rows, then the lane scrolls inside itself.

A bar covers the entrance, not the standing time: solid from the moment it appears to the end of its reveal, then a hairline to its disappears-at or the end of the video. Full length solid bars would be a dozen identical stripes all ending at the right edge, burying the one thing the lane is asked — when does this arrive.

Dragging

GestureWrites
Drag the bodyAppears at, snapped to a whole candle
Alt + drag the bodyOffset seconds — free placement between columns
Drag the right edge inwardDisappears at
Double-clickSeek the playhead to the entrance
ClickSelect the element

A plain drag clears any offset seconds it finds. Alt-drag is the only gesture that creates one, so nobody produces that field by accident.

Dragging the right edge in from the far end is the only gesture that creates a disappears-at, and dragging it back out past the end clears it again.

Snapping

In order: whole candles, other elements' arrivals, pause edges, the playhead.

Word boundaries from a recording are deliberately not candidates here. They belong to speech — a caption landing on a syllable is meaning, a spotlight landing on one is a coincidence.

Tolerance is measured in pixels, not seconds, so zooming the timeline in genuinely buys you precision instead of tightening the snap along with it.

Anchored elements cannot be dragged

An element anchored to a narration line shows a chain icon and a not-allowed cursor, with the line named in its tooltip. The anchor survives a re-recording and a drag would break it silently — so its timing is edited in the panel instead, where the anchor is visible.

Hover works both ways

Hover a bar and the element rings on the chart. Hover an element on the chart and its bar lights up — the direction that answers "where in time is the thing I am looking at".

Cue chips

If the project has subtitles, they get their own lane of draggable chips: drag to move, edge to trim, double-click to split at a word boundary, M to merge with the next, Delete to remove.

Trim grips appear on hover, not permanently — two dozen always-on grips fight against reading the lane at a glance. A chip too small to hold both grips gets none.

The eye is the same eye

The dock's visibility rows are the canvas's visibility rows. But a hidden kind is dimmed here, not removed: hiding a zone so you can draw underneath it must not also empty the lane you were about to time it in.

The dock's height and open state are remembered per browser, never stored in the project.