| name | vibe-knowledge-video |
|---|---|
| description | Vibe知识大赏风格 AI 知识视频制作流水线——把数学/概率/哲学等硬知识拍成电影感短视频。逆向工程自抖音 @Iwanau/@Juno/叁号暗房 的 Claude Opus 5.5 代码生成视频系列。关键词：知识视频、科普视频、Vibe知识大赏、AI视频、代码做视频、抖音知识号、月老的算法、运气的形状、虚无主义视频、Canvas动画视频 |
| version | 1.0.0 |
| author | CodeBuddy AI |
| created | 2026-10-09 |
| updated | 2026-10-09 |
Vibe 知识大赏 · AI 知识视频制作
Goal: 用纯代码（HTML Canvas + Python 合成音乐）制作"Vibe知识大赏"风格的电影感知识短视频——无配音、全画面文字叙事、深空蓝黑底、历史文献再现、动画模拟推演、结尾学术引用。成片规格 1920×1080 / 30fps / 2:00–2:45 / MP4。
When to Use
用户想制作以下任一类视频时触发：
- "做一个 Vibe知识大赏 风格的视频"
- "把 XX（概念/论文/定理/哲学家/反直觉现象）拍成短视频"
- "用 AI/代码做一条知识科普视频"
- "做一条抖音知识号风格的片子"
- 用户提供一个知识点，要求"拍成大片"
When NOT to Use
- 用户要配音旁白型视频（本风格是纯文字叙事 + BGM，无 TTS）→ 确认后仍可用本 skill，但需在 brief 中注明改用配音轨
- 用户要竖屏短视频（本风格为 1920×1080 横屏，是抖音横屏知识大片）→ 若要竖屏需改画幅参数
- 用户只要图文/文章，不是视频
〇、风格 DNA（必须先读）
逆向工程自 8 条原片（详见 references/style-guide.md）：
| 维度 | 规范 |
|---|---|
| 画幅 | 1920×1080 横屏，30fps |
| 时长 | 2:00–2:45（119–166 秒） |
| 声音 | 无旁白配音。纯器乐 BGM，76–78 BPM 沉静纪录片节奏 |
| 背景 | 深蓝黑 #050510–#101028，全片一套配色不换 |
| 布局 | 左上角 @作者水印；顶部场景/时代标签带；中央动画；y≈70% 画面注释；y≈85-91% 双语旁白字幕（中文主句+英文斜体小字，每句都有） |
| 标题卡 | 15-20 秒处落《片名》：VIBE知识大赏 大写标签 + 金色衬线片名 + 副标题双语（Juno 系列标配） |
| 字幕节奏 | 每 2.5–4 秒一句旁白，一句 ≤ 20 字，停留够读完 |
| 双语 | 中文为主；旁白英文逐句对照；关键史料用原文斜体（法/德/英/拉丁） |
| 叙事弧 | 钩子→历史锚点→机制模拟→反直觉转折→现实落点→声明+引用收尾 |
| 画面密度 | 逐秒实测运动均值 3.97、静止秒 < 25%——画面必须一直在动（文字停留时也要有微动画） |
| 视觉母题 | 晾衣绳卡片 / 规则卡（金线图标）/ 文献复原（红印章）/ 万人模拟网格 / 手绘曲线 / 时间轴映射 |
| 严谨性 | 结尾必须给学术引用与免责声明；图示必须标注"示意图" |
一、总流程（七步，逐步执行，不可跳步）
选题核实 → 文案剧本 → 分镜表 → 用户确认 → 代码实现 → 渲染合成 → 自检交付
第 1 步：选题核实（Brief）
- 问用户拿：主题、希望观众记住的一句话、作者署名（默认 @用户昵称）。
- 用户没给的不要编；可以给 3 个选题建议让用户挑。
- 用 WebSearch 核实所有年份、人名、论文名、数字——错了整个片子报废。没把握的事实写进
NOTES.md，宁可不写也不要猜。
第 2 步：写剧本（script.md）
按叙事弧模板写（详见 references/narrative-templates.md），旁白总量 = 时长 ÷ 3 秒/句，例如 140 秒 ≈ 45–50 句。每句一行，标注出现时间。
每句旁白必须同时写中文主句 + 英文斜体对照（Juno 系列双语标配，如"先看37%，再出手 / Look at the first 37%. Then leap."）。
预留 15–20 秒处给《片名》标题卡（片名 + 一句话副标题 + 英文副标题）。
第 3 步：分镜表（storyboard.md）
每个镜头写清：时间区间 / 画面构图与元素 / 动作（进场-主要-出场）/ 顶部标签 / 画面注释 / 双语字幕 / 转场方式。转场必须从内容里长出来（一条线变成地平线、卡片飞出重组），禁止默认淡入淡出。 画面密度铁律（实测值）：相邻 2 秒必须有肉眼可见的变化；文字停留超过 4 秒时，中央动画区必须有微动效（卡片摆动、星点闪烁、计数滚动）。
第 4 步：用户确认
把 brief + script + storyboard 给用户看。确认后才写代码。
第 5 步：代码实现（单文件 index.html）
- 技术路线：原生 JS + Canvas 2D 为主；文献/书页/报纸再现用 HTML+CSS+SVG 分层；可选 WebGL 着色器加胶片颗粒（性能代价 ×6，慎用）。
- 页面必须暴露
window.render(t)：给定秒数画出该帧。画面只由 t 决定：随机数带固定种子、不用计时器、帧间不保存状态。 - 布局按风格 DNA 的五区落位；字幕用
drawSubtitle(t)统一绘制。 - 先跑通 3 张关键静帧（开场钩子 / 机制演示高潮 / 结尾卡）给用户看风格，确认后再做全片。
第 6 步：渲染合成
# 逐帧渲染（Playwright 无头浏览器）
python3 scripts/render_frames.py index.html out_frames/ --fps 30 --duration 140
# 合成 BGM（76-78 BPM，numpy 合成，段落起伏对齐分镜）
python3 scripts/synth_bgm.py bgm.wav --bpm 77 --duration 140 --sections storyboard.md
# 合成 MP4（帧序列 + BGM，响度 -14 LUFS）
bash scripts/build_video.sh out_frames/ bgm.wav final.mp4
第 7 步：自检交付（不过不出门）
python3 scripts/qa_check.py final.mp4
六维评分（1–10）：前 2 秒抓人 / 手机缩放可读性 / 动作自然度（无匀速滑动、无空拍）/ 画面新鲜度（每 2–4 秒有新东西）/ 构图 / 声画对位。任何一项 < 8 分：列出最严重 3 个问题（带时间点）→ 修复 → 重新渲染 → 重评，循环直到全过。 重点排查：文字重叠、溢出、默认风格复活（居中大字+渐变）、缩放后糊字、角落多余标签。
交付物：final.mp4 + script.md + storyboard.md + 抖音发布文案（模板见下）。
二、抖音发布文案模板
Vibe知识大赏 | 《标题》一句话钩子？
[2-3 句核心内容概括，含一个具体年份+人名+反直觉结论]
#vibe知识大赏 #AI把知识拍成大片了 #claude5.5 [主题词 3-5 个]
三、铁律（Gotchas）
- 字体加载完成再截图（
document.fonts.ready），否则前几帧是默认字体。 - 你听不到声音——BGM 波形要画成图检查有没有爆音/静音段。
- 用 WebGL 时先渲 1 帧确认着色器生效再渲整片（着色器渲染耗时 ×6）。
- Canvas 文字必须手动换行，禁止依赖浏览器自动换行。
- 顶部标签与水印全片位置恒定，是"系列感"的来源。
- 禁止：居中大字+渐变背景、所有元素同时淡入、满屏小字、弹跳缓动、粒子爆炸、任何模板感。
- 每句旁白停留 ≥ 2.5 秒；同一画面停留 ≤ 4 秒必须有新元素进场。
四、参考文件
references/style-guide.md— 风格 DNA 完整规范（布局坐标、配色、字体、五区结构、文献再现规范）references/narrative-templates.md— 8 条原片的叙事弧逐段拆解 + 通用剧本模板scripts/— 渲染 / 配乐 / 合成 / 自检 四件套（见脚本头部注释）