# Flip a working timer to done, drop in a report heading, grow the bars, then autoscroll

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 IT Admins can manage ChatGPT Work at scale | OpenAI" (t8Ej9aeW388), published 2026-07-23.
Source interval [1266, 1346) on the 24000/1001 fps master: 80 frames, 3.336667 s. Local frame 0 = source frame 1266.
Create a 1920x1080 progressive timeline at 24000/1001 fps and a Fusion composition exactly 80 frames long. Keep integer frames; do not round the frame rate.
Background field: #0e0e11. Export silent H.264 yuv420p to match the intended playback container.

## Observation
A dark admin chat: an earlier bar list sits above a user bubble asking for spend per active user, followed by a grey 'Working for 44s' status and a thinking paragraph. At ~f12 the status flips to 'Worked for 45s', the thinking paragraph disappears and a bold heading with a one-line summary appears in its place (~f14-16). A dark card appears beneath (~f20) with three KPI tiles and five labelled bar rows whose orange and blue bars grow to their values (~f24-44). Between ~f50 and ~f66 the whole column scrolls upward so the table under the card comes into view; it holds to the end.

## Mechanism
Status flip from working to done, heading and summary replace the thinking text, a chart card populates with growing bars, then the transcript autoscrolls to reveal the rest.

## Phases (local frames)
- 0: Working timer and thinking text
- 12: Timer flips to Worked; heading and summary replace thinking
- 20: Card plate appears
- 24: KPI tiles fade in, bars grow
- 50: Autoscroll up 300px
- 66: Hold on table

## Layer inventory (absolute 1920x1080 top-left pixels, back to front)
- sidebar [rect] at (0, 0) size 260x1080 fill #141418
- sb1 [rect] at (24, 60) size 160x10 radius 5 fill #2a2a30
- sb2 [rect] at (24, 96) size 200x10 radius 5 fill #2a2a30
- sb3 [rect] at (24, 132) size 140x10 radius 5 fill #2a2a30
- sb4 [rect] at (24, 168) size 180x10 radius 5 fill #2a2a30
- sb5 [rect] at (24, 204) size 120x10 radius 5 fill #2a2a30
- column [group] at (400, 0) size 1160x1900
    keyframes y: f50=0, f66=-300 (inOut)
  - prev1 [rect] at (400, 40) size 900x6 radius 3 fill #3b6fd6
  - prev1b [rect] at (400, 52) size 620x6 radius 3 fill #e07a3f
  - prev2 [rect] at (400, 90) size 980x6 radius 3 fill #3b6fd6
  - prev2b [rect] at (400, 102) size 700x6 radius 3 fill #e07a3f
  - bubble [rect] at (760, 160) size 800x84 radius 18 fill #26262c
  - prompt [text] at (784, 180) size 752x0 text "Can we also compare weekly spend per active seat by team, and flag which teams are above the workspace average?" 17px weight 400 #ececef
  - status-working [text] at (400, 280) text "Working for 44s  ›" 16px weight 400 #8d8d96 visible [0, 12)
  - status-worked [text] at (400, 280) text "Worked for 45s  ›" 16px weight 400 #8d8d96 visible [12, 80)
  - thinking [text] at (400, 316) size 1100x0 text "I'll extend the existing view with a spend comparison using the same privacy-safe analytics subset. No extra credentials are needed; groups above the workspace average will be clearly marked." 17px weight 400 #b9b9c0 visible [0, 12)
  - thinking-l [text] at (400, 384) text "Thinking" 15px weight 400 #6f6f78 visible [0, 12)
  - heading [text] at (400, 318) text "Weekly seats and spend" 26px weight 700 #ffffff visible [14, 80)
      keyframes opacity: f14=0, f18=1
  - summary [text] at (400, 360) size 1120x0 text "Workspace average is $345 per active seat per week. Research, Revenue and Operations are above that benchmark; Research is highest at $390. Average weekly spend per team is $23.8K." 17px weight 400 #d6d6db visible [16, 80)
      keyframes opacity: f16=0, f22=1
  - card [group] at (400, 440) size 1160x560 radius 14 fill #15151a stroke #26262c 1px visible [20, 80)
    - k1 [rect] at (424, 464) size 356x90 radius 10 fill #1d1d23 visible [22, 80)
        keyframes opacity: f22=0, f28=1
    - k1v [text] at (444, 480) text "$345" 28px weight 700 #ffffff visible [22, 80)
        keyframes opacity: f22=0, f28=1
    - k1l [text] at (444, 522) text "Avg weekly spend / active seat" 13px weight 400 #8d8d96 visible [22, 80)
        keyframes opacity: f22=0, f28=1
    - k2 [rect] at (802, 464) size 356x90 radius 10 fill #1d1d23 visible [25, 80)
        keyframes opacity: f25=0, f31=1
    - k2v [text] at (822, 480) text "$23.8K" 28px weight 700 #ffffff visible [25, 80)
        keyframes opacity: f25=0, f31=1
    - k2l [text] at (822, 522) text "Avg weekly spend / team" 13px weight 400 #8d8d96 visible [25, 80)
        keyframes opacity: f25=0, f31=1
    - k3 [rect] at (1180, 464) size 356x90 radius 10 fill #1d1d23 visible [28, 80)
        keyframes opacity: f28=0, f34=1
    - k3v [text] at (1200, 480) text "3 of 5" 28px weight 700 #ffffff visible [28, 80)
        keyframes opacity: f28=0, f34=1
    - k3l [text] at (1200, 522) text "Teams above workspace average" 13px weight 400 #8d8d96 visible [28, 80)
        keyframes opacity: f28=0, f34=1
    - chart-h [text] at (424, 578) text "AVG WEEKLY SPEND PER ACTIVE SEAT · TEAM TOTAL AT RIGHT" 12px weight 600 #6f6f78
    - r1t [text] at (424, 612) text "Research" 16px weight 400 #ececef
    - r1v [text] at (640, 612) text "$390 / seat" 15px weight 400 #b9b9c0
    - r1bar [rect] at (640, 638) size 0x6 radius 3 fill #e07a3f
        keyframes w: f24=0, f44=720 (out)
    - r1d [text] at (1180, 612) size 200x0 text "+$45 vs avg" 14px weight 400 #e07a3f
    - r1tot [text] at (1440, 612) size 96x0 text "$24.6K" 15px weight 600 #ececef
    - r2t [text] at (424, 662) text "Revenue" 16px weight 400 #ececef
    - r2v [text] at (640, 662) text "$370 / seat" 15px weight 400 #b9b9c0
    - r2bar [rect] at (640, 688) size 0x6 radius 3 fill #e07a3f
        keyframes w: f26=0, f44=680 (out)
    - r2d [text] at (1180, 662) size 200x0 text "+$25 vs avg" 14px weight 400 #e07a3f
    - r2tot [text] at (1440, 662) size 96x0 text "$24.1K" 15px weight 600 #ececef
    - r3t [text] at (424, 712) text "Operations" 16px weight 400 #ececef
    - r3v [text] at (640, 712) text "$355 / seat" 15px weight 400 #b9b9c0
    - r3bar [rect] at (640, 738) size 0x6 radius 3 fill #e07a3f
        keyframes w: f28=0, f44=650 (out)
    - r3d [text] at (1180, 712) size 200x0 text "+$10 vs avg" 14px weight 400 #e07a3f
    - r3tot [text] at (1440, 712) size 96x0 text "$22.7K" 15px weight 600 #ececef
    - r4t [text] at (424, 762) text "Product" 16px weight 400 #ececef
    - r4v [text] at (640, 762) text "$330 / seat" 15px weight 400 #b9b9c0
    - r4bar [rect] at (640, 788) size 0x6 radius 3 fill #3b6fd6
        keyframes w: f30=0, f44=600 (out)
    - r4d [text] at (1180, 762) size 200x0 text "-$15 vs avg" 14px weight 400 #8d8d96
    - r4tot [text] at (1440, 762) size 96x0 text "$26.4K" 15px weight 600 #8d8d96
    - r5t [text] at (424, 812) text "Platform" 16px weight 400 #ececef
    - r5v [text] at (640, 812) text "$295 / seat" 15px weight 400 #b9b9c0
    - r5bar [rect] at (640, 838) size 0x6 radius 3 fill #3b6fd6
        keyframes w: f32=0, f44=540 (out)
    - r5d [text] at (1180, 812) size 200x0 text "-$50 vs avg" 14px weight 400 #8d8d96
    - r5tot [text] at (1440, 812) size 96x0 text "$23.3K" 15px weight 600 #8d8d96
    - avg-line [line] at (400, 440) stroke #55555e 1px
    - legend1 [rect] at (424, 870) size 10x10 radius 2 fill #e07a3f
    - legend1t [text] at (442, 866) text "Above workspace average" 13px weight 400 #8d8d96
    - legend2 [rect] at (640, 870) size 10x10 radius 2 fill #3b6fd6
    - legend2t [text] at (658, 866) text "Below workspace average" 13px weight 400 #8d8d96
    - table-h [text] at (424, 910) text "DAILY ACTIVITY LEADERS · RANKED BY TURNS" 12px weight 600 #6f6f78
    - trow1 [text] at (424, 940) text "Tue Jul 14        Platform        Arlo Moss           3.35M turns" 15px weight 400 #d6d6db
    - trow2 [text] at (424, 968) text "Wed Jul 15        Product          Tessa Cloud        3.54M turns" 15px weight 400 #d6d6db
  - table-cont1 [text] at (424, 1010) text "Thu Jul 16        Platform        Nova Finch          3.56M turns" 15px weight 400 #d6d6db visible [20, 80)
  - table-cont2 [text] at (424, 1038) text "Fri Jul 17          Research       Luna Reed           3.85M turns" 15px weight 400 #d6d6db visible [20, 80)
  - actions [text] at (424, 1080) text "⧉   ♡   ⤓" 16px weight 400 #6f6f78 visible [20, 80)

## Construction steps
1. Timeline 1920x1080 at 23.976 fps; Fusion composition 80 frames. Local 0 = master frame 1266.
2. Background #0e0e11 with a 260px darker sidebar of grey pill placeholders. Put every transcript element in one 'column' Transform at x 400 and key its Y 0 -> -300 px over frames 50-66 with ease in/out for the autoscroll.
3. Status: two Text+ nodes at y 280 - 'Working for 44s' visible to frame 12, 'Worked for 45s' from frame 12 (hard swap). The thinking paragraph and 'Thinking' label end at 12; heading fades in 14-18 and the summary 16-22.
4. Card: 1160x560 #15151a plate with 1px #26262c border from frame 20. Three KPI tiles fade in staggered 3 frames apart (22, 25, 28; each 6 frames long).
5. Bars: five 6px rounded rectangles at x 240; key Width 0 -> 720/680/650/600/540 starting at 24/26/28/30/32 and all ending at frame 44 with ease-out. Orange for above-average rows, blue for below; dashed average line at x 880.
6. Easy mistake: growing the bars from the right or after the scroll. They fill while the card is still in its original position; the scroll begins only when the bars are complete.

## Content variants
Default copy:
- prompt: Can we also compare weekly spend per active seat by team, and flag which teams are above the workspace average?
- working: Working for 44s
- worked: Worked for 45s
- thinking: I'll extend the existing view with a spend comparison using the same privacy-safe analytics subset. No extra credentials are needed; groups above the workspace average will be clearly marked.
- heading: Weekly seats and spend
- summary: Workspace average is $345 per active seat per week. Research, Revenue and Operations are above that benchmark; Research is highest at $390. Average weekly spend per team is $23.8K.
- kpi1: $345
- kpi1l: Avg weekly spend / active seat
- kpi2: $23.8K
- kpi2l: Avg weekly spend / team
- kpi3: 3 of 5
- kpi3l: Teams above workspace average
- t1: Research
- t2: Revenue
- t3: Operations
- t4: Product
- t5: Platform
- v1: $390 / seat
- v2: $370 / seat
- v3: $355 / seat
- v4: $330 / seat
- v5: $295 / seat
- d1: +$45 vs avg
- d2: +$25 vs avg
- d3: +$10 vs avg
- d4: -$15 vs avg
- d5: -$50 vs avg
- tableH: DAILY ACTIVITY LEADERS · RANKED BY TURNS
- row1: Tue Jul 14        Platform        Arlo Moss           3.35M turns
- row2: Wed Jul 15        Product          Tessa Cloud        3.54M turns
- row3: Thu Jul 16        Platform        Nova Finch          3.56M turns
- row4: Fri Jul 17          Research       Luna Reed           3.85M turns
Adaptation changes:
- prompt: Can we also compare monthly storage per active project by department, and flag departments above the org average?
- heading: Monthly projects and storage
- summary: Org average is 42 GB per active project per month. Design, Data and Video are above that benchmark; Video is highest at 61 GB. Average monthly storage per department is 3.1 TB.
- kpi1: 42 GB
- kpi1l: Avg storage / active project
- kpi2: 3.1 TB
- kpi2l: Avg storage / department
- kpi3: 3 of 5
- kpi3l: Departments above org average
- t1: Video
- t2: Design
- t3: Data
- t4: Marketing
- t5: Finance
- v1: 61 GB / project
- v2: 50 GB / project
- v3: 45 GB / project
- v4: 31 GB / project
- v5: 19 GB / project
- d1: +19 GB vs avg
- d2: +8 GB vs avg
- d3: +3 GB vs avg
- d4: -11 GB vs avg
- d5: -23 GB vs avg
- tableH: MONTHLY STORAGE LEADERS · RANKED BY GB
- row1: Jun                    Video             Kai Moreno          9.1 TB
- row2: Jul                     Design           Ines Barros          8.4 TB
- row3: Aug                   Video             Kai Moreno          9.6 TB
- row4: Sep                   Data               Ola Nwosu            7.9 TB

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