如果你做过前端开发，应该能理解这句话：视频 = React 组件。
Remotion 是一个用 React 创建视频的框架。传统视频剪辑软件（PR、AE、Final Cut）的逻辑是“命令式”——把素材拖到时间轴上，鼠标点第 24 帧拉个关键帧，第 60 帧再拉一个，让软件“插值”出中间的过渡。但 AI 不擅长这个——LLM 看不到时间轴，拽不动鼠标。
Remotion 反着来：把每一段动画写成一个 React 组件。比如这一行代码：
const opacity = interpolate(frame, [0, 30], [0, 1]);
AI 就懂了：在第 0 帧到第 30 帧之间，透明度从 0 变到 1。
时间轴不再是“拖出来的”，而是“算出来的”。视频本质上变成了一份代码工程，而代码恰恰是 AI 最擅长生成和迭代的东西。
Remotion Agent Skills 就是一套教 AI 怎么用 Remotion 的“说明书”。2026 年 1 月 20 日，Remotion 发布了这套技能。截至 2026 年 8 月，remotion-best-practices 的安装量已超过 30 万次。
主要功能
Remotion 技能包不是单个技能，而是一整套技能集合。官方提供了多个可用的技能：
/remotion-best-practices：涵盖所有其他技能的总技能。如果你不确定该用哪个，直接用这个。包含 30 多个规则文件，覆盖动画、音频、素材、3D 内容、图表、文本、转场和合成管理。
/remotion-markup：Remotion React 标记的最佳实践。涵盖合成、动画、布局、排版、媒体元素、效果、音频、字体和时间。
/remotion-maps：地图动画的最佳实践。支持静态地图、动画路线、地理解说、Mapbox、MapLibre、GeoJSON 以及 CesiumJS 的 3D 地理飞越。
/remotion-docs：搜索 Remotion 文档，以 Markdown 形式获取任意页面。用于查阅最新的 API 参考、组件属性和包指南。
除了官方技能，社区还贡献了不少实用技能：
remotion-video-toolkit：包含 29 条规则，覆盖 Remotion 的每个主要功能。支持规模化个性化视频——将用户数据作为 JSON props 传入，为每个用户渲染独特的视频。
remotion-video-production：面向品牌内容生产的可编程视频制作。通过五个结构化步骤指导视频创作：规格定义、场景大纲、素材准备、React 合成实现和 QA 渲染。支持多种宽高比（16:9、1:1、9:16）和风格（快速、沉稳、电影感）。
skill-remotion-geist：使用 Vercel 的 Geist 设计系统美学创建 Remotion 视频。包含深色主题、Geist 字体、弹性动画工具和设计令牌。
remotion-motion-graphics：让 AI 生成广播级动态图形。包含动态文字、AI 工作流图表、电影级镜头运动、终端演示等。强制在每次构建前确认格式（4:3 或 9:16）和背景风格，并严格执行“零霓虹灯”政策——禁止霓虹、发光、光晕、赛博朋克风格。
如何安装 Remotion 技能
安装官方技能包
最简单的方式是安装 Remotion 官方技能包：
npx skills add remotion-dev/skills安装特定技能
如果只需要某个具体技能，可以单独安装：
npx skills add https://github.com/vercel-labs/json-render --skill remotion
这条命令安装的是 Remotion 渲染器技能，用于从 JSON 时间线规格生成视频。
安装 Geist 风格技能
npx skills add vercel-labs/skill-remotion-geist安装后，使用 /create-remotion-geist 触发，或直接说“用 Geist 样式创建一个 Remotion 视频”。
安装动态图形技能
npx skills add liamrjohnston/remotion-motion-graphics-skill适用于 Claude Code、Codex、Cursor 等 60 多个 AI 智能体。
在创建项目时安装
当你用 bun create video 创建新的 Remotion 项目时，也会被询问是否添加技能。
应用场景
场景一：技术教学视频
你想做一个讲解“如何安装某个软件”的文字讲解视频，用在 PPT 里。以前你得录屏、剪辑、配音，现在用 Remotion 技能，让 AI 直接生成一段带文字动画的教学视频。不需要任何视频剪辑软件。
场景二：规模化个性化视频
每个用户看到的视频都不一样——想想 Spotify Wrapped、GitHub Unwrapped、 onboarding 引导视频。一个模板，成千上万个输出。将用户数据作为 JSON props 传入，渲染出每个用户专属的视频。
场景三：自动化社交媒体内容
从实时数据（统计、排行榜、产品指标）自动生成每日或每周的视频帖子，不需要任何人触碰时间轴编辑器。适合需要持续产出短视频内容的运营团队。
场景四：动态广告和营销视频
替换客户名称、产品图片、定价——同一个模板，无限变体。通过 API 或 Lambda 在服务端渲染。
场景五：品牌视频批量生产
从文本指令生成自动化视频，以一致风格大规模生产品牌视频。适合需要大量产品介绍、 onboarding 引导和营销视频的团队。
使用案例
案例一：5 分钟生成一个技术讲解视频
一位技术博主过去用 AI 视频生成工具，每条片子的片头片尾都得手调关键帧，文案改了视频要全部重渲染。后来他把时间轴拆成一帧一帧的 React 组件，让 AI 改一个 <Sequence> 里的文案，整段动画自动重排。
安装了 Remotion 技能后，他只需要对 AI 说“做一个讲解如何安装 Claude Code 的文字讲解视频”，AI 就能自动生成完整的 Remotion 代码和渲染结果。片头从“加个粒子”到“加粒子 + 改颜色 + 调时间”全由一句话搞定。
案例二：广播级动态图形全自动生成
Promptible 团队用 Remotion Motion Graphics Skills 制作了一批动态图形视频。所有图形完全由 AI 代理生成，没有任何人触碰代码或关键帧。代理会先确认输出格式（4:3 横屏或 9:16 竖屏）和背景风格（暖光、干净深色、浅色网格、深色网格），然后才动手。最终产出的视频包含品牌标识动画、产品 UI 展示、终端演示等多种类型。
案例三：产品介绍视频的快速迭代
一个 SaaS 团队需要每周更新产品功能介绍视频。以前的做法是：打开剪辑软件 → 替换素材 → 调整时间轴 → 导出 → 发现文案错了 → 重来。整个流程耗时半天。
安装 Remotion 技能后，他们把视频模板写成 React 组件，产品文案存在 JSON 文件里。每周更新时，只需要修改 JSON 中的文案，重新运行渲染命令。AI 会自动处理所有动画时间、转场和布局调整。整个过程从半天缩短到 10 分钟。
案例四：地图动画解说
一个地理类内容账号需要制作“从洛杉矶到纽约的路线动画”视频。用 /remotion-maps 技能，AI 能自动生成带有 Mapbox 地图、动画路线和跟随镜头的 Remotion 代码。不需要手动操作地图工具，不需要逐帧设置关键帧。
总结
Remotion 技能解决的核心问题是：AI 不擅长用鼠标拖拽时间轴，但擅长写代码。那就把所有视频操作变成代码。
视频 = React 组件：AI 最擅长的领域，没有学习曲线
安装简单：一行
npx skills add命令技能丰富：官方 10+ 技能 + 社区贡献，覆盖地图、动态图形、品牌制作等各个方向
如果你需要频繁制作视频内容，或者想让视频生产变得像写代码一样可控，Remotion 技能值得一试。装上一个，让你的 AI 助手从“会写代码”变成“会做视频”。
◯ 评论 0