AI-Powered Motion Graphics Pipeline
Use Claude to generate Cavalry JavaScript scripts from plain English descriptions.
Introduction
30 Second Summary
AI chatbots can write Python scripts and React components in seconds. But ask one about a niche motion design tool, and it starts inventing functions that don't exist.
In this project, you will build a pipeline that turns plain English animation descriptions into professional motion graphics using Cavalry, a 2D procedural design tool. You will discover firsthand why AI fails on niche tool APIs and learn the technique that fixes it.
What You'll Build
You describe an animation in a few sentences, Claude generates a Cavalry JavaScript script, and Cavalry renders it into a polished procedural motion graphic you can export as video.
By the end of this project, you'll have:
- A working Cavalry setup inside a Windows VM on your Linux machine, where you paste a script and watch procedural animations build themselves in real time.
- A tested prompt template that lets you describe any animation in plain English and get back a working Cavalry script from Claude.
- A rendered MP4 video of a procedural motion graphic, created entirely through AI-generated code, ready to share or post.
- Secret Mission: Build a comprehensive Cavalry API reference library and use it to generate a completely different animation style in a single prompt.
Are there any prerequisites?
You need a Linux machine with at least 12 GB of RAM, 80 GB of free disk space, and hardware virtualization enabled (Intel VT-x or AMD-V). No prior Cavalry or Windows experience is needed.
Before We Start
Before we dive in, let's lock in what you're about to build and why it matters.
This project spans several tools across two operating systems, so taking a moment to commit to the goal now keeps you oriented through the setup ahead.
Set Up Your Cavalry Development Environment
Cavalry is a professional 2D procedural motion design tool. It only runs on macOS and Windows, so your Linux machine needs a Windows environment before you can touch Cavalry's scripting API.
In this step, you will install VirtualBox to create a virtual Windows machine, install Windows 11 inside it, and then install Cavalry so you're ready to start scripting.
In this step, get ready to:
- Install VirtualBox and download the Windows 11 ISO.
- Create and configure a Windows 11 virtual machine.
- Install Cavalry inside the VM and sign in.
Install VirtualBox and download the Windows 11 ISO
VirtualBox is a free, open-source virtualization platform that lets you run a full operating system inside a window on your current machine.
- Open a terminal on your Linux machine.
- Install VirtualBox by running this command:
sudo apt install virtualbox
What if I'm not on Ubuntu or Debian?
The sudo apt install command works on Ubuntu and Debian-based distributions. If you are on Fedora, use sudo dnf install VirtualBox. For other distributions, check the VirtualBox downloads page at virtualbox.org for packages matching your system.
- Verify the installation by checking the version:
VBoxManage --version
VirtualBox 7.0+ is required for this project because it provides a virtual TPM 2.0 and Secure Boot automatically, which Windows 11 requires.
✔️ I see version 7.0 or higher
Your VirtualBox is ready. Move on to downloading the Windows 11 ISO below.
ⓧ I see an older version
You need VirtualBox 7.0+ for the virtual TPM 2.0 that Windows 11 requires.
- Remove the outdated version by running:
sudo apt remove virtualbox
- Visit the VirtualBox Linux downloads page and follow the instructions for your distribution to install the latest version.
- After installation, run VBoxManage --version again to confirm you see 7.0 or higher.
ⓧ Command not found
The install may not have completed. Try these fixes:
- Run sudo apt update first to refresh your package list, then retry sudo apt install virtualbox.
- If the package is not found, visit the VirtualBox Linux downloads page to add the official VirtualBox repository for your distribution.
- After installation, run VBoxManage --version again to confirm you see 7.0 or higher.
Now you need the Windows 11 installation image.
- Open your browser and go to the Microsoft Windows 11 download page.
- Scroll down to Download Windows 11 Disk Image (ISO) for x64 devices.
- Select the latest edition from the dropdown menu.
- Choose your language and click 64-bit Download.
How big is the download?
The ISO is approximately 5 GB. The download may take a while depending on your internet speed. You can continue reading the next substep while you wait, but you will need the finished download before you can create the VM.
- Confirm the ISO downloaded successfully by checking your Downloads folder. You should see a file named something like Win11_25H2_English_x64.iso.
Create and configure the Windows 11 VM
With VirtualBox installed and the ISO downloaded, you can now create a virtual machine that will run Windows 11.
- Open VirtualBox. If you closed the terminal, you can launch it by typing virtualbox in a terminal and pressing Enter.
- Click New in the toolbar to create a new virtual machine.
- Enter Cavalry VM as the name.
- Set Type to Microsoft Windows.
- Set Version to Windows 11 (64-bit).
- Under the ISO Image field, click the browse button and select the Windows 11 ISO you downloaded.
- Click Next to proceed to hardware settings.
What is a virtual machine?
A virtual machine (VM) is a complete computer running inside your current computer. VirtualBox creates a sandboxed environment where Windows 11 thinks it has its own processor, memory, and hard drive, but those resources are actually borrowed from your Linux host.
- Set Base Memory to 8192 MB (8 GB).
- Set Processors to 4.
- Click Next to proceed to the virtual hard disk settings.
- Select Create a Virtual Hard Disk Now and set the disk size to 80 GB.
- Click Next, review the summary, and click Finish.
Your new VM now appears in the VirtualBox sidebar. Before starting it, you need to enable EFI.
- Select Cavalry VM in the sidebar and click Settings.
- Go to System.
- Check the box for Enable EFI.
- Click OK to save.
Why enable EFI?
Windows 11 requires EFI firmware, a TPM 2.0 security chip, and Secure Boot. VirtualBox 7.0+ automatically provides a virtual TPM 2.0 and Secure Boot, so enabling EFI is the only manual step needed. Without it, the Windows installer would refuse to proceed.
- Click Start in the VirtualBox toolbar to boot the VM.
The Windows 11 installer will launch. Follow the on-screen prompts to install Windows.
- Select your language, time format, and keyboard layout, then click Next.
- Click Install now.
- When prompted for a product key, click I don't have a product key.
- Select Windows 11 Pro (or any edition) and click Next.
- Accept the license terms and proceed with a custom installation.
- Select the virtual hard drive and click Next.
Is Windows 11 free without a product key?
Yes. Windows 11 installs and runs fully without a product key. You will see a small watermark on the desktop and you cannot customize the wallpaper, but all functionality works with no time limit. This is fine for running Cavalry.
The installation process takes 10 to 20 minutes. Windows will restart several times inside the VM. Once you reach the Windows desktop, the OS is installed.
Now install VirtualBox Guest Additions to enable clipboard sharing between your Linux host and the Windows VM.
- In the VirtualBox menu bar (outside the VM window), click Devices.
- Click Insert Guest Additions CD image.
- Inside the Windows VM, open File Explorer and navigate to the CD drive that appeared.
- Double-click VBoxWindowsAdditions to run the installer.
- Follow the installer prompts and reboot the VM when asked.
After the VM restarts, enable bidirectional clipboard sharing.
- In the VirtualBox menu bar, click Devices.
- Hover over Shared Clipboard and select Bidirectional.
- Test clipboard sharing by copying some text on your Linux host (Ctrl+C) and pasting it inside the Windows VM (Ctrl+V). The text should appear in both directions.
Clipboard not working between host and VM?
- Make sure Guest Additions installed successfully. Reboot the VM if you have not already.
- Confirm you selected Bidirectional under Devices then Shared Clipboard.
- Try fully shutting down the VM (not saving state) and starting it again.
Help me troubleshoot VirtualBox Guest Additions clipboard sharing on a Linux host with a Windows 11 guest.
Install Cavalry and sign in
Your Windows VM is running and clipboard sharing is active. Now you can install Cavalry inside the VM.
- Inside the Windows VM, open a browser (Edge is pre-installed).
- Go to cavalry.studio.
- Download the Windows installer (.msi file).
- Run the .msi file and follow the installer prompts.
Where does Cavalry install?
By default, Cavalry installs to C:\Program Files\Cavalry. You can keep this default.
- Launch Cavalry. You can find it in the Windows Start menu or by searching for Cavalry.
- On first launch, click Sign in with Canva.
What is Canva?
Canva acquired Cavalry's parent company, so Cavalry now uses Canva accounts for authentication. A free Canva account gives you full access to Cavalry's professional features, including the JavaScript Editor and rendering. No payment is needed.
- If you already have a Canva account, sign in with your existing credentials.
- If you do not have a Canva account, follow the on-screen prompts to create a free one.
Before you check the result, what do you expect to see in the Cavalry window after signing in?
Once signed in, you should see the Cavalry viewport with an empty composition. This is a dark canvas area with a timeline at the bottom and panels around the edges.
Cavalry viewport looks blank or unresponsive?
- Cavalry requires OpenGL 4.1. Performance may be slower in a VM compared to bare metal, but the viewport should still render. Try resizing the window if it appears blank.
- Make sure Guest Additions are installed. They provide better graphics driver support inside the VM.
- If the viewport flickers, try disabling 3D acceleration in the VM's Settings under Display.
Help me get Cavalry's viewport working inside a VirtualBox Windows 11 VM.
Your development environment is fully set up. You have VirtualBox running a Windows 11 VM, clipboard sharing is active between your Linux host and the VM, and Cavalry is installed and signed in. Next up, you will run your first Cavalry script and see an animation build itself in real time.
Run Your First Cavalry Script
Your Cavalry environment is up and running inside your Windows VM. Before you can ask an AI to generate Cavalry scripts, you need to see how the API actually works.
In this step, you'll run a real script in Cavalry's JavaScript Editor and watch it build an animation from scratch. The patterns you spot here become the foundation for everything you teach Claude later.
In this step, get ready to:
- Open Cavalry's JavaScript Editor.
- Run a starter script that creates an animated circle with smooth easing.
- Identify the four core API patterns every Cavalry script uses.
Open the JavaScript Editor and paste the starter script
Cavalry's JavaScript Editor is a built-in panel where you write and run scripts that control the application. Every script uses the api namespace to create shapes, set properties, and animate values.
- In Cavalry, click Window in the top menu bar.
- Click JavaScript Editor to open it. A tabbed editor panel appears.
- Delete any placeholder text that appears in the editor.
- Paste the following starter script into the editor:
// Cavalry Starter Script - Animated Circle
// Paste this into Cavalry's JavaScript Editor and click Run Script
// Create a purple ellipse
var ellipseId = api.primitive("ellipse", "My Circle");
api.set(ellipseId, {
"generator.radius": [80, 80],
"material.materialColor": "#6437ff"
});
// Animate position: slide from left to right over 60 frames
api.keyframe(ellipseId, 0, {"position.x": -400});
api.keyframe(ellipseId, 60, {"position.x": 400});
// Animate scale: pulse up at the midpoint and back down
api.keyframe(ellipseId, 0, {"scale.x": 1});
api.keyframe(ellipseId, 30, {"scale.x": 1.5});
api.keyframe(ellipseId, 60, {"scale.x": 1});
// Apply Magic Easing for smooth, polished motion
api.magicEasing(ellipseId, "position.x", 0, "SlowInSlowOut");
api.magicEasing(ellipseId, "scale.x", 0, "OvershootOut");
// Start playback
api.play();
What does this script do?
This script builds an animation entirely from code. Here is what each section handles:
- api.primitive("ellipse", "My Circle") creates a purple ellipse shape on the canvas.
- api.set() configures the ellipse's radius and color.
- api.keyframe() calls create animation keyframes for position and scale at specific frame numbers.
- api.magicEasing() applies polished easing curves so the motion feels smooth instead of robotic.
- api.play() starts playback so you can watch the result immediately.
✔️ Awesome, I've got everything!
Great. You're ready to run the script.
ⓧ I'd like to double check the full code
Compare your editor contents against this full script. Make sure every line matches exactly, including the quote marks and brackets.
// Cavalry Starter Script - Animated Circle
// Paste this into Cavalry's JavaScript Editor and click Run Script
// Create a purple ellipse
var ellipseId = api.primitive("ellipse", "My Circle");
api.set(ellipseId, {
"generator.radius": [80, 80],
"material.materialColor": "#6437ff"
});
// Animate position: slide from left to right over 60 frames
api.keyframe(ellipseId, 0, {"position.x": -400});
api.keyframe(ellipseId, 60, {"position.x": 400});
// Animate scale: pulse up at the midpoint and back down
api.keyframe(ellipseId, 0, {"scale.x": 1});
api.keyframe(ellipseId, 30, {"scale.x": 1.5});
api.keyframe(ellipseId, 60, {"scale.x": 1});
// Apply Magic Easing for smooth, polished motion
api.magicEasing(ellipseId, "position.x", 0, "SlowInSlowOut");
api.magicEasing(ellipseId, "scale.x", 0, "OvershootOut");
// Start playback
api.play();
Run the script and observe the animation
Before you click Run Script, think about what you expect to see in the viewport. The script creates one ellipse and sets keyframes on two properties. What do you think the animation will look like?
- Click the Run Script button at the top of the JavaScript Editor.
The viewport populates with a purple circle. Playback starts automatically. You should see the circle slide from left to right while pulsing in size. The motion feels smooth and polished because of the SlowInSlowOut and OvershootOut easing applied to the keyframes.
Nothing appeared in the viewport?
- Check the JavaScript Console panel at the bottom of the editor for red error messages. A missing quote or bracket in the pasted code is the most common cause.
- Make sure you deleted all placeholder text before pasting. Leftover characters before the script will cause syntax errors.
- If the circle appeared but is not moving, scrub the timeline playhead to the right. The animation runs over 60 frames. If the composition length is shorter, the full animation may not play.
Still stuck? Help me debug why my Cavalry starter script is not running.
Read the script and identify the API patterns
Now that you have seen the animation, scroll back through the script in the editor. Every Cavalry script you will write or generate follows the same four patterns.
What are the four core API patterns?
- api.primitive() creates shapes. You pass a type like "ellipse" and a name. It returns a layer ID you use in every other call.
- api.set() configures properties. You pass an object of attribute paths like "generator.radius" and "material.materialColor" with their values.
- api.keyframe() animates values over time. You specify a frame number and the attribute value at that frame. The starter script uses this to move position.x from -400 to 400 over 60 frames.
- api.magicEasing() adds polished easing curves to keyframes. Without easing, motion looks linear and mechanical. With easing names like SlowInSlowOut and OvershootOut, it feels professional.
These four functions are the building blocks you will teach Claude to use in the next steps.
What about api.create()?
The starter script uses api.primitive() for shapes, but Cavalry also has api.create() for creating any layer type, including duplicators, oscillators, and text shapes. You will see both in action when Claude generates more complex scripts.
You have seen how Cavalry's API builds animations entirely from code. Next up, you will find out what happens when you ask Claude to write these scripts without any help.
Ask Claude for a Complex Animation
You have the Cavalry API patterns down. Four functions created a smooth, polished animation from scratch.
Can AI write these scripts for you? In this step, you will put Claude to the test with a complex animation request and see what happens.
In this step, get ready to:
- Send Claude a prompt asking for a complex Cavalry animation.
- Paste Claude's generated script into Cavalry and run it.
- Diagnose why the generated script fails.
Send Claude your animation request
You know the API patterns from the starter script. Now you need to find out whether an AI can use those same patterns to build something more ambitious.
- Open claude.ai in a browser. You can use the browser inside your Windows VM, or the browser on your Linux host.
- Sign in to your Claude account, or create a free one if you do not have one yet.
- Start a new chat and paste the following prompt:
Write me a Cavalry motion design JavaScript script that creates a grid of 36 circles arranged in 6 rows and 6 columns. Each circle should animate its scale in a staggered wave pattern, creating a ripple effect from the center outward. Use Cavalry's Duplicator and Stagger features.
- Press Enter to send the prompt. Wait for Claude to generate a full JavaScript script in its response.
What is this prompt asking for?
The prompt asks for a 6x6 grid of circles where each circle pulses in a wave pattern radiating from the center. This requires Cavalry-specific features like the Duplicator (which clones shapes into patterns) and Stagger (which offsets animation timing across clones).
This is a significant step up from the single animated circle in your starter script. It requires multiple layer types wired together, not just one shape with keyframes.
Run Claude's generated script in Cavalry
- Copy the JavaScript code from Claude's response.
- Switch back to Cavalry inside your Windows VM.
- In the JavaScript Editor, select all the existing code and delete it to start with a clean editor.
- Paste Claude's generated script into the editor.
Before you click Run Script, take a moment to predict what will happen. Do you think the script will create a grid of animated circles in the viewport?
- Click Run Script at the top of the JavaScript Editor.
The script fails. Errors appear in the JavaScript Console panel at the bottom of the editor. You may see the viewport remain empty, or only a partial shape appear before the script crashes.
What should I see?
The JavaScript Console panel below the editor shows error messages. Claude's script uses function names, attribute paths, or layer types that do not exist in Cavalry's API.
Take note of which lines failed and what errors appeared. You will use these observations in the next substep.
Script ran without errors?
On rare occasions, Claude may generate a script that partially works. Look carefully at the viewport. Does it actually show 36 circles in a 6x6 grid with staggered animation? If the output is missing shapes, missing animation, or does not match the prompt, the script still failed to produce the correct result.
Help me figure out whether Claude's Cavalry script actually works correctly.
Diagnose why the script failed
The errors are not random. There is a specific reason Claude's script does not work, and finding that reason is the key insight of this entire project.
- Scroll through Claude's script in the JavaScript Editor. Look at the function calls and attribute paths it used.
- Compare them to the working starter script you ran in Step 2. The starter script used api.primitive(), api.set(), api.keyframe(), and api.magicEasing().
- Identify which function names in Claude's script do not match any of the real Cavalry API functions. Look for method names, property paths, or object types that Claude appears to have invented.
Why does Claude get Cavalry wrong?
Cavalry is a niche motion design tool. LLMs like Claude are trained on publicly available text, and there is very little Cavalry JavaScript API content on the internet compared to mainstream tools like React or Node.js.
Without reliable training data, Claude guesses. It combines patterns from similar-looking APIs (like After Effects scripting or generic canvas libraries) and produces function calls that look plausible but do not exist in Cavalry. This is called hallucination.
The problem is not that Claude is bad at code. The problem is that Claude lacks specific knowledge of this particular API.
You have identified the core problem. Claude does not know Cavalry's API, so it invents one. In the next step, you will fix this by giving Claude the knowledge it needs.
Feed Claude the API Documentation
In the last step, you watched Claude invent fake function names and break your script. The root cause is straightforward: Cavalry's API is niche enough that Claude does not have reliable training data for it.
The fix is a technique called context injection. You paste the actual API documentation directly into your prompt so Claude has a verified reference to work from instead of guessing.
In this step, get ready to:
- Build a reusable prompt template containing Cavalry's API documentation.
- Generate a working Cavalry animation script from Claude using context injection.
- Iterate on the prompt to refine your animation.
Build a prompt with API context
Your prompt template has four sections: a context block that tells Claude what Cavalry is, an API reference listing the real functions, a working example script, and a set of rules to prevent common mistakes.
Why context injection instead of fine-tuning?
Fine-tuning a model costs money, takes time, and locks you into a specific model version. Context injection is free, instant, and works with any LLM.
By pasting documentation into the prompt, you get accurate output today and can swap models tomorrow without rebuilding anything. This technique works for any niche tool, not just Cavalry.
- Inside your Windows VM, press the Windows key to open the search bar.
- Type Notepad and press Enter to open it.
- Start building the prompt template by pasting this first section into the empty Notepad window:
# Cavalry Script Generation Prompt Template
# Copy this entire block into your Claude prompt, then add your animation request at the end.
## Context
You are generating JavaScript scripts for Cavalry, a 2D procedural motion design
application. Scripts run in Cavalry's JavaScript Editor using the `api` namespace.
All functions must be prefixed with `api.` (e.g., `api.create("null", "My Null")`).
## Key API Functions
### Creating Layers
- `api.primitive(type, name)` - Creates a shape. Types: "ellipse", "rectangle",
"polygon", "star", "circle", "superEllipse"
- `api.create(layerType, name)` - Creates any layer. Types include: "null",
"duplicator", "stagger", "oscillator", "subMesh", "textShape", "basicShape",
"pathfinder", "connectShape", "javaScript", "colorMaterial", "colorArray",
"gradientShader", "valueArray", "group", "schedulingGroup", "component"
### Setting Attributes
- `api.set(layerId, {attrId: value})` - Set one or more attributes.
Example: `api.set(id, {"position": [100, 200], "rotation": 45,
"material.materialColor": "#ff24e0"})`
What does this section do?
The Context block orients Claude so it knows the target environment. The Creating Layers section gives Claude the two creation functions (api.primitive() for shapes and api.create() for everything else) along with every valid type name.
The Setting Attributes section shows the dot-notation pattern ("material.materialColor") that Cavalry requires. Without this, Claude would guess generic property names and break the script.
- Place your cursor at the end of the text in Notepad and add the animation and connection functions by pasting this below:
### Animation
- `api.keyframe(layerId, frame, {attrId: value})` - Set a keyframe.
Example: `api.keyframe(id, 0, {"position.x": -400})`
- `api.magicEasing(layerId, attrId, frame, easingName)` - Apply easing to a
keyframe. Valid names: "SlowIn", "SlowOut", "SlowInSlowOut", "VerySlowIn",
"VerySlowOut", "VerySlowInVerySlowOut", "SpringIn", "SpringOut",
"SpringInSpringOut", "SmallSpringIn", "SmallSpringOut",
"SmallSpringInSmallSpringOut", "AnticipateIn", "OvershootOut",
"AnticipateInOvershootOut", "BounceIn", "BounceOut", "BounceInBounceOut",
"Custom", "None"
### Connections
- `api.connect(fromLayerId, fromAttrId, toLayerId, toAttrId)` - Connect layers.
The result/output of a layer uses "id" as the fromAttrId.
Example: `api.connect(ellipseId, "id", duplicatorId, "shapes")`
### Hierarchy
- `api.parent(childId, parentId)` - Make one layer the child of another.
### Generators
- `api.setGenerator(layerId, attrId, type)` - Set a generator on a layer.
Duplicator distributions include: "circleDistribution", "gridDistribution"
### Rendering Controls
- `api.setFill(layerId, isOn)` / `api.setStroke(layerId, isOn)` - Toggle fill/stroke.
- `api.set(layerId, {"stroke.strokeColor": "#hex", "stroke.width": 5})` - Style stroke.
### Playback
- `api.play()` - Start playback.
- `api.setFrame(frame)` - Jump to a frame.
What does this section cover?
This section gives Claude the animation functions (api.keyframe() and api.magicEasing()) plus the full list of valid easing names. It also provides api.connect() for wiring layers together and api.setGenerator() for configuring Duplicator distributions.
Every function listed here is one that Claude was likely to hallucinate in Step 3. Now Claude has the exact signatures to work from.
- Save the file now so you do not lose your work. Press Ctrl+Shift+S to open the Save As dialog.
- Change Save as type from Text Documents (*.txt) to All Files (*.*).
- Navigate to the Desktop folder.
- Type cavalry-prompt-template.md as the file name and click Save.
You should see cavalry-prompt-template.md appear on your VM's Desktop.
- Now finish the template by pasting this final section at the end of the file in Notepad:
### Graph Utilities
- `api.flipGraph(layerId, attrId, direction)` - Flip a graph attribute.
Direction: "horizontal" or "vertical"
## Working Example
```js
var ellipseId = api.primitive("ellipse", "My Circle");
api.set(ellipseId, {
"generator.radius": [80, 80],
"material.materialColor": "#6437ff"
});
api.keyframe(ellipseId, 0, {"position.x": -400});
api.keyframe(ellipseId, 60, {"position.x": 400});
api.magicEasing(ellipseId, "position.x", 0, "SlowInSlowOut");
api.play();
```
## Important Rules
- All API calls use the `api.` prefix.
- Use "id" as the fromAttrId when connecting a layer's output.
- Attribute paths use dot notation: "position.x", "generator.radius",
"material.materialColor", "stroke.strokeColor", "stroke.width"
- Colors are hex strings: "#ff24e0"
- Positions and dimensions use arrays for compound values: [100, 200]
- To hide a shape that is used as input to a Duplicator, set {"hidden": true}
## Your Request
[DESCRIBE YOUR ANIMATION HERE]
What does this final section do?
The Working Example is your starter script from Step 2. It gives Claude a proven pattern to follow rather than inventing its own structure.
The Important Rules section catches the mistakes Claude is most likely to make: forgetting the api. prefix, using wrong attribute path syntax, or passing colors in the wrong format. These rules act like guardrails.
- Press Ctrl+S to save the file.
File saved as .txt instead of .md?
If Notepad added a .txt extension (e.g. cavalry-prompt-template.md.txt), you did not change the Save as type to All Files (*.*) before saving. Use Ctrl+Shift+S again, set the type, and re-save.
The file extension does not affect functionality. The content is what matters for pasting into Claude.
✔️ Awesome, I've got everything!
Great. Confirm your file is saved, then move on to sending it to Claude.
ⓧ I'd like to double check the full code
Your cavalry-prompt-template.md file is longer than 30 lines, so scroll up through your Notepad file and verify all these sections appear in order:
- The title lines and the ## Context block (from chunk 1).
- The ## Key API Functions section with Creating Layers, Setting Attributes, Animation, Connections, Hierarchy, Generators, Rendering Controls, Playback, and Graph Utilities (from chunks 1, 2, and 3).
- The ## Working Example with the starter script (from chunk 3).
- The ## Important Rules and ## Your Request sections at the end (from chunk 3).
Generate and run the context-powered script
Your prompt template is ready. Now you will copy it into Claude, replace the placeholder at the bottom with a real animation description, and see what happens.
- In Notepad, select all the text by pressing Ctrl+A, then copy it with Ctrl+C.
- Open the browser in your VM and go to claude.ai.
- Start a new chat and paste the template with Ctrl+V.
- Find the line that says [DESCRIBE YOUR ANIMATION HERE] at the bottom of the pasted text.
- Replace it with this animation description:
Create a grid of 36 circles arranged in 6 rows and 6 columns using a Duplicator
with gridDistribution. Each circle should be small (radius 20). Use a Stagger
behavior connected to the Duplicator to animate each circle's scale from 0 to 1.2
and back to 1 over 60 frames, creating a ripple effect. Apply SlowInSlowOut
easing. Use a color of "#00ccff".
Be specific in your request
Notice how the request names exact API concepts: Duplicator, gridDistribution, Stagger, frame counts, and easing names. The more specific you are, the more accurate Claude's output will be.
- Send the prompt to Claude.
Claude should respond with a Cavalry JavaScript script. You will see real API calls in the output: api.primitive(), api.create(), api.set(), api.keyframe(), api.connect(), api.setGenerator(), api.magicEasing(), and api.play() instead of the hallucinated function names from Step 3.
- Copy Claude's generated script.
- Switch back to Cavalry in the VM.
- In the JavaScript Editor, open a new tab or clear the current one.
- Paste Claude's script into the editor.
Before you click Run Script, think about what you expect to happen. In Step 3, the script threw errors. Will this one work?
- Click Run Script at the top of the JavaScript Editor.
The script should run without errors in the JavaScript Console panel. The viewport should populate with a grid of circles that animate with staggered timing and smooth easing.
What changed between Step 3 and now?
The animation request is nearly identical to the one you sent in Step 3. The only difference is the API documentation you pasted above it. Context injection turned a completely broken output into a working animation.
Script still has errors?
Check the JavaScript Console panel for specific error messages. If Claude used an attribute path that does not exist, copy the error and paste it back into the same Claude chat with the message "This line threw an error in Cavalry" so Claude can fix it.
If large sections of the script use functions not in your template, make sure you copied the entire template (including the Context and Important Rules sections) and not just the API function list.
AI output varies between runs. If the first attempt fails, send the same prompt again. Claude often produces a correct script on a second try.
Help me debug a Cavalry script error from Claude's output
Iterate on the result
Your animation is running, but it might not look exactly the way you want. The power of this workflow is that you can refine the output with follow-up prompts in the same Claude conversation.
- Switch back to the Claude chat in your browser.
- Send a follow-up message asking Claude to change one aspect of the animation. For example:
Make the circles smaller (radius 12) and add OvershootOut easing
instead of SlowInSlowOut. Also change the color to "#ff24e0".
Why iterate in the same chat?
Claude remembers the API context from earlier in the conversation. Follow-up prompts do not need the full template again. Just describe what you want to change and Claude will generate an updated script using the same API reference.
- Copy Claude's updated script.
- In Cavalry, clear the JavaScript Editor and paste the new script.
- Click Run Script.
The viewport should update with your refined animation. Continue iterating until you have a result you are happy with.
Iteration ideas to try
- "Add a second row of larger circles behind the grid."
- "Use a circleDistribution instead of gridDistribution."
- "Add a stroke with color #ffffff and width 2."
- "Make the entire animation loop by adding matching keyframes at frame 0 and frame 90."
Iteration broke something?
If an iterated script introduces errors, tell Claude the specific error message from the JavaScript Console. Claude will usually fix it in one follow-up.
If the animation looks different from what you expected, be more explicit in your prompt. Instead of "make it look cooler," describe the exact change: "increase the scale to 2.0" or "change the easing to BounceOut."
Help me refine my Cavalry animation prompt
You now have a working pipeline: describe an animation, get a real Cavalry script, paste and run. Next up, you will turn this viewport animation into a shareable video file.
Render Your Animation to Video
You just proved that context injection works. Claude generated a working Cavalry script that produced a complex procedural animation with multiple shapes, staggered timing, and smooth easing. The pipeline from plain English to animation is real.
Right now, that animation only lives inside Cavalry's viewport. To share it, post it, or use it in any other context, you need to render it to a video file. Cavalry's Render Manager exports your composition to formats like MP4, completing the pipeline from text description to deliverable output.
In this step, get ready to:
- Open the Render Manager and configure the output settings for your composition.
- Render the animation to an MP4 video file and verify it plays correctly.
Set up the Render Manager
The Render Manager is Cavalry's built-in tool for exporting compositions to video files. You need to add your composition to a render queue and tell it where to save the output.
- In Cavalry, click Window in the top menu bar.
- Click Render Manager to open the render panel.
The Render Manager panel appears in the Cavalry interface. This is where you queue up compositions for export.
- Click + Current Composition to add the active composition to the Render Queue.
A new Render Queue Item appears in the list. This represents your animation ready to be rendered.
- Click on the Render Queue Item to expand its settings.
- Under Output, click the folder icon next to Path and select your Windows Desktop as the output location.
The path updates to show your Desktop folder. Now set the output format and frame range.
- Under Format, select MP4.
- Set Frame Range Mode to Composition Start/End to render the full timeline.
Your Render Manager now shows the composition queued for rendering. The output path points to your Desktop, the format is MP4, and the frame range covers the entire composition.
What do these settings do?
Path tells Cavalry where to save the rendered video file on disk. Format determines the file type. MP4 is a widely supported video format that works in browsers, phones, and social media platforms.
Composition Start/End renders every frame in your composition's timeline. This ensures no frames get cut off at the beginning or end of your animation.
Render and verify the output
Everything is configured. Before you start the render, think about what you expect to see. Will Cavalry show a progress indicator? How long might it take given that the VM uses CPU rendering?
- Click Render All at the top of the Render Manager.
Cavalry processes each frame and encodes it into the MP4. You will see a progress bar as each frame renders. This may take a minute or two since the VM uses CPU rendering instead of a dedicated GPU.
- Once rendering completes, open File Explorer on the Windows Desktop.
- Find the MP4 file on your Desktop and double-click it to open it in the default media player.
The video should play back your procedural animation with all the shapes, staggered timing, and smooth easing you saw in the Cavalry viewport. This is the finished deliverable of your text-to-motion-graphics pipeline.
Render failed or MP4 not appearing?
- If the render seems frozen or is taking a very long time, CPU rendering in a VM is slower than native hardware. Give it a few minutes before cancelling.
- If you cannot find the MP4 on your Desktop, check the Path setting in the Render Manager. Make sure it points to your actual Desktop folder, not a different directory.
- If the video plays but shows a black screen, check that your animation script ran successfully before rendering. Return to the JavaScript Editor, click Run Script, and confirm shapes appear in the viewport before re-rendering.
My render is failing or the output looks wrong. Help me troubleshoot.
Copy the MP4 to your Linux host
You can use VirtualBox shared folders to copy the rendered file to your Linux machine. In the VirtualBox menu bar (above the VM window), go to Devices, then Shared Folders, and add a folder from your Linux host. The shared folder appears as a network drive inside the Windows VM.
Secret mission
Build a Cavalry API Prompt Reference Library
Your prompt template works, but it covers only a fraction of Cavalry's API. What if you could describe any animation style and get back a working script every time? Build a comprehensive API reference document and prove it works by generating a completely different animation from a single prompt.
Clean Up Your Resources
Clean Up Your Resources
This project runs entirely locally inside a Windows VM on your Linux machine. There are no cloud resources or paid subscriptions, so there are no ongoing costs. Decide whether to keep your resources running, pause them to come back later, or delete them entirely.
Resources you used:
- Windows 11 VM named Cavalry VM in VirtualBox (contains Cavalry, rendered MP4, and all project scripts).
- Windows 11 ISO file on your Linux host (approximately 5 GB).
- VirtualBox installation on your Linux host.
Keep everything running
No action needed. Choose this if you plan to keep experimenting with Cavalry scripts or want to generate more animations.
- Your Cavalry VM stays available in VirtualBox with Cavalry, your rendered MP4, and all project scripts intact.
- Your free Canva account and Claude account remain active at no cost.
- The VM's virtual disk uses approximately 80 GB on your Linux host. VirtualBox itself and the Windows 11 ISO add another 5+ GB.
Pause - I'll come back to this later
Shut down the VM to free up RAM and CPU on your Linux host. Your files and Cavalry installation stay on disk for next time.
- Inside the VM, click the Windows Start menu, then click the power icon and select Shut down.
- If the VM is unresponsive, close its window in VirtualBox and choose Power off the machine.
- The VM's virtual disk remains on your Linux host. When you want to resume, open VirtualBox and start Cavalry VM again.
- You can delete the Windows 11 ISO file from your Downloads folder to reclaim approximately 5 GB. You do not need the ISO to run the existing VM.
Delete - I don't want to use this again
Remove the VM, the ISO file, and optionally VirtualBox itself to reclaim all disk space.
- If the VM is still running, shut it down first (close the VM window and choose to power it off).
- In VirtualBox Manager, right-click Cavalry VM in the left sidebar. Select the option to remove it, and when prompted, choose to delete all associated files. This removes the 80 GB virtual disk.
- Delete the Windows 11 ISO file from your Downloads folder (or wherever you saved it). Open a terminal on your Linux host and run:
ls ~/Downloads/*.iso
- Find the Windows 11 ISO filename in the output, then delete it:
rm ~/Downloads/Win11_*.iso
- If the filename does not match the pattern above, replace it with the actual filename from the ls output.
- To uninstall VirtualBox, run the command that matches your distribution's package manager. For Ubuntu or Debian-based systems:
sudo apt remove virtualbox
- If you use a different Linux distribution, use your distribution's package manager to remove the virtualbox package.
- Your free Canva and Claude accounts have no ongoing costs. You can leave them active or delete them through each provider's account settings if you prefer.
Nice Work!
Nice Work!
Nice work! You just built a complete text-to-motion-graphics pipeline where plain English descriptions become professional Cavalry animations, powered by AI.
You've learned how to:
- Set up a complete Windows 11 VM on Linux with VirtualBox and installed Cavalry, a professional motion design tool, entirely for free.
- Discovered that LLMs fail on niche tool APIs without context, and built the context injection technique that fixes it by embedding API documentation directly into your prompts.
- Rendered an AI-generated procedural animation to a shareable MP4 video, completing the full pipeline from plain English description to deliverable output.
- Secret Mission: Compiled a comprehensive Cavalry API reference library and used it to generate a completely different animation style from a single prompt.
Ready to quiz yourself?