Setup
Pick a Claude plan and effort level, install HyperFrames or Remotion, and preview and render your first project.
Use Claude Code on a Pro plan, leave effort at the default medium, install the HyperFrames skills and check your machine with npx hyperframes doctor. That is enough for 1080p videos under a minute. Everything below explains when to change one of those choices.
Pick a Claude plan
Prices checked on 15 Oct 2026.
| Surface | Who can use it | Price | What you get |
|---|---|---|---|
| Claude Code (terminal, desktop app, IDE) | Pro, Max, Team, Enterprise | Pro 20 USD/month (17 USD/month billed yearly), Max from 100 USD/month | Full control: install skills, render on your computer, any length |
| Claude API (your own scripts or the Agent SDK) | Anyone with an API key | Opus 5.5: 4 USD per million input tokens, 20 USD per million output tokens, cache hits 0.20 USD | Pay per token, no plan limits |
| Claude Motion (claude.ai, "Output > Motion") | Team and Enterprise only, in beta | Team Standard 25 USD per seat/month (20 USD yearly), Premium 125 USD (100 USD yearly); Enterprise 20 USD per seat/month yearly, 20 seat minimum, plus usage at API rates | Short animated explainers exported as MP4; counts against plan usage |
My pick: start on Pro. Move to Max only when you hit the usage limit every week. Use the API when you run many builds from a script. One side by side test measured 21 to 29 million tokens per short video, about 4 USD each at API prices (luniacllama, single source).
Use Claude Code, not the chat app, for anything beyond a short explainer. The HyperFrames quickstart assumes a coding agent, and one user reports that the chat app now routes video requests into Claude Motion by default (musalbas, single source). On a subscription, a run that hits the usage limit pauses and resumes after the reset (Claude Code v2.1.271 or newer, interactive sessions only).
Effort levels
Opus 5.5 has five effort levels: low, medium, high, xhigh and max. The default is medium, and it is the right setting for most fixes. Anthropic's own guidance is to "reserve xhigh and max for work where you've measured a quality gain"; Opus 5.5 at medium matches or beats Opus 5 at high on coding evaluations.
Inside a running session, type /effort xhigh. To set it from the start:
# for one session
claude --effort xhigh
# or for every session, with an environment variable
export CLAUDE_CODE_EFFORT_LEVEL=mediummax lasts for the current session only. One director skill disagrees with Anthropic for new films and asks for xhigh or max on the first build. Our rule: try the first build of a new film at xhigh, compare it with a medium build if you can afford both, and do all later notes at medium.
Ultracode is not an effort level
Ultracode is a setting that makes Claude plan a workflow for every real task: a JavaScript script that runs many subagents in parallel. claude --effort ultracode turns it on and sets effort to xhigh. You can also type /effort ultracode, or put the word ultracode in one prompt to run just that task as a workflow.
| Workflow limit | Value |
|---|---|
| Agents running at once (default) | Up to 16 |
| Agents per run | Up to 1,000 |
| "Large workflow" warning | Above 25 agents or 1.5M projected tokens, except when ultracode is on |
| Default size on Pro | small (on other plans medium, under 10 agents) |
On video work it has not paid off. The same 15 second ad took 50 minutes at xhigh and 113 minutes with ultracode, at about 7 times the cost (nobunosuke_hori). Reports agree that long ultracode runs cost 7 to 30 times more with no shown quality gain. Keep it for long films split into chapters. The Iterate page lists more run costs.
Install HyperFrames
HyperFrames needs Node.js 22 or newer, FFmpeg and Chrome. The CLI can download Chrome for you.
Add the plugin to Claude Code
claude plugin marketplace add heygen-com/hyperframes
claude plugin install hyperframes@hyperframesThen turn on auto update for the marketplace in /plugin, Marketplaces. With the plugin, the router skill is /hyperframes:hyperframes.
Or install the skills into one project
# pick "Core Skills" when asked
npx skills add heygen-com/hyperframes
# non interactive: installs the core set from the current main branch
npx hyperframes skills update
# all 21 published skills
npx skills add heygen-com/hyperframes --allPick one of the two routes for a project.
Check your machine
npx hyperframes doctor # Node, FFmpeg, FFprobe and Chrome must pass
npx hyperframes browser ensure # only if Chrome is missingStart with the router
Type /hyperframes (or /hyperframes:hyperframes with the plugin) and describe the video. The router picks a workflow and installs it on first use.
The skills you get:
| Kind | Skills |
|---|---|
| Router | /hyperframes |
| Workflows | /product-launch-video, /faceless-explainer, /pr-to-video, /embedded-captions, /talking-head-recut, /motion-graphics, /music-to-video, /slideshow, /general-video, /remotion-to-hyperframes |
| Domain skills | /hyperframes-core, /hyperframes-animation, /hyperframes-keyframes, /hyperframes-creative, /hyperframes-cli, /hyperframes-audio, /hyperframes-registry, /media-use, /figma |
Claude Code loads a skill on its own when your request matches its description, or when you type its name. Personal skills live in ~/.claude/skills/, project skills in .claude/skills/, and plugin skills are named /plugin:skill.
Optional: the free HyperFrames Studio desktop app (Mac and Linux) adds an agent called Framey. You draw on a frame or leave a comment and the agent edits. Download it from hyperframes.dev/studio.
Install Remotion
npx create-video --yes --blank my-video
cd my-video
npx remotion skills add
npm run dev # Remotion Studio preview
# in a second terminal
cd my-video && claudeRemotion's Agent Skills page gives another route, npx skills add remotion-dev/skills. Use one route, not both. The skills include /remotion-best-practices, /remotion-create, /remotion-render, /remotion-captions, /remotion-studio and /remotion-saas.
Keep the render offline
One creator puts a setup checklist at the top of every prompt: check Node 22, FFmpeg and npx hyperframes doctor, and bundle GSAP and fonts locally because "the render must never hit the network". A blocked CDN is a common cause of failed renders.
Project structure
A HyperFrames workflow creates this layout. You mostly edit BRIEF.md, frame.md and the files in assets/; the agent writes the rest.
my-video/
BRIEF.md why, for whom, confirmed answers
STORYBOARD.md one entry per frame: outline, built, animated
frame.md design spec: palette, fonts, tone (brand truth)
index.html root composition: id, width, height, duration
compositions/
frames/01-hook.html one sub-composition per scene
assets/ logo.svg, screenshots, fonts, bgm.mp3, clips
hyperframes.json project settings
audiomap.json beats and phrases (music-to-video only)
storyboard.html optional sketch sheet for review
renders/ finished files, named by project, date and timeIn Remotion, src/Root.tsx registers each composition, components live in src/, assets in public/ (loaded with staticFile()), and renders go to out/.
Preview and render
Always look at a preview before a full render. The HyperFrames skills say it plainly: "Never render merely because checks pass."
npx hyperframes init my-video --resolution portrait # landscape, portrait, square, or *-4k
npx hyperframes capture https://example.com --json # start from a live site: screens, assets, colors
npx hyperframes lint # fast check while building
npx hyperframes check --snapshots # final gate: layout, motion, contrast
npx hyperframes snapshot --at 2.5,6,11 # stills at chosen seconds
npx hyperframes preview --background # Studio at http://localhost:3002
npx hyperframes render --quality draft --output review.mp4
npx hyperframes render --quality delivery --output final.mp4
npx hyperframes preview --stopQuality levels: draft for review copies, looks (the default, CRF 16), and delivery for the final file. Frame rate is 30 fps by default; --fps takes 24, 30 or 60. --workers auto runs several Chrome workers of about 256 MB each.
Long renders from the agent
A long render can outlive the agent's tool timeout, which kills Chrome. The HyperFrames CLI skill runs it detached:
bash -c 'set -m; HYPERFRAMES_RENDER_DETACHED=1 npx hyperframes render --output out.mp4 < /dev/null > render.log 2>&1 &'Read the second line of the render summary. beginframe capture is the fast path. screenshot capture with software gpu (common on Linux servers) is the slow path.
Same output on every machine
Add --docker to a HyperFrames render to get byte identical output across machines (Docker must be installed). Use it when a teammate or a server renders the final file, so a different local setup cannot change the result.
npx hyperframes render --docker --quality delivery --output final.mp4Hardware and render time
No vendor publishes a seconds per frame benchmark. These are the data points we found.
| Case | Machine | Time |
|---|---|---|
| HyperFrames clips of 5 to 8 seconds, 1080p, 30 fps | Cloud sandbox, 2 vCPU, 8 GB RAM | 17 to 27 seconds per render |
| 11 second HyperFrames sample | Vercel Sandbox, 4 vCPU | About 2 minutes cold; 3 workers about 2 times faster than 1 |
| 300 frames at 1080p, before and after removing one blur layer | Not stated | 25.0 seconds versus 9.8 seconds (HyperFrames docs) |
| 64 second launch film in 5 languages | Not stated | Each language "in under a minute" |
| Long Remotion explainer | Claude Desktop with Remotion | 35 minutes at about 5 frames per second |
| Remotion scene of 120 frames | Not stated | 700 seconds, versus under 21 seconds after moving to another renderer (author promotes his pick) |
Rules of thumb from the official docs:
- 60 fps doubles the frames and the render time.
- 4K is about 4 times slower per frame with files 3 to 5 times larger, and it only sharpens text, SVG and CSS, not a 1080p video inside the frame.
- Large
blur()orbackdrop-filterlayers, many shadows and oversized images are the usual slowdowns. - Transparent WebM encodes slowly; try
--vp9-cpu-used 2. - In Remotion, WebGL, canvas, shadows, gradients and blur are GPU work and crawl on cloud machines without a GPU. Replace static ones with a pre rendered image.
Our reading: any recent laptop with 16 GB of RAM handles 1080p at 30 fps for videos under a minute. Iterate with --quality draft and snapshots, and render the full film only at the end. Use the cloud only for long, 4K or batch jobs (Output covers cloud options).
Licenses
Prices checked on 15 Oct 2026.
| Tool | License | Cost |
|---|---|---|
| HyperFrames | Apache 2.0 | Free for everyone, commercial use included |
| Remotion, individuals and companies of up to 3 people | Remotion license | Free, commercial use included |
| Remotion Creators (companies of 4 or more) | Company license | 25 USD per seat per month |
| Remotion Automators | Company license | 0.01 USD per render, 100 USD per month minimum |
| Remotion Enterprise | Company license | From 500 USD per month |
Other open source tools you will see mentioned: video-use (MIT, footage editing with coding agents), fframes (MIT, a Rust renderer on the GPU), /brag (MIT, launch videos built on HyperFrames) and OpenMontage (AGPL-3.0, so read the license before you ship client work with it).
Sources
- Claude pricing, API pricing, Claude Motion help
- Model configuration, Workflows, Skills, Prompting Opus 5.5
- HyperFrames on GitHub, Quickstart, Rendering and output, Performance, Studio app
- Remotion with Claude Code, Remotion skills, Render CLI, Performance, License
- Render times: roo.beehiiv.com, Vercel template, mrcsvlk, mablesjoseph, iamashtonchew
- Offline setup checklist: mirze_mehdi