Create professional motion graphics and generate visual assets. Describe what you want. Get an MP4.
Prerequisites
This skill builds on Remotion skills for core Remotion API patterns:
npx skills add remotion-dev/skills
Workflow
1. Initialize project
npx oanim init my-video
cd my-video
2. Compose using @oanim/core
import { fadeUp, popIn, Background, SafeArea, palettes } from '@oanim/core';
See references/animation-cookbook.md for the full presets reference.
3. Preview
npx remotion studio
4. Render to MP4
npx oanim render
5. Generate assets (optional)
npx oanim assets gen-image --prompt "dark gradient abstract" --out public/bg.png
Capabilities
| Capability | Tool |
|---|---|
| Project scaffolding | oanim init |
| Animation presets (fadeUp, popIn, springs) | @oanim/core |
| Components (Terminal, Card, Badge, GlowOrb) | @oanim/core |
| Scene transitions (fadeBlur, clipCircle, wipe) | @oanim/core |
| Typography (AnimatedCharacters, TypewriterText, CountUp) | @oanim/core |
| Design tokens (5 palettes, fonts, spacing) | @oanim/core |
| Rendering to video | oanim render |
| Cloud rendering | oanim render --cloud |
| AI image generation | oanim assets gen-image |
| Image editing | oanim assets edit-image |
| Background removal | oanim assets remove-bg |
| Image upscaling | oanim assets upscale |
| Any fal.ai model | oanim assets run |
References
references/workflow.md— Step-by-step agent workflowreferences/scene-config.md— animate.json schema referencereferences/composition-patterns.md— Multi-scene composition architecturereferences/animation-cookbook.md— Full@oanim/corepresets referencereferences/asset-generation.md— AI asset generation guide
Templates
templates/launch-video.md— 4-scene product launch (5s)templates/explainer.md— Step-based explainer video (20s)templates/logo-reveal.md— Logo animation with glow (5s)templates/meme-caption.md— Vertical social clip (6s)templates/investor-update.md— Metrics dashboard (15s)