boos
30 lines
1.3 KiB
Markdown
30 lines
1.3 KiB
Markdown
---
|
|
name: remotion-video
|
|
description: Remotion code-driven video workflow for React-based videos, reusable templates, dynamic props, batch rendering, data-driven motion graphics, product explainers, and programmatic video generation. Use when the user asks to create or render videos with React, Remotion, templates, captions, charts, or repeatable variants.
|
|
---
|
|
|
|
# Remotion Video Skill
|
|
|
|
Use this skill when the output should be a maintainable React video project or a batch-renderable template.
|
|
|
|
Remotion: https://www.remotion.dev
|
|
Repo: https://github.com/remotion-dev/remotion
|
|
Skills: `npx skills add remotion-dev/skills`
|
|
|
|
## Workflow
|
|
|
|
1. Define composition size, FPS, duration, and props schema before coding.
|
|
2. Create reusable scene components with predictable timing and layout.
|
|
3. Put user-editable text, colors, media paths, and data in props rather than hardcoding.
|
|
4. Use Remotion for deterministic charts, captions, UI walkthroughs, and templated social variants.
|
|
5. Validate render constraints: text overflow, safe areas, asset paths, audio duration, and final codec.
|
|
|
|
## Good Fits
|
|
|
|
- Product demos and UI motion.
|
|
- Data-driven video variants.
|
|
- Branded social clips with repeatable templates.
|
|
- Developer-controlled motion graphics.
|
|
|
|
Install the upstream Remotion skills for full project scaffolding and render commands.
|