Motion fieldnotesOpenAI film study
Interface sequences · Rendered draft

Tick a mono elapsed timer in tenths, then hard-swap the centre to a completion state with two stats

Study the source, inspect the editable build, then adapt the treatment to your own content.

01 / OpenAI source 1:47.6–1:50.9 · Silent research excerpt
02 / Remotion draft Original illustrated content · Editable code

What the source does

A browser window on a purple gradient shows an 'Offline transcription' page: title, Realtime/Offline segmented control, a file row with a greyed 'Transcribing' button and a nearly full progress bar. Centred below, a large monospaced timer counts in tenths of a second from about 00:40.0 (local 0, master 2580) to 00:41.7 by frame ~42, with a small spinner and label above it. At about local frame 43 (master 2623) the centre hard-swaps to a green check, 'Transcription complete', two large mono stats (audio length and elapsed time) and a dark 'View transcript' button; the file row gains a green complete badge and the button becomes solid 'Transcribe file'. Everything then holds.

Real-time numeric counter that resolves into a summary state: the ticking value is stepped text with no easing, and completion is a single-frame swap of the centre block plus dependent controls.

Phase notes

  1. Frame 0 — Timer at 00:40.0, transcribing
  2. Frame 22 — Timer past 00:41.0
  3. Frame 43 — Hard swap to completion state
  4. Frame 60 — Hold

Use this example

  1. Watch the source and draft at normal speed. Compare the order of actions, the held states, and the transition into the result.
  2. Download the project and read its README before changing inputs. The package includes its implementation and declared dependencies.
  3. Replace the sample content through the package's documented input or content builder. Keep source footage in the research comparison.
  4. Render your adaptation and inspect text fit, framing, intermediate states, and entry and exit frames.
A runnable draft is not a fidelity approval.

The source and remake are different assets. The original code-based illustration remains editable; source footage is a research reference. Read the retained findings below before using the choreography.

Recorded limits

  • Visual fidelity is an authored draft judgement from sampled source frames; no independent blind review or native Resolve execution.

Inspect the original verification record ↗