Motion fieldnotesOpenAI film study
Camera & framing · Rendered draft

Expand a context-menu row into an inline submenu, walk the highlight down, then cut to the share sheet

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

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

What the source does

Inside a phone simulator on the right, a post's long-press context menu is open (Quote, Share ›, View in Browser, Copy Text…) with the hover highlight on 'Share' (f0–27). At ~f28 the Share row expands in place: its chevron turns down, 'Quote' dims, three sub-rows (Share Post, Share Link, Share as Image) are inserted and every row below steps downward. The highlight walks to 'Share as Image' by ~f45 and the pointer clicks at ~f55. At ~f58 the screen hard-cuts to a 'Share post as image' sheet with a Done button and a preview card. The left pane's agent log stays static.

An accordion submenu: a menu row expands inline and pushes later rows down as a step, the hover highlight walks to the new child row, and a click hard-cuts to the resulting sheet.

Phase notes

  1. Frame 0 — Context menu open, highlight on Share
  2. Frame 28 — Share expands inline; rows below step down
  3. Frame 45 — Highlight moves to the child row
  4. Frame 55 — Click
  5. Frame 58 — Hard cut to share sheet
  6. Frame 79 — Sheet holds

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 ↗