Motion fieldnotesOpenAI film study
Artifacts & handoffs · Rendered draft

Drag a file over the window to tint it with a drop hint, then drop to attach and grow the composer

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

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

What the source does

A desktop app window on a purple-blue gradient shows a drafted brief above a composer that already holds a three-line prompt. From about local frame 6 a small blue file chip is dragged in from the lower right; at ~9 (master 587) the entire window content tints pale blue and a white 'Drop to attach' pill appears at its centre. The chip continues toward the composer and is released at ~19 (master 597): the tint and pill vanish in one frame, a thumbnail tile appears at the top of the composer and the prompt text shifts down as the composer grows taller. Everything holds to the end.

Drag-and-drop attach: drag-enter swaps the whole surface into a tinted drop-target state with a centred hint, and the drop reverts it in one frame while the composer reflows upward to make room for the new attachment tile.

Phase notes

  1. Frame 0 — Composer holds a prompt
  2. Frame 6 — File chip dragged in
  3. Frame 9 — Window tints, 'Drop to attach' pill
  4. Frame 19 — Drop: tint off, tile inserted, composer grows
  5. Frame 35 — 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 ↗