Promo Film Skill — Development skill for Claude Code

promo-film

用代码做产品宣传片 / 推广片 / 演示短片。**Remotion + React 出片** —— 片子里那台机器是按产品真实 数值重画的（或者 Playwright 抓的真机截图），全程进版本库，逐帧可复现。

一支片子在这里是一份可以编译的源码，不是一条时间线。每一帧画面都是「全局帧号」的纯函数：

export const B = {              // 节拍边界，帧（60fps）
  open: 0, files: 190, cli: 540, theme: 1000,
  push: 1400, cross: 1850, cta: 2150, end: 2420,
} as const;

export const state = (f: number): State => { /* 只读 f，返回这一帧窗口里的一切 */ };

文件树长出几行、agent 日志到第几条、指针在哪、主题插值到哪一帧 —— 全在 `state(f)` 里。 **想重排节奏，改 `B` 里那几个数字**，下游全部是相对量，动作跟着一起挪。 于是节奏能改、镜头能算、字能 diff，而且今天渲和三个月后渲逐字节一样。

**如果你是 agent**：要把它装进来 → 读下面的「安装」；已经装好、要拿它干活 → 读 [`SKILL.md`](SKILL.md)，那是操作手册，`references/` 是它按需展开的细节， 本文件只是说明书。

为什么不是剪辑软件

剪辑软件里，「把第三场缩短两秒」意味着手动拖后面每一个关键帧。截图配转场的那种片子， 观众读到的是「一堆图」，不是「有人在用这个软件」。

这里反过来：改一个数字，后面所有动作跟着挪，窗口全片不切镜，一台摄影机推、拉、摇过去。 代价是你得写代码，而且**只能拍界面**（见下面「做不到什么」）。

三条硬约束

先记住这三条，`references/` 里所有细节都是它们的推论。

**① 只有一套颜色、一套字体、一条缓动。** 颜色逐个从产品自己的 token 文件抄过来（`_tokens.css` / `theme.css` / tailwind config）， 片子里不允许出现第二套。一支片子里混三条缓动曲线，观众读到的是三只手，不是一个产品的性格。

**② 那台机器是真的。** 栏宽、字号、圆角、图标字重全按产品真实数值搭，**按逻辑像素画完再整体缩放** —— 不是把 13px 的字放大成 20px 的示意图。图标重画产品同一套字形，不引第三方图标库。

**③ 不做观众察觉不到的缓慢运动。** 一个 270 帧涨 2.2% 的推近，折算下来每帧 0.005px：读不出是运镜，只看得出字在抖 （每帧按新的亚像素边界重新光栅化）。要让画面「活着」，用入场动画，不用缓慢缩放。

第三条是本 skill 唯一一个**会毁掉整支片子、而且在时间轴上完全看不出来**的坑。 `references/camera.md` 整篇都在讲怎么躲开它，动手改镜头之前先读那一篇。

配乐是可选的，而且默认不做

**先问用户「这支片要不要配乐」，说要才做。** 多数推广片在社交平台上是静音自动播放的， 信息本来就必须全在画面里；而配错了乐的推广片，比没配乐伤害大。 **无声是一个完整的交付，不是半成品。**

用户说要，本 skill 自带一个纯代码合成器（`assets/scripts/lib/synth.mjs`，452 行， 只用 Node 标准库）：木质拨弦、有节奏的贝斯、沙锤、软底鼓、响指，外加一层压得很低的铺底。 没有采样、没有第三方素材、没有版权问题。里面**没有随机数**（噪声来自定种子的 LCG）， 所以同一份配置永远产出逐字节相同的音频，配乐和片子一样能进版本库。

要点在 `references/music.md`：调性先定（第一节有一条明确的品牌禁忌）、 「涨」靠加声部不靠加音量、重音落在与剪辑相同的帧上。想用买来的曲子也行： 覆盖 `public/bgm.mp3`，长度对齐总时长即可。

用户说不要，工程里就**不留任何配乐的痕迹** —— `` 那一层、`music` 脚本、 `make-music.mjs`、`synth.mjs`、`public/bgm.mp3` 全都不要。

安装

没有安装脚本。这个 skill 就是一份 SKILL.md + 六篇 references + 一批可以拷进工程的模板文件， 任何「能读文件 + 能跑 shell」的 agent 都能驱动。所以「装」只有两件事：把目录放到位， 让 agent 知道 `SKILL.md