#02Showreel15sClaude Imagine
Kinetic type showreel
A variable-font wordmark, easing curves, shape morphs and a 3D point cloud in 15 seconds.
Inspired by @stephanlivera ↗Claude Opus 5.5 · HyperFrames · 30 remakes
Opus 5.5 video examples, rendered from code
We remade 30 of the most-shared Opus 5.5 videos in Claude Code, with Claude Opus 5.5 writing every animation and HyperFrames rendering it to MP4. Watch them below, make your own from the free templates in Claude Code, or send us your brief and we'll make one for you.
- Output
- 1080p, 60 fps MP4
- Length
- 10 to 46 seconds
- Video model
- None, it's code
Watch 30 Opus 5.5 video remakes
Each card credits the post that inspired it. Structure and pacing follow the original; the copy, brand and assets are ours. Fictional brands stand in for the original products, except where we used Claude Imagine.
#12Launch film15sClaude Imagine
Ember launch reel
Pain point to product in one take: a reply card, a logo ignition, a 3D model grid and a closing lockup.
Inspired by @robj3d3 ↗#16Launch film46sFictional brand
AI workspace launch film
Scattered tools collapse into a dot, then a product board, meeting notes, charted answers with sources, agents at work and stats.
Inspired by @moritzkremb ↗#23Ad15sFictional brand
Caption app promo
Before and after clips, a style picker in the hand, an edit that adds captions, b-roll and music, then four creators.
Inspired by @itsolelehmann ↗#05Launch film26sClaude Imagine
Startup launch in 26 seconds
Problem, reframe, proof, name and claim, told with counters, a dictionary card and a single mark.
Inspired by @deedydas ↗#21Product film40.5sFictional brand
Medical device product film
A monitor rises out of haze, then seven feature scenes with live screens, a scan line, a shield and a printout feeding out.
Inspired by @qwolfai ↗#08Launch film30sFictional brand
SaaS launch film
A blank page, an app tour, an editor with a rating panel, a calendar and a closing stat card.
Inspired by @DanielSmidstrup ↗#28Brand film28.5sFictional brand
Roof inspection brand film
A roof cutaway comes apart in layers, then three close-ups, photos pinned on a turning house, a report and a booking form.
Inspired by @everestchris6 ↗#13Launch film33sFictional brand
Self-planning calendar launch
A now-line grows a calendar, meetings pile up, a prompt replans the week in 3D, and tiles tessellate into the end card.
Inspired by @lexnlin ↗#27Launch film40sFictional brand
Document-to-explainer reel
A page of text flips into a book, a paragraph dissolves into a hand-drawn diagram, and a script rolls through 19 languages.
Inspired by @itisrazak ↗#09Product demo18sFictional brand
Mobile app launch with a mascot
An app icon that winks, seven phone screens, a dark-mode wipe and a waving mascot at the end.
Inspired by @likithareddy ↗#20Ad20sFictional brand
Keynote-style launch parody
A baguette revealed like a flagship phone: feature lines, a size counter, a macro close-up, a battery gag and the price.
Inspired by @raphaelaubryy ↗#10Product demo30sFictional brand
Warm paper product demo
A research modal, a spiking chart, an editor with a coach panel and tilted tutorial cards.
Inspired by @shownotover ↗#06Ad29sFictional brand
Photo print shop reel
A wordmark dot opens into a shutter, a photo grid, a relight slider and a lens, then the print lands framed on a wall.
Inspired by @twoclipping ↗#25Ad10sFictional brand
UGC-style lip gloss reel
Unboxing, the wand, a swatch, the gloss on the lips and a café table, cut like a handheld phone video.
Inspired by @aiwithmaha ↗#11Ad15sFictional brand
Synthwave app promo
Pixel type on camera cards, a 3D tunnel, a neon flyover, a phone feed and a 64-icon grid.
Inspired by @trymirage ↗#22Product demo20sFictional brand
Community map app reel
A button becomes a sign-up, a profile check and a dot that grows into a dotted globe, then matches, stats and an event.
Inspired by @verbove ↗#14Product demo15sFictional brand
Create once, publish everywhere
Channel icons orbit a video card, a composer posts it, and ten phones fill one by one as a counter reaches 10/10.
Inspired by @jackfriks ↗#24Ad15sFictional brand
One-time bundle promo
Twenty subscriptions pile up and swirl into a vortex, then tool slides, a 3D screenshot wall and a pay-once deal.
Inspired by @simonhoiberg ↗#26Explainer15sFictional brand
Pay-per-use vs Pro explainer
Job cards stack up on a receipt while the Pro price per job drops row by row, then features, the math and a checkout.
Inspired by @thayto_dev ↗#30Product demo20sFictional brand
Best-replies MCP promo
A wall of replies, an agent calling two tools, kept replies stamped, and the best one walking a red carpet.
Inspired by @robj3d3 ↗#04Showreel15sClaude Imagine
Showreel with depth
Kinetic type walls, a 3D prism field, a ticker and particles, drawn on a canvas.
Inspired by @shneural ↗#07Explainer15sClaude Imagine
Animation principles reel
A bouncing ball with onion skin, then bounce, stretch, spin and snap spelled out in motion.
Inspired by @himanshutwtxs ↗#03Showreel15sFictional brand
15-second résumé reel
A motion designer’s reel: transform handles, particles, color fields and a serif name card.
Inspired by @ajith_io ↗#01Launch film15sClaude Imagine
Paper launch film
Marker notes on a paper canvas, bouncing physics, hard light-to-dark cuts and a logo lockup.
Inspired by @ik_builds ↗#15Showreel15sFictional brand
Bauhaus motion reel
One dot through six techniques: squash and stretch, type, Bauhaus tiles, a sphere of dashes, metaballs and data.
Inspired by @condzxyz ↗#18Showreel15sFictional brand
Kinetic type with a running cat
A cut-paper title reel: a cat’s eye, a road run, a boiling starburst, extruded letters and scrolling title rows.
Inspired by @higgsfield_ai ↗#19Logo reveal21sClaude Imagine
Low-poly logo reveal
A wireframe draws itself, 65 facets fly in and land, a ring blooms, and the mark resolves into an app icon and wordmark.
Inspired by @tdinh_me ↗#17Product demo15sFictional brand
Vertical app update
A 9:16 tour of five new screens: a habit grid, a form with modes, a gauge, a cloud backup and a restore on a new phone.
Inspired by @SebastianRoehl ↗#29Product demo11.3sFictional brand
Habit app UI reel
One surface morphs from app icon to button, form, tab bar, stats card, widget and a check, in 11 seconds.
Inspired by @thednyx ↗How are videos made with Claude Opus 5.5?
Opus 5.5 doesn't output video. It writes code, and the code is the video. That is why the type stays crisp and the colors match the brand exactly. If you want footage-style clips from a prompt instead, see whether Claude can generate videos.
01 · Brief
You describe the scenes, timing and style, or hand Claude a reference video to rebuild.
02 · Code
Opus 5.5 writes an HTML composition: layout in CSS, motion in GSAP, particles and 3D on a canvas. Every frame is a function of time.
03 · Frames
HyperFrames opens the composition in headless Chrome and seeks it to each frame, so the render comes out the same every time.
04 · MP4
FFmpeg encodes the frames. Change a variable, such as the brand name or the accent color, and render again.
How to make an Opus 5.5 video in Claude Code
The fastest way is to start from one of the 30 templates above. They are free and MIT-licensed, and our Claude Code skill does the rest: it picks a template, writes the copy for your product, checks the frames and renders the MP4 on your machine.
1. Check your machine
HyperFrames, HeyGen's open-source HTML-to-video renderer (Apache-2.0), needs Node.js 22 or newer, FFmpeg and Chrome. The doctor command checks all three.
2. Install the skill
One clone puts the skill and all 30 templates in Claude Code's skills folder. The source is on GitHub.
3. Ask Claude Code for the video
Name a template by its number, or describe what the video has to do. Claude copies the template, fills in your name, copy and colors, checks the frames and renders the MP4.
4. Swap in your own photos
Six templates are built around photos. Use your own, or let Claude generate new ones through the Claude Imagine MCP; images use credits.
Remake a video that isn't here
This is the loop we used to build every template. Claude Code reads images, not video files, so turn the reference into contact sheets, one for every 24 seconds, attach all of them with a few full-size keyframes and paste the prompt below. Then render a draft, compare it with the reference at the same timestamps, and ask Claude to fix the biggest differences. Our remakes needed two to six rounds. At 1080p and 60 fps, a 15-second clip rendered in about 40 seconds on an M1 Pro laptop, and a 40-second one in under a minute and a half.
The Opus 5.5 animation prompt we start from
It isn't a one-shot prompt. It sets the rules that make the draft-and-compare loop converge. Change the size, length and style to fit your video.
Here are contact sheets (two frames per second, in order) and some full-size keyframes from a reference video. Rebuild it as a HyperFrames composition: - 1920x1080, 60 fps, same length and scene timing as the reference - Drive everything from one paused GSAP timeline: draw each frame from its time t, with no Math.random and no CSS animations - Put all copy, colors and the logo in data-composition-variables so the video can be rebranded - Load fonts from local files - Render a 30 fps draft, compare it with the reference at the same timestamps, and fix the biggest differences before the final 60 fps render
What an Opus 5.5 video can't do yet
- No sound
Every remake on this page is silent. Add music and sound effects in an editor after the render.
- No real footage
Code can move a photo, not the people in it. Six remakes here use photos we generated, moved with simulated camera work; for real motion, place clips from a video model inside the composition.
- Rarely one prompt
Matching a reference took us two to six rounds of render and compare. Expect to iterate on timing and layout.
- Licenses still apply
Fonts, images and music inside the video need their own licenses. We used open-licensed Google Fonts and our own images.
Need images or clips inside the video?
Motion graphics are code, but a launch video often needs a product shot, a background or a short clip. Claude Imagine adds image and video generation to Claude through MCP, so the Claude Code session that writes your animation can create those assets too. Six of the remakes are built around images we made that way: in the caption app promo, every phone screen is live code placed onto a generated photo. The ember launch reel uses stills from our image generator.
Full steps are on the MCP setup page. For clips, try the video generator; credits are listed on pricing.
Want an Opus 5.5 video made for you?
Send us the example you like, or a post you want remade, with your copy, colors and logo. We'll reply with a quote before any work starts.
Email us your brief- 1080p MP4 at 60 fps
10 to 46 seconds, like the examples on this page.
- Your brand in every variable
Name, copy, colors and logo.
- Any of the 30 styles, or your reference
Pick a card above or send a link to the video you want.
Opus 5.5 video FAQ
Can Claude Opus 5.5 make videos?
Not the way a video model does. Opus 5.5 outputs text and code. It makes videos by writing animation code that a renderer such as HyperFrames plays in a headless browser and encodes to MP4. For clips generated straight from a text prompt, use a video model; our video generator runs several of them.
Can Claude make motion graphics?
Yes, by writing them as code. Claude Opus 5.5 writes the layout, type and animation as an HTML composition, and a renderer such as HyperFrames turns it into an MP4. Every video on this page is Claude motion graphics made that way. For footage of real people or products, a video model is still the better tool.
What do I need to make an Opus 5.5 video?
Claude Code with access to Claude Opus 5.5, plus Node.js 22 or newer, FFmpeg and Chrome on your computer. HyperFrames installs from npm and renders locally, so nothing is uploaded to render a video.
How long does one video take?
Most remakes on this page took us 30 to 60 minutes of prompting, rendering and comparing; the ones built around photos, phone screens or 3D took a few hours. A final render at 1080p and 60 fps took about 40 seconds for a 15-second clip and under a minute and a half for a 40-second one, on an M1 Pro laptop.
Are these the original videos?
No. They are remakes inspired by the posts linked on each card. Structure and pacing follow the original; the copy, brands and assets are ours, with fictional brands in place of the original products except where we used Claude Imagine. The original videos belong to their creators.
Can I use one of these templates for my brand?
Yes. All 30 are free and MIT-licensed. Install our Claude Code skill from GitHub and ask Claude for a video; it fills in your copy and colors and renders the MP4 on your machine. If you would rather not run it yourself, send us a brief and we will quote a made-for-you version.
How much does it cost to make one yourself?
The templates, the skill and HyperFrames are free and open source. Your cost is the Claude usage needed to adapt a template or write a new one, which depends on your plan and on how many rounds you run. New photos or clips you generate with Claude Imagine use credits, listed on our pricing page.
Why not screen-record the animation in a browser?
A screen recording depends on your machine and can drop frames. HyperFrames seeks the composition to each exact time before it captures a frame, so every render comes out identical, frame for frame.