How to Make Videos and Motion Graphics with Claude Opus 5.5: The Complete Guide

By Ammar Ahamed, Founder, Cocoon · 16 October 2026 · Commands checked against official docs on 16 October 2026

Step 0: Choose your route

Every route works the same way underneath. Claude writes an animation as code, something renders it frame by frame, and you get an MP4. What changes is how much setup you do and how much control you get.

Our recommendation: if your company is on a Team plan, start with Claude Motion for internal videos. For anything public, or if you are on Pro or Max, use HyperFrames.

What you need before you start

• A paid Claude plan. Claude Code needs Pro, Max, Team, Enterprise or a Console account. Claude Motion needs Team or Enterprise.
• Your assets. Logo (SVG or PNG), brand colours as hex codes, font files, product screenshots, and the one message the video must land.
• One or two reference videos. A specific video whose style you want. This matters more than any other input. Browse our gallery for ideas.
• For Claude Code routes: Node.js 22 or later and FFmpeg installed on your computer.

Route 1: Make a video with Claude Motion

Claude Motion is a beta artifact type Anthropic launched on 8 October 2026. It is on by default for Team plans. On Enterprise, an owner switches it on under Organization settings > Artifacts. It is not available on Free, Pro or Max.

1. Start it. Ask for an animation in any chat, select Output in the message box and choose Motion, or open the Artifacts tab and pick a Motion template.
2. Brief it. Say who will watch, where it will play and roughly how long it should be, and attach the report, data or images to use. For example: “Turn this quarterly report into a 30-second explainer for our all-hands.”
3. Edit it. Ask in chat (“slow down the second scene”, “change the Q3 number to 18%”) or edit directly in the editor. Because it is code, everything else stays put.
4. Export it. Click Export and choose MP4. Or hand it off to Adobe, Descript, HeyGen, Higgsfield, invideo, Luma AI or Runway to add footage, sound or edits. Canva and Captions were announced as coming soon.

Motion does not generate footage or realistic people; it animates your text, charts, shapes and images. Longer animations use more of your plan’s usage. For the full picture, read our guide to Claude Dashboards and Claude Motion.

Route 2: Claude Code + HyperFrames (recommended)

HyperFrames is a free, open-source framework from HeyGen that turns HTML into video. It is the tool we saw most often behind the best Opus 5.5 videos.

1. Install Claude Code

On macOS, Linux or WSL:

On Windows PowerShell:

Prefer an app? Download the Claude desktop app from claude.com/download and use its Code tab. Check the install with claude --version.

2. Select Opus 5.5

Opus 5.5 needs Claude Code version 2.1.280 or later, so run claude update first. Then start a session in an empty project folder:

3. Install the HyperFrames plugin

Start a new session (or run /reload-plugins) so the skills load.

4. Ask for your video

Invoke the skill and describe the video. HeyGen’s own quickstart prompt is a good first test:

Claude proposes a direction, builds the project and opens a local preview. HyperFrames also includes ready-made workflows you can call directly, such as /product-launch-video, /faceless-explainer, /motion-graphics and /embedded-captions.

5. Review, check and render

Useful options: --fps 60 for smoother motion, --resolution 4k for 4K, and --format webm or mov for transparent overlays. The aspect ratio comes from the composition size, so ask Claude for 1080×1920 for vertical video or 1920×1080 for landscape.

Route 3: Claude Code + Remotion

Remotion makes videos with React and has an official Claude Code plugin. Choose it if your team already works in React or you want templates you can feed with data. It is free for individuals and companies of up to three people; larger companies need a company licence.

Restart Claude Code, start a session in your project folder and use the remotion-create skill with your brief. To set a project up by hand instead:

Preview in Remotion Studio, then render:

Captions come from @remotion/captions, which can take transcripts from Whisper or ElevenLabs.

Route 4: The no-framework pipeline

This is how many viral launch-week videos were made. Opus 5.5 often chooses it on its own, even when a framework is installed. The idea is simple: one HTML page exposes a function that draws the exact frame for any time t.

1. Animation: an index.html with a draw(t) or seek(t) function. No timers, no CSS transitions, no Math.random(), so every frame is reproducible.
2. Capture: Playwright opens the page in headless Chrome, waits for document.fonts.ready, then calls draw(t) and screenshots each frame. A 50-second video at 30fps is 1,500 frames.
3. Encode: ffmpeg stitches the frames into an MP4:

You do not need to write any of this yourself. Paste this into Claude Code:

A contact sheet lets you, and Claude, review the whole video at a glance:

No Claude Code? You still have options

• Animated artifact plus a screen recording. On any plan, ask Claude for an HTML animation in an artifact, play it full screen and record it with your computer’s screen recorder. It is not frame-perfect, but fine for a social post.
• Higgsfield in Claude. Add Higgsfield as a custom connector using https://mcp.higgsfield.ai/mcp to generate footage and produce editable After Effects and Blender files. It needs a paid Higgsfield plan.

Write a brief that actually works

The short “showreel” prompt that went viral is a fun test. Real work needs a brief. After reviewing the 132 videos in our gallery, the good ones nearly always had seven things:

1. Audience and goal: who watches, and what they should do next.
2. One message: the single idea, in a sentence.
3. Format: length, aspect ratio, resolution, frame rate.
4. Reference: a specific video or frame to match. Without one, Opus defaults to centred text on a gradient.
5. Brand: colours, fonts, logo, and real screenshots with “never redraw the product UI”.
6. Structure and rhythm: open on the result, then beats of 2 to 5 seconds, on a tempo such as 120 BPM.
7. Process: storyboards first, stills next, render last.

Template: product launch film

Template: explainer from a document

Template: weekly social clip

Storyboard, stills, then director’s notes

The fastest way to a great result is to slow down at the start:

1. Three storyboards. Pick one, or combine two.
2. One still per scene. Approve the look before any animation exists. Changing a still costs seconds; changing a render costs minutes.
3. First render with self-critique. Ask Claude to make a contact sheet and check its own frames for overlapping or clipped text before showing you.
4. Director’s notes. Be specific and visual: “slow every zoom to 0.7x”, “hold the logo half a second longer”, “cut on the kick drum”. Avoid “make it better”.

Voiceover, music and captions

Voiceover

ElevenLabs has a hosted MCP server. Add it to Claude Code, then run /mcp in a session to sign in:

HyperFrames can also create voiceover with HeyGen, ElevenLabs or Kokoro, a free model that runs on your computer.

Music

• Synthesised in code: free and fully yours. Ask Claude to compose a simple music bed in Python on the same beat grid as your cuts.
• ElevenLabs Music through the same MCP connector.
• Suno: songs made on a Pro or Premier plan can be used commercially; songs made on the free plan cannot.
• Licensed tracks: check each licence for the platform you are posting to.

Loudness

Mix to around -14 LUFS, the level Spotify normalises to and a common target for social video:

Captions

Most social video plays on mute, so burn in captions. HyperFrames can transcribe audio with npx hyperframes transcribe and has an /embedded-captions workflow; Remotion uses @remotion/captions. LinkedIn video ads require SRT captions.

Export settings by platform

Render each aspect ratio as its own layout rather than cropping one video. Here are current recommendations from each platform’s help pages:

Effort, time and cost

Opus 5.5 has five effort levels: low, medium (the default), high, xhigh and max. Anthropic’s advice is to start at medium and only go higher where you can see a gain. For video, a sensible pattern is:

In the Claude app, use the effort selector next to the model name. As for cost, one creator reported about $3 in API costs and 18 minutes of agent time for a polished 60-second reel. Another found a first render used 11% of a subscription’s session limit, rising to 18% after a revision. Ambitious films with long briefs have taken many hours of agent work.

Troubleshooting

A weekly video workflow for marketing teams

Here is the rhythm we teach teams who want video every week without an agency:

• Monday: pick one story, such as a product update, a customer number or an event, and write the seven-point brief.
• Tuesday: storyboards and stills. One person approves.
• Wednesday: render, director’s notes, final cut in 16:9, 4:5 and 9:16.
• Thursday: publish with captions; save the brief and the project as a template.
• Every month: update your house style file with what worked. That file is what makes video number ten much better than video number one.

For a Colombo or Singapore marketing team, this turns video from a quarterly agency project into a weekly habit. The skill that matters is no longer After Effects; it is writing a clear brief and giving good notes.

Frequently asked questions

Sources

1. Claude Code docs. Set up Claude Code and model and effort configuration.
2. Claude Help Center. Get started with Claude Motion.
3. Anthropic. Dashboards and Motion.
4. Anthropic. Prompting Claude Opus 5.5.
5. HeyGen. HyperFrames on GitHub, quickstart and rendering guide.
6. Remotion. Claude Code plugin, coding agents and licence.
7. ElevenLabs. ElevenLabs MCP.
8. Higgsfield. Higgsfield MCP.
9. Suno. Commercial use rights.
10. Spotify. Loudness normalisation.
11. LinkedIn. Video specs and video ad specs.
12. YouTube. Recommended upload settings and Shorts length.
13. X. Videos on X.
14. Ray Fu. Build a motion design studio with Opus 5.5.
15. claudevideo.org. HTML animation to MP4.
16. HELDER. Claude Opus 5.5 motion graphics. No Code MBA. Claude Opus 5.5 motion graphics.