开源发现

Remotion是一个基于 React的视频开发框架。它不是传统剪辑软件，也不是文生视频模型，而是让开发者用组件、数据和代码生成 MP4、WebM、GIF或图片序列。对于熟悉 React的团队，它特别适合制作批量视频、数据驱动动画和自动化内容。

Remotion的工作方式很接近前端开发：画面由 React组件组成，时间通过帧数控制，文字、图片、音频和动画都可以由数据动态改变。视频完成后，可以在 Remotion Studio中预览，再在本地、服务器或云端渲染。

它适合做什么

Remotion适合需要重复生成或持续更新的视频，例如新闻短片、商品宣传视频、字幕动画、数据报告、课程内容和社交媒体短视频。只要视频结构相对固定，就可以把标题、图片、价格、图表或配音作为参数传入，自动生成不同版本。

它也很适合与 Codex、Claude Code、Cursor等 AI编程工具配合。开发者可以直接描述画面、时长和动画效果，让 AI生成或修改 React组件，再通过 Remotion预览和输出结果。不过，AI生成的代码仍需要检查节奏、字体、素材版权和渲染性能。

如何安装

先确保电脑已经安装 Node.js，然后运行官方脚手架：

npx create-video@latest

按照提示选择模板、包管理器、Tailwind和 Agent Skills。需要直接创建空白项目时，可以使用：

npx create-video --yes --blank my-video
cd my-video
npm start

启动后，浏览器会打开 Remotion Studio，用于预览 Composition、调整参数和检查每一帧画面。

配合 AI编程工具使用

Remotion官方提供了 Agent Skills，可以给 Codex、Claude Code和 Cursor补充当前版本的开发规范：

npx skills add remotion-dev/skills

安装后，可以在项目中向 AI描述目标。例如：

用 Remotion 制作一个 15 秒产品介绍视频，1920×1080、30fps。开头显示产品名称，中间展示三项卖点，结尾加入行动提示。动画保持简洁，使用 spring 和 interpolate，不使用外部未授权素材。

更稳定的做法是先让 AI建立 Composition、尺寸、帧率和素材结构，再逐段调整动画，而不是一次生成整套复杂视频。

基本开发方式

Remotion通过 `useCurrentFrame()` 获取当前帧，再用 `interpolate()` 或 `spring()` 计算透明度、位置和缩放。每个视频需要在根组件中注册 Composition，并设置时长、帧率、宽度和高度。

开发完成后，可以通过 Remotion Studio直接渲染，也可以使用命令行输出视频。项目模板通常已经配置好对应脚本，具体命令以项目中的 `package.json` 为准。

使用限制

Remotion更适合程序化视频和可复用模板，不适合完全依赖手工时间轴、复杂调色或大量人工剪辑的项目。视频中包含大量高清素材、3D场景或复杂特效时，也需要关注内存、渲染时间和部署成本。

Remotion的价值在于把视频变成可以维护、复用和自动化的代码项目。对于需要批量生成内容，或希望把 AI编程能力接入视频流程的团队，它比传统逐条剪辑更高效。