Motion reel
Five films, seventy seconds
Each one is fourteen seconds and makes a single argument. They share a tempo and a master level, so they also play as one continuous reel.
Rendered, not recorded
None of these were shot or edited in a timeline. Each is a web page exposing one function, setFrame(n), which makes every frame a pure function of its index — no requestAnimationFrame, no CSS transitions, no wall clock. A headless browser steps the frames and screenshots each one; ffmpeg assembles at 60fps. Because frame n never depends on how the renderer got there, a re-render is byte-identical and one bad shot can be redone without re-exporting the film.
Everything is locked to 120 BPM, so each cut, entrance and number lands on a beat and the scores were generated at the same tempo. The sound design is synthesised the same way the picture is — oscillators, envelopes and filters written straight to a WAV in Node, nothing sampled, so a cue is re-tuned by changing a number.
One argument each
01Same Job, Every Time
Full historyNine roles, four industries, one job description.
Fig. 01 — Nine roles, four industries, one job description.
Text alternative: “Same Job, Every Time”14s
A spine runs along the bottom of the frame for the whole film, carrying a tick for every one of nine roles; the five the film stops at are the tall ones. A playhead travels it from 2012 to 2026 while a counter reads the years.
2012 — Ericsson · Schmid Telecom. Engineer, Telecom/RF. A mast emitting rings, one of them broken. Routers, gateways, 3am outages. 2015 — IIT Delhi. A national housing portal for the Ministry of Rural Development: a region is drawn on a map and every point inside it resolves.
2019 — Foyr. A bidirectional bridge between a Vue panel and a Three.js canvas, values crossing in both directions. 100K+ designers, 30+ countries, ~30% faster 3D model loads. 2022 — SigFig. Modules stacking onto a shared core, consumed by every banking partner. −45% load time, −30% build time, +40% faster partner onboarding.
2025 — Publicis Sapient · Goodyear. One foundation fanning out to five brand shells across twelve locales, with a GraphQL proxy keeping credentials server-side. The film closes on a full-bleed card: The job never did.
02The Part Underneath
All skillsFive things, each with the proof attached.
Fig. 02 — Five things, each with the proof attached.
Text alternative: “The Part Underneath”14s
Five domains, each with a diagram that a selection bracket walks through, naming each part as it lands. A cross-section strip along the bottom gains a layer per domain and keeps that domain's headline number.
Architecture. An NX monorepo core feeding five brand shells across twelve locales; a GraphQL proxy holds the credentials server-side and React Query SSR hydrates. Design systems. Atoms, molecules and organisms assembling in three linked tiers — built from scratch, twice, cutting delivery time 20% across the team.
Performance. Three bars shrinking against their original length: −45% application load, −30% build time, +40% faster partner onboarding. Accessibility.A focus ring walking a form, and the site's own accent on white measuring 5.18:1 — WCAG 2.1 AA as a build constraint, not a cleanup pass.
The AI layer. A model, a guarded MCP server and a system, with typed calls flowing both ways: 2 MCP servers, 4 agents running unattended, 12+ custom skills. It closes on Nobody sees it. Everybody stands on it.
03Receipts
Track recordFourteen numbers. All of them checkable.
Fig. 03 — Fourteen numbers. All of them checkable.
Text alternative: “Receipts”14s
Fourteen figures land one at a time, accelerating — the first four hold two beats each, the middle six a beat and a half, the last four a single beat — while a column on the right accumulates everything already shown.
100K+ designers on the 3D platform; 30+ countries; 5 brands × 12 locales on one monorepo; −45% application load time; −35% landing-page drop-off; −30% build time after the Vite migration; +40% faster partner onboarding; +35% merchant engagement; +50% template adaptability; −20% delivery time via a shared component library; 2 MCP servers; 4 agents running unattended; 6,563 questions authored and validated by one of them; 100 Lighthouse accessibility on this site.
It closes on the only claim that matters: every one of these is on the site, next to the work it came from.
04The Constraint Picks the Stack
All projectsSix projects. Six answers.
Fig. 04 — Six projects. Six answers.
Text alternative: “The Constraint Picks the Stack”14s
Six projects, each given its constraint first; the stack then resolves out of it as chips flying in one at a time. The order is the argument — a logo wall says “I have used these”, constraint-then-stack says “this is what forced the choice”.
Goodyear · Publicis Sapient — five brands, twelve locales, and credentials that must never reach the client → Next.js 15, NX, a GraphQL proxy, React Query SSR. Digital Wealth · SigFig — regulated fintech consumed by every banking partner → React, TypeScript, Vite, React Hook Form, Jest/RTL, CI/CD.
Neo · Foyr — real-time 3D in a browser, two-way with the engine → Vue, Nuxt, Vuex, Three.js, WebSockets. Prodport · CoreValue — one product, twelve languages → React, Redux, react-intl, Material UI. QuizKode — content at a scale a human cannot author by hand → Next.js, Supabase, Tailwind, LLM workflows. RHKN · IIT Delhi — resolve every point inside a drawn region → Python, Flask, MongoDB, Maps API.
It closes on Same question: what does this actually have to survive?
05The Right To Be Told No
AI & agentic systemsA model asks for something it should not get.
Fig. 05 — A model asks for something it should not get.
Text alternative: “The Right To Be Told No”14s
A new consumer arrives, and it wants the database. The boundary draws: a model, an MCP server holding the guardrails, and the system behind it. The model never holds a credential — the secrets stay server-side.
What it gets instead is a typed contract: tools/list, tools/call, typed arguments, a bounded result, masked columns, a row cap. Same as every consumer before it.
The first request, SELECT id, total FROM invoices, is allowed — parsed to an AST, not matched with a regex. The second, DELETE FROM invoices, types in and everything stops. A full second of silence, then a full-bleed card: REFUSED.
The reason follows as an AST: four statement types branch from the root and only SELECT is lit; INSERT, UPDATE and DELETE are struck through. The film closes on Not a crash. A decision.
All five, back to back
Because they share a grid and a loudness target, the five concatenate without re-grading — no level jump and no tempo shift across the cuts.
Fig. — 70 seconds, five arguments, one continuous grid
Text alternative: “The full reel”70s
All five films in sequence: Same Job, Every Time (career), The Part Underneath (expertise), Receipts (measured results), The Constraint Picks the Stack (project decisions) and The Right To Be Told No (the AI layer). Each is described in full above.
The work behind the numbers
Every figure in these films is on this site, next to the project it came from.