# Hold a collage title card, hard-cut to the interview, then pop the name and the role in two beats

Manual DaVinci Resolve / Fusion construction guide generated from the recipe. It is not a tested .drp.
The accompanying Remotion project (recipe.json) is the executable definition; the numbers below are copied from it.
Neither construction establishes source fidelity: this is an original vector approximation of an inspected editing moment.

## Source and clock
Reference: OpenAI's "How Shopify Uses ChatGPT Work to Build Faster with AI Agents" (OHVu3Y4B3RI), published 2026-07-16.
Source interval [100, 172) on the 24/1 fps master: 72 frames, 3.000000 s. Local frame 0 = source frame 100.
Create a 1920x1080 progressive timeline at 24/1 fps and a Fusion composition exactly 72 frames long. Keep integer frames; do not round the frame rate.
Background field: #f5f4f0. Export silent H.264 yuv420p to match the intended playback container.

## Observation
An off-white title card holds for the first eight frames: a two-line centred headline surrounded by small illustration tiles (a parcel, a 'Workflow summary' document card, a yellow code snippet, a small table and a flowchart). At ~f8 it hard-cuts to a webcam interview in a pale green room. The speaker's name pops in bottom-left at ~f11 with no animation, and the role line pops in to its right three frames later (~f14). Both hold to the end.

## Mechanism
Static collage title card, hard cut to interview footage, then a two-beat lower third where the name appears first and the role follows.

## Phases (local frames)
- 0: Title card holds
- 8: Hard cut to interview
- 11: Name pops in
- 14: Role pops in
- 71: Hold

## Layer inventory (absolute 1920x1080 top-left pixels, back to front)
- card [group] at (0, 0) size 1920x1080 fill #f5f4f0 visible [0, 8)
  - headline [text] at (0, 430) size 1920x0 text "Harbor scales team enablement / with shared agents" 52px weight 700 #151515
  - table-tile [rect] at (300, 60) size 520x150 radius 8 fill #ffffff stroke #e2e1dc 1px
  - tl1 [rect] at (330, 92) size 200x8 radius 4 fill #dcdbd5
  - tl2 [rect] at (330, 120) size 300x8 radius 4 fill #dcdbd5
  - tl3 [rect] at (330, 148) size 260x8 radius 4 fill #dcdbd5
  - tl4 [rect] at (330, 176) size 340x8 radius 4 fill #dcdbd5
  - flow-tile [rect] at (1380, 40) size 460x200 radius 8 fill #ffffff stroke #e2e1dc 1px
  - f1 [rect] at (1420, 70) size 150x36 radius 8 fill #f0efe9 stroke #cfcdc4 1px
  - f2 [rect] at (1650, 70) size 150x36 radius 8 fill #f0efe9 stroke #cfcdc4 1px
  - f3 [rect] at (1535, 150) size 150x36 radius 8 fill #f0efe9 stroke #cfcdc4 1px
  - fl [line] at (0, 0) stroke #9c9a92 2px
  - fl2 [line] at (0, 0) stroke #9c9a92 2px
  - coin [ellipse] at (1250, 120) size 120x120 fill #e2b83a stroke #b8922a 6px
  - parcel [rect] at (90, 700) size 300x240 radius 10 fill #d9b07c
  - parcel-tape [rect] at (225, 700) size 30x240 fill #c8462f
  - parcel-label [rect] at (290, 730) size 70x40 radius 4 fill #ffffff
  - doc-card [rect] at (470, 810) size 460x180 radius 16 fill #ffffff
  - doc-icon [rect] at (510, 860) size 60x80 radius 8 fill #f7c948
  - doc-text [text] at (600, 862) text "Workflow / summary" 30px weight 500 #151515
  - code-plate [rect] at (1220, 740) size 640x300 fill #f6e27a
  - code [text] at (1250, 770) text "agent={ /   handoff:true /   review:auto }" 60px weight 700 #d1c169
  - robot [rect] at (1640, 480) size 200x130 radius 12 stroke #151515 4px
  - robot-eye [ellipse] at (1710, 520) size 26x26 fill #151515
  - robot-eye2 [ellipse] at (1760, 520) size 26x26 fill #151515
- room [rect] at (0, 0) size 1920x1080 fill #a6ab95 visible [8, 72)
- door [rect] at (1120, 60) size 300x900 fill #c8cabd visible [8, 72)
- shelf1 [rect] at (1450, 140) size 470x14 fill #5a4636 visible [8, 72)
- shelf2 [rect] at (1450, 380) size 470x14 fill #5a4636 visible [8, 72)
- shelf3 [rect] at (1450, 620) size 470x14 fill #5a4636 visible [8, 72)
- books1 [rect] at (1480, 60) size 320x80 radius 3 fill #7b4d3a visible [8, 72)
- books2 [rect] at (1500, 290) size 360x90 radius 3 fill #3f5a6e visible [8, 72)
- books3 [rect] at (1470, 540) size 300x80 radius 3 fill #8a2f2f visible [8, 72)
- shoulders [ellipse] at (520, 640) size 920x700 fill #5a5751 visible [8, 72)
- name [text] at (120, 956) text "Dana Whitfield" 26px weight 700 #ffffff visible [11, 72)
- role [text] at (420, 956) text "Lead, Operations Lab, Harbor" 26px weight 500 #ffffff visible [14, 72)

## Construction steps
1. Timeline 1920x1080 at 24 fps; Fusion composition 72 frames. Local 0 = master frame 100.
2. Title card (frames 0-7): #f5f4f0 background, 52px bold two-line centred headline at y 430, and static tiles - white table/flowchart plates, a gold coin ellipse, a parcel with a red tape band, a white document card with a 30px label, a yellow plate with 60px mono code in a darker yellow. Nothing moves.
3. Frame 8: hard cut to the interview clip. In this stand-in the room is a #a6ab95 field with a pale door, three shelf bands with book blocks and a dark shoulders ellipse - replace with footage.
4. Lower third: Text+ name at 120,956, 26px bold white, visible from frame 11; role Text+ at 420,956, 26px medium white, visible from frame 14. Both are hold keys with no fade or slide.
5. Easy mistake: fading the lower third. The source pops each element on in a single frame, three frames apart.

## Content variants
Default copy:
- headline: Harbor scales team enablement / with shared agents
- docCard: Workflow / summary
- code: agent={ /   handoff:true /   review:auto }
- name: Dana Whitfield
- role: Lead, Operations Lab, Harbor
Adaptation changes:
- headline: Northwind ships support tooling / with one assistant
- docCard: Ticket / digest
- code: bot={ /   route:auto /   escalate:true }
- name: Marcus Oyelaran
- role: Head of Support Systems, Northwind

## Limits
Easing names map to Fusion spline shapes: linear = linear, in/out/inOut = ease curves on the same frames, hold = step, spring/overshoot = slight overshoot past the target before settling.
Text reveal frames give the first and last unit; distribute characters/words evenly between them. Cursor click rings last 14 frames.
Vector illustration is an approximation of layout and motion, not the product UI or recovered production assets.
