Motion fieldnotesOpenAI film study
Timing & transitions · Rendered draft

Hover a tooltip with a shortcut, click, cross-dissolve into a timeline macro, then blur-pull back to the editor

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

01 / OpenAI source 0:11.7–0:13.3 · Silent research excerpt
02 / Remotion draft Original illustrated content · Editable code

What the source does

Macro on a dark composer bar under a video: duration and version pills at left, a 'Storyboard' button and send circle at right, and a dark tooltip reading 'New storyboard' with a keyboard-shortcut chip above the button. The pointer sits on the button; the tooltip fades out around local frame 20 (master 720) and the button lights on the click at ~22. From ~33 to 37 (master 733-737) the frame cross-dissolves into a different macro: a dark storyboard timeline with a ruler (06-10), a wide clip block and a bottom toolbar. That holds until ~78, then blurs and shrinks (master 778-795) into the storyboard editor: a tall empty scene card centred over a timeline strip, which settles by ~96.

Tooltip-to-mode change in two transitions: a short cross-dissolve carries the click into a detail view, then a blur-and-scale dissolve resolves that detail into the full new screen, each transition timed to a different UI beat.

Phase notes

  1. Frame 0 — Tooltip with shortcut over the button
  2. Frame 20 — Tooltip fades
  3. Frame 22 — Click
  4. Frame 33 — Cross-dissolve to timeline macro
  5. Frame 78 — Blur and shrink
  6. Frame 92 — Editor with scene card settles

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 ↗