Remotion Video Toolkit 是一个用于程序化视频创建的完整工具包，基于 Remotion + React。它作为一项技能，教导 AI 智能体如何使用 Remotion 构建视频——从第一个动画到生产级渲染管线。该工具包包含 29 条规则，覆盖 Remotion 的每个主要功能。
用途
该工具包的核心用途是让开发者通过编写 React 组件来生成真实的 MP4 视频。它面向需要以代码方式批量、动态生成视频的场景，而非手动使用时间线编辑器。
主要能力
核心功能包括：
- 合成（Compositions）：定义视频、静态图、文件夹、默认 props、动态元数据。
- 渲染（Rendering）：支持 CLI、Node.js API、AWS Lambda、Cloud Run、Express 服务器模式。
- 计算元数据（Calculate metadata）：在渲染时动态设置时长、尺寸和 props。
动画与时间控制：
- 动画：淡入淡出、缩放、旋转、滑动。
- 时间控制：插值曲线、缓动、弹簧物理。
- 序列编排：延迟、链接、编排场景。
- 转场：场景之间的过渡。
- 裁剪：剪切任意动画的开头或结尾。
文本与排版：
- 文本动画：打字机、单词高亮、揭示效果。
- 字体：Google Fonts 和本地字体加载。
- 文本测量：使文本适应容器、检测溢出。
媒体处理：
- 视频：嵌入、裁剪、变速、音量、循环、音调变换。
- 音频：导入、裁剪、淡入淡出、音量和速度控制。
- 图像：Img 组件。
- GIF：时间线同步的 GIF 播放。
- 资源：将任意媒体导入合成。
- 解码检查：验证浏览器兼容性。
字幕与说明文字：
- 转录字幕：通过 Whisper、Deepgram 或 AssemblyAI 将音频转为字幕。
- 显示字幕：TikTok 风格的逐词高亮。
- 导入 SRT：加载现有 .srt 文件。
数据可视化：
- 图表：动画条形图、折线图、数据驱动视觉。
高级功能：
- 3D 内容：Three.js 和 React Three Fiber。
- Lottie：通过 Lottie 使用 After Effects 动画。
- TailwindCSS：使用 Tailwind 为合成设置样式。
- DOM 测量：在渲染时测量元素尺寸。
媒体工具：
- 视频时长：获取秒数长度。
- 视频尺寸：获取宽度和高度。
- 音频时长：获取音频长度。
- 提取帧：在特定时间戳提取帧。
使用方式
快速开始步骤：
- 脚手架创建项目：npx create-video@latest my-video
- 在浏览器中预览：cd my-video && npm start
- 渲染为 MP4：npx remotion render src/index.ts MyComposition out/video.mp4
- 传递动态数据：npx remotion render src/index.ts MyComposition out.mp4 --props '{"title": "Hello"}'
要求：
- Node.js 18+
- React 18+（Remotion 逐帧渲染 React 组件）
- Remotion——使用 npx create-video@latest 脚手架
- FFmpeg——随 @remotion/renderer 提供，无需单独安装
- 无服务器渲染：AWS 账户（Lambda）或 GCP 账户（Cloud Run）
适用场景
- 大规模个性化视频：将用户数据作为 JSON props 传入，为每个用户渲染独特视频，如 Spotify Wrapped、GitHub Unwrapped、入门引导。
- 自动化社交媒体剪辑：拉取实时数据（统计、排行榜、产品指标），每日或每周渲染视频帖子。
- 动态广告和营销视频：替换客户名称、产品图片、价格，同一模板无限变体，通过 API 或 Lambda 在服务端渲染。
- 动画数据可视化：将仪表盘和 KPI 报告转为可分享的视频剪辑，带有动画图表和过渡。
- TikTok 和 Reels 字幕：转录音频，显示逐词高亮字幕，导出即可上传。
- 产品展示视频：从数据库自动生成——图片、规格、价格——直接输出 MP4。
- 教育和讲解内容：动画课程材料、证书视频、分步演示，全部由代码驱动。
- 视频生成即服务：将渲染暴露为 HTTP 端点，应用发送 JSON，返回视频文件。
限制
资料中未明确列出该工具包的特定限制。已知要求包括 Node.js 18+、React 18+、Remotion 脚手架，无服务器渲染需要 AWS 或 GCP 账户。其他限制暂未提供。