# Click a browser tab, flash a blank pane for four frames, then land the spreadsheet

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 "Work with docs, sheets, and slides in ChatGPT" (E3dDr_QtBuo), published 2026-07-23.
Source interval [1864, 1904) on the 24000/1001 fps master: 40 frames, 1.668333 s. Local frame 0 = source frame 1864.
Create a 1920x1080 progressive timeline at 24000/1001 fps and a Fusion composition exactly 40 frames long. Keep integer frames; do not round the frame rate.
Background field: #0b0b12. Export silent H.264 yuv420p to match the intended playback container.

## Observation
A browser window with a chat column on the left and a document pane ('Messaging' heading, paragraph text, an asset table) on the right; the pointer sits in the tab strip. At about local frame 10 (master 1874) the pointer clicks the second tab. Frames 11 to 14 show the pane empty white with the new tab active, then at ~15 (master 1879) the spreadsheet appears complete: a blue-highlighted title row 'Launch video performance', a subtitle and a dense table. The pointer drifts down the sheet for the rest of the window.

## Mechanism
Tab switch with a visible load gap: the active-tab state flips on the click frame, the content pane goes blank for a few frames, and the new document cuts in fully formed rather than building.

## Phases (local frames)
- 0: Document tab active
- 10: Click second tab
- 11: Tab state flips, pane blank
- 15: Spreadsheet cuts in
- 30: Pointer drifts down the sheet

## Layer inventory (absolute 1920x1080 top-left pixels, back to front)
- window [group] at (110, 60) size 1700x960 radius 14 fill #ffffff
  - chrome [rect] at (110, 60) size 1700x56 radius 14 fill #f3f3f5
  - chrome-flat [rect] at (110, 88) size 1700x28 fill #f3f3f5
  - tl-r [ellipse] at (128, 81) size 13x13 fill #ff5f57
  - tl-y [ellipse] at (150, 81) size 13x13 fill #febc2e
  - tl-g [ellipse] at (172, 81) size 13x13 fill #28c840
  - tab-1 [rect] at (440, 72) size 230x32 radius 7 fill #ffffff stroke #e1e1e3 1px visible [0, 11)
  - tab-1-i [rect] at (440, 72) size 230x32 radius 7 fill #e4e4e7 visible [11, 40)
  - tab-1-t [text] at (460, 80) text "launch-plan-working.docx" 13px weight 400 #2a2a2a
  - tab-2-i [rect] at (680, 72) size 230x32 radius 7 fill #e4e4e7 visible [0, 11)
  - tab-2 [rect] at (680, 72) size 230x32 radius 7 fill #ffffff stroke #e1e1e3 1px visible [11, 40)
  - tab-2-t [text] at (700, 80) text "video-performance.xlsx" 13px weight 400 #2a2a2a
  - tab-3 [rect] at (920, 72) size 230x32 radius 7 fill #e4e4e7
  - tab-3-t [text] at (940, 80) text "leadership-review.pptx" 13px weight 400 #2a2a2a
  - divider [rect] at (550, 116) size 1x904 fill #ececea
  - c-date [text] at (140, 136) text "July 9 decision." 13px weight 400 #8a8a88
  - c-link1 [text] at (140, 160) text "Open the leadership review deck" 13px weight 400 #2b6fd6
  - c-link2 [text] at (140, 182) text "launch-plan-leadership-review.pptx (slide 1)" 13px weight 400 #2b6fd6
  - c-card [rect] at (140, 210) size 360x60 radius 8 fill #f6f6f5
  - c-card-t [text] at (154, 226) text "launch-plan-leadership...
Slides · PPTX" 12px weight 400 #4a4a48
  - c-body [text] at (140, 300) size 360x0 text "Use the template tool to turn this deck into a reusable template for future launch plans." 13px weight 400 #4a4a48
  - c-worked [text] at (140, 380) text "Worked for 5m 13s" 13px weight 400 #8a8a88
  - c-body2 [text] at (140, 406) size 360x0 text "Created the personal template Launch Plan Leadership Deck." 13px weight 400 #4a4a48
  - c-composer [rect] at (140, 910) size 370x60 radius 14 stroke #e2e2e0 1px
  - c-ph [text] at (158, 930) text "Ask for a follow-up change" 13px weight 400 #9c9c9a
  - doc-pane [group] at (570, 120) size 1240x900 visible [0, 11)
    - d-h [text] at (630, 160) text "Messaging" 26px weight 700 #1a1a1a
    - d1 [rect] at (630, 210) size 900x9 radius 4 fill #e6e6e4
    - d2 [rect] at (630, 230) size 860x9 radius 4 fill #e6e6e4
    - d3 [rect] at (630, 250) size 700x9 radius 4 fill #e6e6e4
    - d-h2 [text] at (630, 290) text "Message pillars" 16px weight 700 #1a1a1a
    - d4 [rect] at (630, 320) size 900x9 radius 4 fill #e6e6e4
    - d5 [rect] at (630, 340) size 820x9 radius 4 fill #e6e6e4
    - d6 [rect] at (630, 360) size 880x9 radius 4 fill #e6e6e4
    - d-h3 [text] at (630, 400) text "Asset readiness" 16px weight 700 #1a1a1a
    - d-table-head [rect] at (630, 430) size 900x26 fill #f1f1ef
    - d-table-cols [text] at (640, 435) text "Asset                     Owner                  Deadline        Status            Dependency" 12px weight 400 #4a4a48
    - t1 [rect] at (630, 464) size 900x1 fill #e6e6e4
    - t2 [rect] at (630, 492) size 900x1 fill #e6e6e4
    - t3 [rect] at (630, 520) size 900x1 fill #e6e6e4
    - t4 [rect] at (630, 548) size 900x1 fill #e6e6e4
    - t5 [rect] at (630, 576) size 900x1 fill #e6e6e4
    - t-rows [text] at (640, 470) text "Launch plan            Product lead          Jul 7              In progress       Brief and meeting decisions / Performance workbook  Analytics             Jul 7              Ready             Existing performance data / Reference deck          Launch lead           Jul 8              Ready             Plan and workbook / Recording               Studio                Jul 9              Scheduled        Reference deck + final captures" 11px weight 400 #4a4a48
  - sheet-pane [group] at (570, 120) size 1240x900 visible [15, 40)
    - s-colhead [rect] at (570, 160) size 1240x24 fill #f3f3f3
    - s-cols [text] at (630, 164) text "A                                                     B                                  C                              D                       E" 12px weight 400 #6f6f6d
    - s-rownums [rect] at (570, 184) size 40x836 fill #f3f3f3
    - s-nums [text] at (578, 194) text "1 / 2 / 3 / 4 / 5 / 6 / 7 / 8 / 9 / 10 / 11 / 12 / 13 / 14 / 15 / 16" 11px weight 400 #6f6f6d
    - s-title-hl [rect] at (610, 186) size 1200x54 fill #dbe7fb
    - s-title [text] at (630, 198) text "Launch video performance" 28px weight 600 #1a1a1a
    - s-sub [text] at (630, 248) text "Performance data from 250 prior launch videos" 12px weight 400 #6f6f6d
    - s-head [rect] at (610, 296) size 1200x30 fill #eaeaea
    - s-head-t [text] at (630, 304) text "Video                                          Format                 Channel       Runtime   Runtime band" 12px weight 700 #2a2a2a
    - s-rows [text] at (630, 336) text "Contract review highlights      Sizzle                  X               0:37       Under 60 sec / Hiring workflows team story      Customer story    Instagram    1:39       90-119 sec / Design systems launch reel        Sizzle                  YouTube      1:14       60-74 sec / Product feedback customer story  Customer story    LinkedIn      2:18       120+ sec / Support operations deep dive      Walkthrough        X               2:19       120+ sec / Knowledge search highlights       Sizzle                  LinkedIn      0:47       Under 60 sec / Inbox workflows announcement    Talking head        YouTube      1:16       75-89 sec / Product feedback highlights        Sizzle                  X               1:05       60-74 sec / Content production update           Talking head        YouTube      1:50       90-119 sec / Operations reviews launch reel    Sizzle                  YouTube      1:06       60-74 sec / Team permissions deep dive         Walkthrough        LinkedIn      2:49       120+ sec / Finance reporting highlights        Sizzle                  X               0:39       Under 60 sec" 12px weight 400 #2a2a2a
  - pip [rect] at (1580, 140) size 200x250 radius 10 fill #3a3d44
  - pip-head [ellipse] at (1645, 190) size 70x86 fill #6c7079
  - pip-body [rect] at (1615, 290) size 130x100 radius 28 fill #5a5e66
- pointer [cursor] at (790, 84) clicks at [10]
    keyframes tx: f16=0, f36=40 (inOut)
    keyframes ty: f16=0, f36=420 (inOut)

## Construction steps
1. Timeline 1920x1080 at 23.976 fps; Fusion composition 40 frames. Local 0 = master frame 1864.
2. Window 1700x960 at (110,60): 56 px chrome with three 230x32 tab pills at x=330, 570, 810; chat column 0-440; content pane from x=460.
3. Tab state: at frame 11 swap pill fills so tab 2 becomes white with a border and tab 1 becomes grey (#e4e4e7). Single-frame change.
4. Content: document group visible frames 0-10, nothing in the pane for frames 11-14, spreadsheet group from frame 15 (highlighted title row, subtitle, grey header row, 12 data rows at 34 px pitch).
5. Pointer: on tab 2 with a click ring at frame 10; from 16 to 36 ease it 40 px right and 420 px down into the sheet.
6. Easy mistake: skipping the blank frames; the four-frame white gap is what makes the switch read as a page load rather than an edit.

## Content variants
Default copy:
- tabA: launch-plan-working.docx
- tabB: video-performance.xlsx
- tabC: leadership-review.pptx
- docHeading: Messaging
- sheetTitle: Launch video performance
Adaptation changes:
- tabA: pricing-notes.docx
- tabB: renewals-2026.xlsx
- tabC: board-update.pptx
- docHeading: Positioning
- sheetTitle: Renewal cohort performance

## 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.