video-shotcraft 是把 Claude Code / Codex 变成动效工作室的开源 Agent 技能（Apache-2.0，11.1K Star）：用 Remotion 完成分镜、动画与声音设计，产出电影感产品宣传片。含 157 张镜头配方卡、214 条动态样片、每卡的 TSX 参考实现、36.2 秒纸墨琥珀风成片模板、九种主题、149 个分类音效与 5 首 BGM，另附浏览器动效工作台与剪映工程导出。

Video Shotcraft：让 Agent 做出电影感产品视频的镜头配方库

技能介绍

video-shotcraft 是一个把 Claude Code / Codex 变成动效工作室的开源 Agent 技能（Apache-2.0 协议，11.1K Star）。把产品交给它，它会用 Remotion 完成分镜、动画与声音设计，产出一支电影感的产品宣传片 / 营销视频 / 发布视频 / 功能演示——真实页面截图、2.5D 运镜、节奏卡点和电影级 SFX 全部包含。

它解决的不是"给个提示词生成一段视频"，而是把专业动效工作室的工序拆成可检索、可复用的资产：157 张镜头配方卡记录用途、能量、建议时长、参数、实现要点与已知坑；每张卡都配原生 Remotion 组件（归一化进度 t 驱动、逐帧确定性）；再加视觉验收准则、BGM 卡点方法与声音设计判例。模板支持一键切换 纸质 / 现代浅色 / 暗黑 / 清新鼠尾草 / 珊瑚点缀 / 柔和鸢尾 / 深海蓝 / 黑曜紫 / 复古牛皮纸 九种主题，保留文案与剪辑，预览与导出使用同一主题。

适用场景

需要给 Web / 桌面产品做宣传片、营销片、发布视频的团队与独立开发者
想用 AI Agent 独立完成分镜、动效与声音设计，而不是只做素材生成的人
需要大量可复用镜头动效（字卡、转场、2.5D 运镜、数据动画）的动效设计项目

核心能力

↔ 左右滑动查看完整表格

内容	说明
157 张镜头配方卡	记录用途、能量、建议时长、参数、实现要点与已知坑
214 条动态样片	覆盖 214 个样式，可在在线 Gallery 直接预览、搜索和筛选
Remotion 参考实现	每张卡对应经过调校的 TSX demo，包含实际缓动与时序参数
完整成片模板	36.2 秒、1920×1080、30fps、10 镜头的纸墨琥珀风产品宣传片
组件与素材	2.5D 页面相机、字幕、闪切、数字滚动、音效与素材采集脚本
制作方法论	从素材采集、风格定调、分镜，到声音设计、节奏卡点与最终验收
剪映工程导出	成片可装进剪映继续编辑：镜头变速 / 字幕 / 音轨全开放（Mac 剪映 11.2 实测）
动效工作台	交付后自动打开的浏览器时间线编辑器，可改镜头、变速重排、拖入 216 个 demo 动效再导出

镜头卡按类别组织：opening、ui-entrance、typography、transition、camera、data、effects、interaction、rhythm、outro 等，找镜头时先定类别再挑卡，和"找音效先定类别再挑音色"是同一套检索逻辑。

动效工作台：交付后继续改

交付后 skill 会主动打开一个剪映式的浏览器工作台（node workbench/scripts/open.mjs ）。片子按原始镜头拆成镜头 / 转场 / 字幕 / 音效多轨；选中任意镜头，字标、文案、字号、颜色在属性面板里逐项改，预览即时跟随；镜头可挪、可裁、可变速；216 张 demo 动效从素材库直接拖上轨；改完用 Remotion 一键导出。预览与渲染逐帧一致（像素级校验）。

快速开始

最直接的方式：把仓库链接丢给你的 agent。在 Claude Code / Codex 里说：

帮我安装这个 skill：https://github.com/Vincentwei1021/video-shotcraft

也可以用 skills CLI 或手动安装：

npx skills add Vincentwei1021/video-shotcraft

git clone https://github.com/Vincentwei1021/video-shotcraft.git
cd video-shotcraft
ln -s "$(pwd)" ~/.claude/skills/video-shotcraft   # Claude Code
# 或
ln -s "$(pwd)" ~/.codex/skills/video-shotcraft    # Codex

装好后直接提需求，可以点名镜头卡：

用 video-shotcraft 给我的桌面产品做一支宣传片。
用 deck-deal-flyin 和 row-embed 两张镜头卡展示这个功能。
参考 spotlight-hero-card，为这个页面设计一个产品特写镜头。

没指定镜头卡时，skill 会先介绍现成成片模板并询问是否采用；也可以先在在线 Gallery 里挑好镜头再开始。

成片模板与出片路径

内置 Ink Press（墨压） 模板是一支已验收的完整宣传片：36.2 秒、1920×1080、30fps、10 个镜头的纸墨琥珀风，含 2.5D 真实页面运镜、字卡、转场和配好的电影感 SFX。直接说"用 video-shotcraft 的 Ink Press 模板给我的产品做一支宣传片"，agent 会替换成目标产品的截图、文案和品牌信息，复现同等质感——这是最快、质量最有保障的出片路径。

Headless / CI 环境（实测 2 核、Node 22）有三个坑，可一个参数解决：低核机器加 --concurrency=1；用 chrome-headless-shell 而不是完整版 Chrome（旧 headless 模式已被移除）；CDN 不可达时用 --browser-executable= 指定本地二进制。

项目结构

video-shotcraft/
├── SKILL.md                 # Agent 使用入口与核心制作规则
├── references/
│   ├── pipeline.md          # 完整制作流水线
│   ├── shots/               # 157 张镜头配方卡
│   ├── sequences/           # 可复用的全片结构与桥段模板
│   ├── aesthetic-rules.md   # 视觉验收准则
│   ├── music-beat-sync.md   # BGM 节奏分析与卡点方法
│   ├── sound-design.md      # 声音设计方法与判例
│   ├── jianying-export.md   # 剪映工程导出方法
│   └── workbench.md         # 动效工作台：成片接入契约 + 可编辑性规则
├── demos/                   # 镜头卡的 Remotion 参考实现
├── gallery/                 # 在线样片画廊的静态站点
├── template/                # 可直接运行的完整成片模板
├── jianying-export/         # 剪映草稿安装模块
├── workbench/               # 交付后的动效工作台（Vite + Remotion Player）
└── assets/
    ├── lib/                 # 可复制使用的 Remotion 组件
    ├── scripts/             # 页面素材采集脚本
    └── audio/               # 5 首 BGM + 149 个音效（按场景分 16 类）

音频、素材与授权

音效按场景 / 材质分 16 类（transition、impact、riser、camera、ui、text、paper、film、light、data、scifi、mech、glass、fluid、crowd、counter），来源与许可见 assets/audio/ATTRIBUTION.md。模板内的产品截图为演示素材，对外发布成片前请替换为目标产品自己的截图，并确认数据、客户信息与个人信息是否需要脱敏。

镜头配方源自对 ClickUp、Perplexity、Slack、Notion、Figma、Framer、Raycast、Pitch、Miro 等优秀产品宣传片动效语言的研究学习，卡片记录的是从零重新实现的技法（时序、缓动、编排），仓库不含上述影片的任何素材、画面或品牌资产。项目依赖 Remotion（有自己的许可协议：个人与小团队免费，公司可能需要付费许可）与 Mixkit 的免费商用音频素材。