Vox风格动画 是做什么的？
你制作编辑拼贴风格的短视频解释视频：纸质背景、带边框和阴影的着色照片卡片、关键短语上的黄色荧光笔、红笔圈画和箭头、带大头针的地图、双帧拼贴运动，以及物理剪裁，所有元素都经过声音设计。工具包位于 kit/ 目录，渲染器位于 scripts/ 目录，工艺规则位于 references/ 目录。
最重要的规则：画面必须支撑论点。 在薄弱观点上装饰仍然是一个薄弱的视频。第二条规则：它看起来应该是手工制作的，有目的的。 工具包中的每个默认设置都会添加微小的物理瑕疵或移除数字完美感。
开始制作前：阅读以下文件
references/LOOK_BOOK.md：什么让它看起来专业，包含测量数据和18个业余表现特征。务必阅读。references/SCRIPT.md：问题 → 资料搜集 → 脚本 → 镜头列表。在撰写或计时时阅读。references/API.md：每个工具包调用。在编写页面之前阅读。references/TIPS.md：完成视频的技巧（画面、节奏、声音、真实性、传达方式）以及一个10-12秒的逐镜头辟谣示例。在制作短片钩子或辟谣内容前阅读。references/SOUND.md（录制拟音、纪录片混音、旁白）、references/ASSETS.md（许可证！）、references/QA.md根据需要阅读。
工作流程
- 问题和脚本。 一个可以回答、令人惊讶且有话可展示的问题。钩子 → 背景 → 转折 → 证据 → 收尾（一个10秒的辟谣：声称 → “并非如此” → 数据 → 让步 → 收尾，参考SCRIPT.md第7节）。创作者讲述时约215词/分钟；纪录片旁白约150-165词/分钟，每行都有方向指示。在
SOURCES.md中引用每一个事实，绝不编造数字、引文或文档；去掉数据无法支持的声明。 - 先搜集资料。 在完成脚本之前找到图片和真实素材：NASA、美国国会图书馆、史密森尼开放获取、Wikimedia、Pexels（检查每个许可证；逐帧检查每个剪辑是否有水印和烧录文字）。卡片内的素材呈现纪录片质感；仅静止图片则呈现幻灯片质感。记录文件、URL、许可证和署名。绝不提交Texturelabs文件或商业字体。不使用Vox标志或素材。绝不让模型猜测图片（
--query noimg展示了这样看起来有多廉价）。 - 镜头列表。 每一行对应一个口语句子，时间来自旁白的逐词转录：
python3 $SKILL/scripts/words.py vo.wav --inject <page>，然后在页面中使用const w = V.wordmap("#words")，并在混音中使用相同的词，以便重新录制的句子能重新调整所有时间。每行有一个主要运动。为整个视频选择一个重复出现的视觉创意。在每次场景变化时命名剪辑方式（硬切、curveCut、zoomCut、holePush、whip、paperWipe；从不使用溶解）。 - 构建。 在该技能的文件夹内工作（包含此SKILL.md的文件夹，称为
$SKILL，通常是~/.claude/skills/vox-style-animation）。运行cd $SKILL && npm run new -- <name>；它会创建videos/<name>/index.html并设置好所有路径。对于其他位置的项目，运行node $SKILL/scripts/new.mjs <name> --dir <folder>。不要手动复制页面：../../kit路径只在技能文件夹下两层有效。将图片放在videos/<name>/assets/中，并在其SOURCES.md中记录。保持默认设置，除非有理由更改：- 纸张，而非白色；着色照片；卡片 ±1.5–3°，带4%边框和柔和阴影；
onTwos: true（12帧/秒拼贴运动）；纸张保持静止（drift: 0），但对象要呼吸：对每个保持的照片使用breathe()，对卡片和剪贴画使用float()2–3像素，将一到两个scrap()移出镜头，在真实文档后面放一个ghost()（参考LOOK_BOOK第10节）；- 第一帧即可看到声明；在卡片中使用
footage()播放真实剪辑； - 保持时推镜速度为 +1–3%/秒，强调时为 +4–6%/秒；
- 在对应词汇上添加注解；三种字体风格；1–3个重点标注，每个负责一个功能；
- 在9:16比例下，顶部12%和底部20%不要放置重要内容（平台UI会覆盖）。
examples/apollo/index.html展示了几乎所有的辅助功能。对于地图，使用node $SKILL/scripts/map.mjs …。要预处理静态图片或剪辑，使用python3 $SKILL/scripts/photo_treat.py。
- 先检查静态图片。 在每次场景变化和注解处运行
node $SKILL/scripts/render.mjs videos/<name>/index.html --stills t1,t2,…。打开PNG文件并查看它们。 通读references/QA.md并修复每个问题。如果渲染因页面错误而停止，错误信息会指出缺失的辅助函数和目标。 - 渲染。 对于草稿，
node $SKILL/scripts/render.mjs videos/<name>/index.html --voice vo.wav [--music bed.mp3] --gif会混入工具包合成的提示音（音乐 -22 dB并闪避，房间环境音，-14 LUFS）。对于最终版本，使用录制的拟音： 使用--no-sfx渲染，然后运行python3 $SKILL/scripts/doc_mix.py silent.mp4 --cues cues.json --words <page> --voice vo.wav --music … --room $SKILL/kit/sfx/cc0/room_tone_office.mp3 --out final.mp4 --stems（旁白作为参考，每个样本按其峰值设置并在对应的词上峰值对齐；参考SOUND.md）。切勿单独处理效果。如果视频将要在4K分辨率下显示，使用--scale 2渲染（原生3840×2160母版）。 - 最终检查。 从MP4中提取转场处的帧。使用
ffmpeg -i out.mp4 -af ebur128 -f null -确认响度。然后报告你制作的内容、来源和许可证。
设置（每台机器仅一次）
npm install # gsap, playwright, d3-geo, topojson-client, world-atlas
npx playwright install chromium # 渲染器使用的浏览器
# 可选，重新生成纹理和声音：pip install numpy scipy pillow
# 可选，用于words.py和doc_mix.py：pip install faster-whisper numpy
# 可选，用于narration.py的保持语音特征的加速：安装带有rubberband的ffmpeg（macOS：brew install ffmpeg-full）
你需要Node 18+和ffmpeg 4.4+在PATH中。工具包是纯浏览器JavaScript；无需构建步骤。对于浏览器预览，运行 npm run preview，保持运行，然后打开 http://localhost:8080/videos/<name>/。
不可妥协项
- 仅使用真实事实，并附来源。输入“事实表”卡片是可以的。伪造的信件、收据或标题呈现为真实内容是不允许的。
- 每张图片的许可证都必须已知。借用的素材需在屏幕上显示来源标识（“档案·NASA”），或在与禁止屏幕标识的平台中显示字幕来源。
- 不要使用Vox标志或素材。“Vox风格”描述一种外观；标志意味着背书。如果用户希望屏幕上的“Vox”字样作为风格提示（许多Vox风格的视频会这样做），请使用捆绑的免费衬线字体设置，并在某处保留“Vox风格”标签，并告知商标风险；由用户决定。
- 检查地图上的争议边界。
- 避免在AI生成的图像中包含文字；所有文字应在页面中添加。
- 印度地图（及其他争议地区）：Natural Earth的边界是事实边界，而非官方边界。发布前请参阅ASSETS.md。
不与Vox Media关联、获得其认可或与其有联系。“Vox”是Vox Media, LLC的商标。
当用户的视频“看起来廉价”时
截取静态图片并对照LOOK_BOOK.md中的18个业余表现特征进行检查。通常的修复方法，按影响力排序：
- 纸质背景和照片着色。
- 双帧运动，一次只移动一个物体。
- 与词汇对应的注解。
- 卡片旋转、边框和阴影。
- 对象在进入和退出之间完全静止：添加
breathe、float、scrap。 - 声音：对关键动作使用录制的拟音，峰值对齐，置于语音之下；音乐比语音低18–24 dB。
- 用剪辑替换溶解。