How it was made · 11 Oct 2026

models as insider risks: the build

The tools behind an 82-second motion graphic that breaks down Satya Nadella's essay on treating AI like a new staff member, from the source text to the final MP4.

Length82.5 s
Format1080×1080
Frames14
Tempo96 BPM
Render time31 s

In short: Claude Code ran the workflow, HyperFrames built and rendered the video, GarageBand played the music, and Mobbin supplied interface references.

1

source

Getting the full essay and filing it before anything was designed.

fxtwitter API (curl)Fetched the full X Article text, because x.com blocked direct fetching.
Obsidian vaultSaved the essay as a source with wiki pages. That text became the video's script material.
2

design research

Finding real interface patterns so the principle cards look like believable software, not clip-art.

Mobbin (MCP connector)Layout references from Revolut, n8n, Vanta, Klaviyo, AutoSend, incident.io and others. A background Sonnet agent ran the searches. It changed the core visual in about 5 of the 14 frames.
3

video framework

The system that turns a storyboard into timed, animated frames.

HyperFrames · faceless explainerBrief, storyboard, sketch sheet, frame-by-frame build, assembly and checks.
Broadside preset, remixedThe base look, recoloured to navy with green for "allowed", amber for "checking" and red for the off switch only.
GSAPThe animation engine inside each frame. Every reveal is timed to a beat of the music.
Barlow + IBM Plex MonoHeadline and interface fonts from Fontsource, embedded so the render works offline.
4

music

An original score, written as code so every cut lands on a bar line.

Python scriptWrote the score: 96 BPM, D minor resolving to D major, with a bell hit on each principle and a single stop hit at 1:03.75 for the off switch.
GarageBand + MCP bridgePlayed the score on real instruments (synth bass, pad, bell, piano, strings, drums) and exported the WAV.
ffmpegTrimmed the track to 82.5 s, added the fade-out and set loudness to −16 LUFS for social media.
HeyGen music libraryTried first. The track was only 30 s and untitled, so it could not be credited. Dropped
5

build

Writing the plan, then building all 14 frames at once.

Claude Code (Opus 5.5)Ran the whole workflow: brief, storyboard, plain-language rewrite, shot timings and the final fixes.
14 builder agentsOne per frame, working in parallel. Each turned its approved sketch into an animated frame.
6

quality checks

Catching problems before the render, not after.

HyperFrames lint · check · snapshotLayout, motion and contrast checks, plus contact sheets of every frame. 135/135 contrast pass
Claude's built-in browserReviewing the sketch sheet and the live Studio preview with music.
ffprobeConfirmed the final file: resolution, duration and that the audio is present.
7

output

The finished video and a record of how it was made.

HyperFrames renderProduced the 1080×1080 MP4, 13 MB, in 31 seconds.
GitCommitted the project source and score so the video can be rebuilt. The MP4 and WAV stay local.
Free or already installed

Claude Code, HyperFrames, GSAP, the fonts, Python, GarageBand, ffmpeg and Git.

Paid

Mobbin Pro plan, for the interface references.

Tried, not used

HeyGen music library, on a free plan.