Codex+Remotion复刻百万动画特效：喂饭级教程
前阵子刷到一条 12 秒的动效片头，播放 400 多万，评论区一半人在问用啥做的。我拆开看了下，Remotion 写的逐帧动画，代码是 Codex 补的，两个晚上搞完，前后改了 11 轮。这套路子真不难，难的是你不知道该给 AI 喂啥，喂得粗，它就还你一堆没法用的东西。
一、先把环境整明白
Remotion 是个用 React 写视频的框架，现在稳定在 4.x，跑在 Node 18 以上，Windows 和 Mac 都能跑。终端敲 npm create video@latest，选空白模板，它会给你一个能预览的工程，src 放场景，public 放素材。Codex 这边装 CLI，npm i -g @openai/codex，登录 ChatGPT 账号就能用。Plus 会员 20 美元一个月，我一个月做四五条片子，额度从来没跑满过。
- Remotion 4.x：个人和小团队免费，公司超过 3 人要买授权
- Codex CLI：跟着 ChatGPT Plus 走，不用单独付费
- 字体：思源黑体、阿里妈妈东方大楷，商用免费
- 参考素材：存 3 张目标效果截图到 refs 目录
还有个小细节，Remotion 的时间轴按“帧”算不按秒，30fps 下 12 秒就是 360 帧，所有参数都得换算成帧。这一点没搞明白，后面元素出场顺序全是错位的，改起来特别费劲。
素材准备也占时间。三张参考图我一般从同一支片子里截，色温和构图统一，Codex 照着调色号不会跑偏。字体提前定好，别等渲染完才发现商用授权有问题。动画里最贵的不是特效，是找图和字体，素材乱，后面全乱。
二、让 Codex 写对动画的关键
第一步：把分镜翻译成参数
别跟它说“做个酷炫片头”，它一定给你整出一堆看不懂的东西。我一般先手写一份三十行的 spec，写明画布 1920×1080、30fps、总长 12 秒、元素入场顺序、缓动用 spring 阻尼 200，再把三张参考图的路径写进去。Codex 拿到这种粒度的描述，第一版就能用个七成，剩下三成调参数就行。
第二步：一次只改一个文件
它有个毛病，爱一次性重构整个工程，改完你都不知道哪坏了。我的做法是每次都加一句“只修改 src/scenes/Intro.tsx，不要动其他文件”，再配合 git 提交，改坏了一眼就能回滚。渲染就两条命令，npx remotion studio 本地预览，npx remotion render 出片，先出 720p 试水，满意再上 1080p，能省一半时间。
- 截三张参考帧放进 refs 目录
- 把 composition 的 props 写成表格，每个元素标好出现帧
- 让 Codex 一次只改 src/scenes 下面的一个文件
- npx remotion studio 预览，盯着节奏和留白
- npx remotion render 出片，先 720p 再 1080p
三、真实成本账
第一个活是帮朋友做的奶茶店开业片头，8 秒，Codex 改了 11 轮，1080p 在 M1 上渲染了 40 分钟。收了 800 块，他说比找工作室报价便宜一半。难点不在动画，在字体版权，最后换成思源黑体才敢交付。
第二个是我自己账号那条 12 秒，播放 6.8 万，涨粉 1200。素材就三张实拍图加两个色块，全靠缓动做出高级感。算下来成本就是电费加 20 美元的会员，摊到一条不到 5 块钱，比买素材便宜太多。
也有翻车的时候。有次想做液体流动，Codex 用了 SVG 滤镜，渲染出来糊成一片，折腾到凌晨两点，最后换回 CSS 渐变加位移，反而干净。这种坑老铁们都躲不过，区别是有人记下来，有人重犯。
交付前我固定做三件事：1080p 和 720p 各出一次，检查小字清不清楚；在手机上完整放一遍，看前 3 秒抓不抓人；工程 push 到仓库，素材单独打包。客户临时改需求，能省一半沟通成本。
四、容易踩的坑
- Remotion 里别用 requestAnimationFrame，必须用 useCurrentFrame
- 字体要先 loadFont，不然渲染出来全是方框
- Codex 有时瞎编 API，让它先读 node_modules 里的类型定义
- 中文标题手动调 letterSpacing，默认挤成一团
还有个隐藏坑，渲染默认开多线程，内存小的机器容易崩。加一句 --concurrency=2 就稳了，代价是慢两三分钟，但好过跑到一半失败。
五、常见问题
问：不会 React 能整吗？
答：能。八成就是摆位置加关键帧，Codex 补代码，你负责看预览、说哪里不对。遇到报错整段贴回去，它自己会修，别自己瞎猜。
问：要花多少钱？
答：个人用 Remotion 免费，ChatGPT Plus 20 美元一个月，渲染吃自己电脑的 CPU，一条 12 秒 1080p 大概 30 到 40 分钟，电费可以忽略。
问：手机上能看吗？
答：能。导出 MP4 走 H.264，竖屏就把画布设成 1080×1920，别用 4K，文件太大发不出去，微信还会再压一遍画质。
先做一条 5 秒的试试，别一上来就整 30 秒大片，节奏没理顺，越长越乱。