Your story starts here
STEP 01
Drop in your content
An article, a script, a spark of an idea. Start with the words you already have.
CLAUDE MOTION SKILLS · FOR CLAUDE CODE & CODEX
Claude Motion:
turn any article into motion.
ARTICLE → SCRIPT → NOTES → IDEA → YOUR NEXT VIDEO
A story worth sharing. A look that feels like you. Turn your words into an animated video, with the agent you already use.
CLAUDE MOTION SKILLSA STUDY IN MOVEMENT ↗
✳
FROM A SINGLE IDEAMake something
worth watching.
worth watching.
Words. Rhythm. A new perspective.
ORIGINAL MOTION STUDY
HTML → MOTIONWORKS WITH
✳ Claude Code CodexOpenCodeCursorKimiAnd your favorite agent
Right inside the tools you love.
Claude Code · Workflow preview
CLAUDE CODE
Open the starter kit folder. Read SKILL.md, then help me turn my script into a polished motion video. Keep the wording and numbers accurate. Preview the composition before rendering.
Create a project and download its starter kit first. Then open the folder in your agent.
HOW IT WORKS
Three steps. One good story.
Bring your content. Pick your direction. Give your story the movement it deserves.
Make it your own
STEP 02
Choose a visual style
Bold typography, quiet keynotes, paper collage. Find the right feel for your story.
Ready when you are
STEP 03
Preview, refine, share
Edit your storyboard, preview the motion, and take the whole project with you.
MOTION · BUILT ON HYPERFRAMES
HTML in. A moving story out.
An open canvas, a precise timeline, and a project you can keep.
YOUR COMPOSITION
Small ideas.
Beautifully told.
Your agentBeautifully told.
Your headline · Scene 01
Layers & motion
The story, word by word
Add your own audio
Readable by design
Editable HTML. Every word, color and moment is yours.
Made for iteration
Refine the same composition in your coding agent.
Keep the whole project
Download source files and render locally with HyperFrames.
Your own creative partner
Works with the coding tools you already know.
Powered by the open-source HyperFrames engine by HeyGen (Apache-2.0). Independently built.
FROM DRAFT TO DONE
Everything your story needs.
Start simple. Make it personal. Keep the creative control.
Make it move.
TYPE ↗Kinetic typography
Words that land with a little more feeling.
A clear perspective.
VISUALS ↗Visual storytelling
Make an idea easier to see and understand.
Scene 01 → 02
STORY ↗Editable storyboards
Adjust the order, copy and pace of every scene.
Your next story.
WORKSPACE ↗A workspace of your own
Keep local drafts or save projects to your account.
Ready to share.
SHARE ↗Share a preview
Create a public link when you are ready.
From HTML to MP4.
EXPORT ↗Local video export
Take the source kit from HTML to MP4 on your computer.
CLAUDE CODE / CODEX
Your agent. Your creative process.
Make a first draft here, then open the project in your coding agent. Describe the changes you want: a slower reveal, a stronger opening, a different rhythm. Every project stays editable.
| START HERE | CONTINUE LOCALLY |
|---|---|
| Article or script | Your coding agent |
| Editable scenes | Refined motion design |
| Animated HTML preview | MP4 via HyperFrames |
| Free beta workspace | Your own tools & plan |
MOTION STYLES
Choose your visual language.
Find a look that feels like you. Start with an editable template, or explore skills from the community.
24 styles & resources
Editable template · Free
Editable template · Free
Editable template · Free
Editable template · Free
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Community skill · View source
Browse freely. Nothing installs until you choose.
Match and createBUILT FOR
For people with something to say.
Creators
Make the next story your audience saves.
Educators
Give complicated ideas a clear visual form.
Indie makers
Show what makes your product different.
Storytellers
Find a new rhythm for the words you love.
PRICING
A simple place to start.
Free during beta. No credit card, no subscription.
FOR EVERY CREATOR
Creator
$0 during beta
Your ideas, your agent, your next video.
- All four editable starter templates
- Unlimited local projects
- HTML, JSON & local rendering kit
- Cloud project saving with an account
- Optional public share links
ON THE ROADMAP
Studio
Coming later
More ways to bring your stories to life.
- Hosted voiceover generation
- Expanded template collections
- Collaboration and brand kits
- More publishing options
No payments or subscriptions are collected.
FAQ
A few good questions.
Is this an official Anthropic product?+
No. Claude Motion Skills is independently operated. The names Claude Code and Codex describe compatible tools, not an affiliation.
What can I make here?+
Create an editable storyboard from your article or script, preview an animated HTML composition, and download a project kit for local video rendering.
Do I need an AI subscription?+
The browser storyboard and templates work without AI. To refine the result with a coding agent, use your own agent and its plan. We do not include model credits.
Is it free?+
The current beta is free. We do not collect payments, and there is no automatic subscription. Your agent and any optional third-party services have their own costs.
Where are my projects stored?+
Drafts stay in this browser. When you sign in and choose Save to cloud, the project is stored in your account. A share link is public only after you create it.
Can I export MP4?+
Download the project kit, install its dependencies, and run the included HyperFrames render command on your computer. The browser exports HTML and the complete source kit.
Your next story starts here.
Claude Code · Workflow preview
CLAUDE CODE
Open the starter kit folder. Read SKILL.md, then help me turn my script into a polished motion video. Keep the wording and numbers accurate. Preview the composition before rendering.
Create a project and download its starter kit first. Then open the folder in your agent.