
video-shotcraft:157 张镜头卡,让编码 Agent 排出产品宣传片
今天拆的是 video-shotcraft:把 157 张镜头配方卡装进 Claude Code 或 Codex,用一条模板指令排出产品宣传片。文章给全上手路径、已知的渲染坑、效果下限的真实参照,以及它和 HyperFrames、hypit 在链条上的位置。
这一期看的方案叫 video-shotcraft:一个装进编码 Agent 里的镜头卡库。给 Claude Code 或 Codex 装上它,再交一句需求和你自己产品的截图,它会排出分镜、写好动效、配上音效,用 Remotion 渲出成片。仓库公开在 GitHub,现在 8.6k star、779 fork,许可为 Apache-2.01。
它和 HyperFrames、hypit 处在链条的不同位置。HyperFrames 管的是用 HTML、CSS 和 GSAP 写出合成、再确定性渲染成 MP4;hypit 管的是给 Agent 一门描述视频工作流的语言,把一支参考视频拆成能重跑的结构23。video-shotcraft 站在 Remotion 上,交给你的是别人已经调好的镜头和动效资产。
157 张镜头卡,和一条现成的模板
仓库的结构更像一套教材。
SKILL.md 是 Agent 的入口和制作规则,references/ 放端到端管线、镜头卡和声音设计方法,demos/ 是每张卡对应的 Remotion 实现,template/ 是一支能直接跑的成片工程1。核心资产是 157 张镜头配方卡。每张卡写明用途、能量、建议时长、参数、实现要点和已知坑,配 214 个动效样式、214 个动态预览;官网首页把这几个数字和 36.2 秒的现成模板排在一起4。音频同样打包好了:149 个音效按场景分成 16 类,另有 5 首可选 BGM,都来自 Mixkit 的免费商用授权1。
内置模板叫 Ink Press:36.2 秒、1920×1080、30fps、10 个镜头,纸墨加琥珀色,含真实页面的 2.5D 相机运动、标题卡、转场和一整条音效1。
数量口径在这份材料里没统一。仓库右侧 About 栏和 README 顶部写的是 157 张卡、214 个动态预览,README 中间那段 8 月的更新日志说的还是"从 104 张扩到 152 张、209 个预览"。8 月确实新增了 48 张卡,旧数没跟着改掉1。

SKILL.md、demos、template、workbench 这几层,右侧 About 栏写的是 152 张卡,比 README 顶部的 157 张少。1从安装到第一条成片
装它一条命令:
npx skills add Vincentwei1021/video-shotcraft。也可以 clone 下来软链到 ~/.claude/skills/video-shotcraft,Codex 用户把路径换成 ~/.codex/skills/1。最快的出片路径是模板。跟 Agent 说"用 Ink Press 模板给我的产品做一支宣传片",它会换掉截图、文案和品牌色,复现同一套质量。想自己控制镜头,就把在线 Gallery 里挑好的卡片名写进指令,比如指定用
deck-deal-flyin 和 row-embed 来演示某个功能14。交付之后还能接着改。workbench 会在浏览器里开一条时间线,把片子拆成镜头、转场、字幕、音效四条轨道,文案、字号、颜色都能改,片段能移动或做变速,还能从 216 个示例动效里拖新的进来;导出仍走 Remotion,预览和成片逐帧一致。仓库另有一条剪映草稿导出,作者在 macOS 的剪映专业版 11.2 上验证过1。

无头机器上的三个坑
作者在 README 里专门留了一段,讲 2 核、Node 22 的 Linux 机器上渲染会撞到的三堵墙:核数不够时 Remotion 报"Maximum for --concurrency is 2",要显式加
--concurrency=1;新版 Chrome 和 Chromium 移除了旧的 headless 模式,把 Remotion 指向系统浏览器会启动失败,得改用 chrome-headless-shell;remotion.media 访问不通时自动下载会被拒,要用 --browser-executable= 指定本地浏览器1。这三条都出在最后一步。分镜、动效、音效都做完了,渲染起不来,Agent 收到的是一个失败信号,拿不到片子。把这几个参数先写进你的运行环境说明,比让它每次现场排查便宜。
效果下限有人替你试过
有一篇中文实测,作者拿 Claude Code 加 Remotion 做了一支历史题材视频:十多分钟跑完,花了 5.85 美元,成片给他的感觉是几个静态页面在轮播,转场只有基础的淡入淡出;他把它和生成式视频工具放在一起比过,结论是别盲目跟风5。
那篇测的是通用的 Claude Code 加 Remotion 路线,没用这套镜头卡库,也没按它的制作规范走。它标出的是这条路的起点:给 Agent 一个空项目和一句"做个视频",拿到的就是这种成片。video-shotcraft 想接的正是这一段,把分镜、动效参数、声音设计和质检标准提前写成卡片,让 Agent 少走弯路。它在你的产品上能走到哪一步,还是得跑一遍才知道。
花钱的地方在底座许可
video-shotcraft 自己是 Apache-2.0,卡片和代码拿去用没有附加条件。它依赖的 Remotion 是另一套许可:个人和三家公司以内免费,商业用途也在其中;四人及以上的团队要买公司许可;把渲染嵌进产品、做批量视频生成这类用途,按每次渲染 0.01 美元计价、每月最低 100 美元;企业版从每月 500 美元起6。
底座本身也已经为 Agent 准备好了。Remotion 官方维护一份 Agent Skills,一条
npx skills add remotion-dev/skills 就能装,另有 Codex、Claude Code、Cursor、GitHub Copilot、Kimi Code 的插件7。给自己产品做一支宣传片,这段许可通常不产生费用。打算把它做成产品里的出片功能、按量往外卖,成本会跟着渲染量走,先把这笔钱算进单价再动手。
和 HyperFrames、hypit 放在一起
| 方案 | 你给它什么 | 它给你什么 | 它在这条链上的位置 |
|---|---|---|---|
| HyperFrames | 用 HTML、CSS 和 GSAP 写的合成 | 确定性渲染出的 MP4 | 渲染底座,官网首页写的是"为 AI Agent 打造"2 |
| hypit | 一支参考视频,或一句描述 | 一套以词为锚点的工作流,换宿主、换语言、换比例都能重跑 | 视频工作流的描述语言,外加一个 skill3 |
| video-shotcraft | 你的产品截图和一句需求 | 一支还能继续编辑的产品宣传片工程 | 站在 Remotion 之上的镜头与动效资产库1 |
三者能叠着用。hypit 让 Agent 写出可重跑的工作流,HyperFrames 和 Remotion 负责把合成变成 MP4,video-shotcraft 补的是每个镜头长什么样、动效参数取多少这一层。三者的公开体量也差着一截:hypit 现在 1.4k star,video-shotcraft 8.6k star13。
今天装还是不装
今天就能装的:你已经在用 Claude Code 或 Codex,需要给产品做宣传片或功能演示片,画面来自产品的真实页面截图。装完拿 Ink Press 模板跑一支 36 秒的片子,看它到不到你能接受的下限;把那三个渲染参数先配好,免得卡在最后一步。
先收藏的:你想要生成式实拍那种画面。这套流程的画面来源是网页和桌面产品的界面,长处是动效节奏和声音设计。同类里 Remotion 官方的 Agent Skills 和插件是它的上游选项,hypit 那门工作流语言在管另一半问题37。
这一期先从这个方案开始,因为它在三者里最快能出片:一条安装命令,一条模板指令,一支 36 秒的成片。
References
- 1Vincentwei1021/video-shotcraft — GitHub
github.com
- 2HyperFrames
hyperframes.dev
- 3hypit-ai/hypit — GitHub
github.com
- 4video-shotcraft — 在线 Gallery
vincentwei1021.github.io
- 5实测避坑|Claude Code + Remotion 视频效果拉胯,和 Seedance 比差远了!
mp.weixin.qq.com
- 6License & Pricing — Remotion
remotion.dev
- 7Agent Skills — Remotion
remotion.dev
This story was produced automatically by a channel. One sentence is all it takes for Neodrop to keep producing for you.
