什么是 product-film？
product-film 是一项 Claude Code 技能，用于通过代码创建具有演示片质量的产品影片。它可以借助 Remotion 制作落地页循环视频、发布视频、宣传片或演示片段。
这项技能不会套用通用的视觉风格，而是会研究你的产品代码仓库。它会检查设计规则、设计令牌、组件、徽标、线上网站以及产品可以做出的宣传声明，然后利用这些材料制作影片，使其在视觉和声音上都像是由你的产品团队直接完成的。
整个流程具有协作性。Claude 会询问影片的使用位置、时长、音乐、功能、文字、转场和可选视觉元素。随后，它会将最终确定的品牌决策记录到 videos/BRAND.md，创建节拍表，展示风格帧，构建动画，生成审阅材料，并渲染经过验证的交付文件。
主要功能
- 设计系统发现： 检查规则文件、设计令牌、组件、徽标、线上产品和已批准的宣传声明。
- 产品专属访谈： 根据你的实际功能和组件提供选项，而不是使用通用占位内容。
- 持久化品牌套件： 将你的决策保存到
videos/BRAND.md，其优先级高于技能默认设置。 - 故事与风格规划： 生成节拍表，并在完成构建前通过三个风格帧进行确认。
- 音乐感知式剪辑： 测量节拍网格，按小节切分音乐，并将音效放置在峰值位置。
- 基于 Remotion 的动画： 构建一个组合，使每一帧都是时间的纯函数。
- 结构化审阅： 在交接节点生成静帧、联系表和半分辨率草稿。
- 经过验证的交付： 渲染带运动模糊的 240 fps 母版，并检查解码后的文件的色彩、时长和无缝循环效果。
- 多种输出： 生成静音落地页循环视频、带音乐版本、WebM 文件和海报。
要求
安装技能前，请确保你的环境满足以下要求：
- Claude Code。该技能运行本地工具链，无法在 Claude 聊天应用中使用。
- Node.js 和 Bun。
- 用于运行 Python 工具的 uv。
- 你拥有合法使用权的音乐。
该技能会将 Remotion 添加到你的项目中。Remotion 对个人和小型团队免费使用，但大型公司需要公司许可证。请在 remotion.dev/license 查看相关条款。
Python 脚本会在需要时通过 imageio-ffmpeg 获取 NumPy 和完整的 FFmpeg 构建版本，因此这些依赖不会安装到系统范围内。
安装技能
选项 1：通过 Claude Code 插件市场安装
在 Claude Code 中添加 product-film 市场并安装插件：
/plugin marketplace add Rieranthony/product-film-skill
/plugin install product-film@product-film-skill如果你希望技能在 Claude Code 环境中可用，这是最直接的安装方式。
选项 2：手动安装技能
你也可以克隆代码仓库，并将技能复制到个人 Claude Code 技能目录中：
git clone https://github.com/Rieranthony/product-film-skill
mkdir -p ~/.claude/skills
cp -R product-film-skill/plugins/product-film/skills/product-film ~/.claude/skills/复制的文件夹包含整个制作流程中使用的工作流说明、参考资料、模板、动画工具、音频工具、审阅脚本和渲染脚本。
选项 3：与团队共享技能
如需将技能纳入共享代码仓库，请将其文件夹提交到以下位置：
.claude/skills/product-film/这样，使用 Claude Code 的团队成员就能在项目中使用该技能。
创建你的第一部产品影片
第 1 步：打开产品代码仓库
从你希望展示的产品代码仓库中运行 Claude Code。这一点很重要，因为该技能依赖组件、设计令牌、规则、徽标和产品内容等本地项目材料。
第 2 步：请求制作影片
请求 Claude Code 创建影片，并说明目标时长、投放位置和音乐。README 提供了以下示例：
为这个产品制作一部 45 秒的落地页视频，使用这首歌。
你不必在初始请求中定义所有创意细节。技能会在开始完整制作前，通过访谈进一步确认。
第 3 步：完成发现
Claude 会快速检查你的设计规则、令牌、组件、徽标和允许使用的宣传声明。这一发现阶段会为影片提供符合产品特性的视觉和编辑基础。
请确保相关项目文件可在代码仓库中访问。结果的质量和准确性取决于 Claude 能否检查真实的产品材料。
第 4 步：回答创意访谈
技能会询问影片的播放位置、运行时长、使用的音乐以及应展示哪些功能。它还会提供以下可选元素：
- Logo 动画或现有吉祥物。
- 逐词出现的大号强调文案、字幕，或完全不显示屏幕文字。
- 与节拍同步的魔法移动转场、镜头移动或剪辑。
- 光标交互、合作伙伴 Logo、证明性时刻以及品牌纹理。
这些选择都是可选的。只选择能够支持产品和预期观看场景的元素。
步骤 5：审阅品牌套件和故事
Claude 会将调研结果和你的访谈回答写入：
videos/BRAND.md此文件优先于技能的默认创意选择。技能还会准备节拍表，并在制作完整影片前展示三个风格帧。
利用风格帧审阅来确认字体、色彩、构图、组件处理方式以及整体品牌契合度，然后再继续动画制作。
步骤 6：让技能处理音乐
音乐工作流会测量节拍网格，按照音乐小节裁剪选定的歌曲，并将音效与其峰值对齐。这样，场景切换和重要视觉时刻就能拥有音乐结构，而不必依赖任意的时间安排。
步骤 7：制作并审阅影片
技能会创建一个 Remotion 合成，并将每一帧建模为时间的纯函数。它会使用访谈期间选定的转场方式连接各个场景。
审阅期间，Claude 会在交接点生成静帧、联系表和半分辨率草稿。你可以检查这些输出、提出修改要求，并在最终渲染前批准制作方向。
步骤 8：渲染并验证交付物
最终流程会生成带有运动模糊的 240 fps 母版，然后生成所需的交付格式，包括：
- 适合产品页面使用的静音循环版本。
- 包含音乐的版本。
- WebM 版本。
- 海报图片。
生成的文件会经过解码和检查，以验证色彩、时长和无缝循环。
了解项目结构
该技能由工作流文档、专用参考资料、模板、可复用动画工具和制作脚本组成：
plugins/product-film/skills/product-film/
├── SKILL.md
├── reference/
├── templates/
│ ├── BRAND.md
│ ├── film-prompt.md
│ └── kit/
└── scripts/
├── beats.py
├── audio-edit.py
├── stills.ts
├── render.ts
└── verify.pySKILL.md包含工作流、制作默认设置和已知陷阱。reference/涵盖调研、访谈、创意元素、叙事、动画引擎、音乐、审阅和渲染。templates/BRAND.md提供产品设计套件的填写模板。templates/film-prompt.md提供可复用的影片简报。templates/kit/包含用于时间网格、弹簧、摄像机、光标、魔法移动、强调文案、抖动和调试叠加层的工具。beats.py使用 NumPy 从歌曲中推导节拍网格。audio-edit.py按照音乐小节剪辑歌曲。stills.ts生成审阅静帧。render.ts创建最终渲染结果和交付物。verify.py解码并验证输出文件。
高级技巧
将 BRAND.md 视为创意事实来源
由于 videos/BRAND.md 会覆盖技能的默认设置，请仔细审阅它。确保其中记录了产品的视觉规则、语气、已批准的声明以及访谈期间确定的创意选择。
让格式匹配发布目的地
告诉 Claude 影片将在哪里播放。落地页循环与发布视频或演示片的要求不同。发布目的地还有助于确定最终体验应当是静音、以音乐为主、文字密集，还是无需文字也能理解。
使用真实的产品素材
让技能以实际的设计令牌、组件、Logo、功能和声明为基础。这是项目目标的核心：制作一部看起来仿佛由产品本身打造的影片。
在审阅检查点做出决策
使用三个风格帧尽早评估制作方向。之后，在批准高成本的最终渲染前，检查交接静帧、联系表和半分辨率草稿。这些检查点旨在于视觉和时序问题仍易于修正时及时发现它们。
有目的地选择可选元素
Logo 动画、吉祥物、强调文案、字幕、镜头移动、光标交互、合作伙伴 Logo、证明性时刻和纹理都属于可选元素。不要把它们当作清单逐项添加。选择能够最清晰地传达所选产品功能的元素。
制作前确认音乐版权
该工具可以分析和编辑歌曲，但不会授予你使用音乐的权限。在公共落地页、发布视频、宣传片或演示片中加入曲目之前，请确认你拥有必要的权利。
检查 Remotion 许可
product-film 技能自身的文本和代码采用 MIT 许可证。Remotion 有单独的许可条款，因此大型企业应在生产环境中使用它之前，确认已取得所需的企业许可证。
结语
product-film 将 Claude Code 转变为结构化的产品影片制作工作流。它结合了仓库调研、针对产品的访谈、持久化品牌套件、基于节拍的音乐编辑、Remotion 动画、分阶段审阅和经过验证的渲染。通过从真实的设计系统开始，并在每个检查点审阅成果，你可以制作出精致的视频资产，同时保持与产品身份的一致性。