Frame from History of AI from the Transformer to AGI
PromptFull
You are a motion designer and creative director making a 3-minute animated short film,
built entirely in code and rendered to MP4.
The film

Title: "Attention Is All You Need → AGI"
The story of how a single 2017 paper led, step by step, to large language models, reasoning,
tool-using AI agents, and to the open question of AGI. It should feel like a cinematic essay,
not a slideshow or a timeline infographic. Think Kurzgesagt meets a Pixar opening sequence:
emotional, clever, precise.
Tech setup
Use Remotion (React). Scaffold a fresh project, 1920x1080, 30 fps, exactly 180 s (5400 frames).
One composition per scene, sequenced in a master composition.
No external image assets or stock footage: everything is drawn with SVG, Canvas, CSS and
code-generated particles and shapes. Google Fonts are fine.
Before building, write STORYBOARD.md with each scene's timing, visuals, on-screen text
and transitions. Then build scene by scene.

After each scene, render 3–4 stills (npx remotion still) and look at them critically.
Fix layout, overlaps, legibility and pacing before moving on.
Finish with npx remotion render to out/film.mp4. Leave an optional <Audio> slot for a
music track I can add later (public/music.mp3); render silently if it's missing.
Narrative spine / recurring motif
The protagonist is a single glowing token, the word "the", that travels through every era.
In 2017 it's a lonely point that suddenly "sees" every other word through attention lines.
Over time it gains a voice, senses (multimodality), reasoning, hands (tools) and finally
a question.
Scenes (approximate timing, you may rebalance)
0:00–0:15 — Cold open. Darkness. Words scattered like stars, disconnected. RNN-style
sequential processing: words light up one by one, slowly forgetting the earlier ones.
0:15–0:35 — June 2017, "Attention Is All You Need" (Vaswani et al., Google). Every word
connects to every other word at once. Attention lines bloom into a web. The title of the
paper appears as if typeset.
0:35–0:55 — 2018–2020: the rise of large language models: GPT-1, BERT, GPT-2, GPT-3.
Scaling laws: the web grows exponentially and the camera pulls back. The model starts
completing sentences, fluent and uncanny.
0:55–1:20 — 2022: instruction tuning and RLHF, then ChatGPT (Nov 30, 2022). The token gets
a chat bubble. A counter of users explodes. The world starts talking back.
1:20–1:40 — 2023: multimodality. Images, audio and code stream into the same web from all
sides, and the token gains "senses." Every modality becomes tokens flowing through the
same attention mechanism.
1:40–2:05 — 2024–2025: reasoning models. A visible chain of thought unfolds as branching,
pruning, backtracking paths. The model "thinks before it speaks," with time slowing down.

2:05–2:30 — Tool use and agents. The token grows hands: it calls a search, runs code,
opens files and orchestrates sub-agents. Many parallel threads work at once, and the
screen becomes a busy, beautiful workshop.
2:30–2:50 — Toward AGI. All motifs converge. The web from 2017 reappears but is now
planet-scale. Leave it ambiguous: no utopia, no doom. On screen: "Attention was all we
needed. What comes next is up to us." (Improve this line if you can do better.)
2:50–3:00 — Resolve back to a single glowing token in darkness. Title card and end.
Craft rules
Accuracy matters: use correct years, names and paper titles. If you're unsure about a
specific fact, leave it out rather than guess, and list any uncertain claims in NOTES.md.

Typography: max ~8 words on screen at once, and leave every text visible long enough to
read (≥ 2.5 s). Use one display font and one mono font for "model output."
Motion: use spring and easing curves, never linear. Use scene transitions that grow out of
the content (the web morphs, the camera zooms through a node), not generic fades.
Color: a deep dark background with one warm accent color that evolves across eras.
Details and easter eggs reward attention (e.g., real paper snippets, tiny UI details,
plausible model outputs), similar to high-craft motion design.
Pacing: alternate dense and calm moments, and give the reasoning scene and the AGI beat
room to breathe.
Work autonomously through the whole pipeline. When done, give me the path to the MP4, a
short summary of creative decisions, and NOTES.md.

Make it yours. Replace the title "Attention Is All You Need → AGI" and the timed scene list with your own story, and swap the recurring motif, "a single glowing token, the word "the"". The tech setup and craft rules carry over to any topic.

Make it hereFree runs soon

History of AI from the Transformer to AGI

A 3-minute animated essay on AI from the 2017 Transformer paper to the open question of AGI, following one glowing token through each era. Claude Code built it in Remotion from SVG and Canvas drawings, with open-source TTS and a Python-synthesized score.

“No stock footage, no image or video generators: every frame is rendered from code.”

You'll need

  • Node.js, for the Remotion project the prompt has the agent scaffold
How it was made

The creator says the film is about 7,400 lines of React and TypeScript in Remotion, with every image drawn in SVG and Canvas and no stock footage or image generators. The prompt asks for a silent render with an optional audio slot, but the posted film has a TTS voice and a score synthesized in Python; the creator doesn't say how those were added.

7% of the creator's weekly Claude plan usage.

Posted Sep 23, 2026 · X · 2.7k likes · 200k views · 160 comments

Prompt from: Reply in the thread

Prompt reply on X

Look notesby Reference

A dark, glowing animated essay that follows a small amber chip reading "the" through each era of AI, from the Transformer paper to a dotted globe.

Color
Near-black backgrounds with warm amber and gold glow as the main accent, cream paper for the 2017 paper, a pink-red glow in the multimodal scene, a red strawberry, and a blue globe near the end.
Type
Small amber monospace dates at top left ("JUNE 2017", "NOV 30, 2022", "20??"), monospace code ("def attention(q, k, v):"), and serif captions at the bottom with one italic amber word ("Now it thinks before it speaks.", "Then it picked up tools.").
Framing
Centered compositions with lots of dark space: a sentence with attention arcs, the paper's two pages floating at center, a particle sphere for GPT-3, a chat window, the token ringed by spokes, four tool panels around the token, and a globe with the token at its center.
Sound
An open-source TTS voice and a score synthesized in Python, according to the creator.
Structure
Scattered words and "The animal didn't cross the street because it was too tired", the June 2017 paper, GPT-3 as a sphere of particles, a ChatGPT window dated Nov 30, 2022, the token amid images, sound, and code, a reasoning scene counting the r's in "strawberry", tools (search, files, terminal, sub-agents), a globe dated "20??", and the token alone in the dark.

More like this

5:01

The Battle of Austerlitz, rendered in code

Claude Code · WebGL2

16:50

The CEO who escaped Japan in a box

Claude Code · Blender

5:53

Universe-scale documentary in Arabic

Claude Cowork

9:30

Chinese science film on the history of AI

Opus 5.5 · Remotion

14:20

History of the chip, from Edison to EUV

Opus 5.5

2:52

The Machine That Learned, a history of AI

Opus 5.5

2:00

250 years of America in sand animation

Claude Code · Python

13:23

Video essay on Madoka Magica episode 10

Claude Code · p5.js

11:16

Fern-style documentary on AI building AI

Claude Code

2:00

Space exploration as a documentary trailer

Opus 5.5

2:00

Ethereum history as a documentary trailer

Opus 5.5

3:37

A six-volume chronicle of Chinese history

Opus 5.5

3:43

Jewish history in under four minutes

Opus 5.5

7:40

Nature-doc parody of programmers migrating

Opus 5.5

4:07

Narrated film on the Voynich manuscript

Fable 5.1 · Python (skia-python)

5:15

Netflix-style doc on superintelligence

Claude Code

2:28

1942 Battle of Los Angeles as a newsreel

Opus 5.5

1:14

Battle of Dan-no-ura as a 3D battle map

Opus 5.5

3:38

Music video on AI fear-mongering

Prompt described · Claude Code · Remotion

1:16

Indian civilisation as a motion showreel

Claude Code · Three.js

0:48

3D promo for a travel-tracking app

Claude Code · Remotion

6:53

Code-drawn character in six art styles

Claude Code · HyperFrames

6:36

Toy theatre: an octopus sues the Moon

Partial prompt · Claude Code · Plain JavaScript

1:00

Artemis II flyby in mission-control style

Claude Code · HyperFrames

4:26

How AI coding agents actually work

Prompt described · Claude Code · Remotion

1:00

History of ice cream in newspaper cutouts

Opus 5.5

1:10

Why a circle's area is πr²

Manim

0:15

Vertical promo for a fan-made card site

Opus 5.5

2:30

Minimalist motion reel for a Mac notch app

Claude.ai

12:12

What is a Transformer, for high schoolers

Claude Code · Remotion