Beat-synced Opus 5.5 motion graphics, with the model explaining its own pipeline (X video, Japanese)
妖精アーヤ (@aiehon_aya) · 2026-09-25 · ai-made · 222,788 views
Made by AI
Model: Claude Opus 5.5 · Series: Code-rendered film (LLM writes the program that draws every frame)
Evidence: X post (2026-09-25): 'Claude Opus5.5 モーショングラフィックス / ──────────────────── / 天才Opus5.5にどうやって作ったのか / 説明させてみた(↓) / ───────── / ■ 全体の流れ / index.html(絵を描くプログラム) / ↓ 1コマずつ描かせる / render .py(900コマを撮って動画ファイルにする) / ↓ / make_audio.py(音楽を計算で作る) / ↓ / 合体して MP4 / ① すべてを「拍」で決めている / いちばん大事な考え方です。テンポを 128BPM にすると、32拍でちょうど15秒になります。「4拍目で MOVE が出る」「28拍目で爆発」のように、映像の出来事をすべて拍の番号で書いています。音楽も同じ拍の番号で鳴らしています。だから、映像と音がずれる余地がありません。手作業のタイミング合わせは一度もしていません / ② 動きは「イージング(緩…'
Human role: Creator prompted the piece and asked Opus 5.5 to explain how it was built; the explanation is in the post.
Pipeline: index.html draws frames → render.py captures 900 frames → make_audio.py synthesizes the music at 128 BPM → muxed to MP4 (per the model's own explanation quoted by the creator)
What's in the video
Description written by Gemini, which watched and listened to the whole video.
Summary
This video is a fast-paced, beat-synchronized motion design showreel titled "Claude / Motion Reel 08," showcasing generative, code-based vector animations and typography. Created with Claude Opus 5.5 and shared by account 妖精アーヤ (@aiehon_aya), the reel visually demonstrates fundamental animation concepts such as kinetic type, cubic-bezier easing, shape morphing, and physics systems.
What is shown
- [00:00] Intro slate with technical HUD framing:
CLAUDE / MOTION REEL 08,1000×1000 | 60FPS - 100BPM. - [00:01] Title screen displaying
[SHOWREEL] VOL.26andMOTIONwith the subtitleDESIGNED IN CODE - FRAME BY FRAME. - [00:02 - 00:03] Section
01 - KINETIC TYPE, animating the wordsSHAPE(with repeating outline echoes) andRHYTHM(with horizontal chromatic blur slicing). - [00:04 - 00:05] Section
02 - SHAPE MORPH, showing orbiting particles around a rotating red square morphing into a central white circle, annotated withVERTICES 040 / EASE EXPO. - [00:06 - 00:07] Section
03 - DIMENSION, featuring a neon wireframe tunnel zooming intoDEPTHandZ-SPACE 00000, followed by a VHS glitch transition. - [00:08] Section
04 - TIMING, presenting an animated motion-design GUI graph editor with an S-curve plot (cubic-bezier(0.70, 0.00, 0.20, 1.00)), bar graph stagger, and timing dials. - [00:09 - 00:10] Section
05 - SYSTEMS, displaying a 4-quadrant layout demonstrating four generative animation techniques simultaneously:- Waveform (stacked frequency line plot reminiscent of pulsar waves)
- Squash & Stretch (bouncing ball physics)
- Seamless Loop (scrolling typography array)
- Metaballs (blending organic gradient blobs)
- [00:11 - 00:12] Rapid montage cuts highlighting graphic motion fundamentals:
DESIGNcentered on an expanding star andEASINGon a lime background. - [00:13 - 00:14] Section
07 - SIGNATURE, featuring an expanding multi-colored particle field closing on a blue title card:CLAUDEwithMOTION DESIGNER — SHOWREEL.
Claims & numbers
- Format specifications listed on the HUD: resolution
1000×1000, frame rate60FPS, tempo100BPM(on-screen text at [00:00]). - Easing parameters displayed:
cubic-bezier(0.70, 0.00, 0.20, 1.00)(on-screen text at [00:08]). - Polygon attributes listed:
VERTICES 040 / EASE EXPO(on-screen text at [00:04] and [00:05]). - Duration indicator displayed:
01.40s / 03.50s(on-screen text at [00:08]).
Notable quotes
There is no spoken narration; notable on-screen title text includes:
- [00:01] "DESIGNED IN CODE — FRAME BY FRAME"
- [00:08] "GRAPH EDITOR — VALUE / TIME"
- [00:14] "CLAUDE / MOTION DESIGNER — SHOWREEL"
Assessment
This is a generative creative demo illustrating programmatic motion design and kinetic typography generated via Claude Opus 5.5 code output. Visuals and audio cues are cleanly synchronized to an electronic breakbeat, demonstrating precise mathematical easing and layout execution without rendering artifacts.
Lyrics & themes
- Music & Sound: Completely instrumental, driven by high-energy breakbeats, rhythmic glitches, riser sweeps, and synthetic percussive hits.
- Themes: The progression deconstructs the foundational vocabulary of motion graphics design—type, shape, dimension, timing/easing curves, physics simulations, and loop systems—framed as a portfolio showreel for Claude as an autonomous motion designer.
Lore & references
- Claude as Motion Designer: The recurring branding (
CLAUDE / MOTION REEL 08andCLAUDE / MOTION DESIGNER) references the trend of leveraging frontier LLMs to write raw HTML5 canvas, SVG, CSS, or WebGL animation scripts. - Graphic Design & Science Homages: The "Waveform" panel at [00:10] directly references the iconic CP1919 pulsar radio wave visualization made famous by Joy Division's Unknown Pleasures.
- Disney & Classic Animation Principles: "Squash & Stretch" and "Easing" explicitly quote classic animation fundamentals codified by traditional animators and web motion standards.
Visual style & craft
- Aesthetic: Minimalist Swiss-style graphic design combined with technical camera viewfinder HUDs, dynamic typography, neon accents, and crisp vector shapes.
- Technique: Rendered from code-driven vector mathematics (pure geometry, bezier easing curves, particle emitters, and CSS/canvas transformations), tightly cut and synchronized to the musical transients.
Described by gemini-3.8-flash on 2026-10-05 from the video's audio and frames.