运动实验室
有明确指令的动态影片：每个形容词变成一个数字，每次跟进都是一条带测量的记录，
而影片展示的是真实事物的运作。参考作品：本技能中的 examples/cofoundr/ 目录
(SPEC.md, compositions/, REVIEW.md, preview.mp4)。在本次会话中首次构建之前，请先阅读它。
加载 hyperframes 以获取渲染契约，然后按照以下步骤操作。hyperframes 规则在格式上优先；
本技能在故事、视觉和流程上优先。
1. 阅读源代码
在写任何内容之前，先阅读主题本身：代码仓库、README、主要路由或流水线文件、 定价、实时网站。提取：
- 机制：真实的步骤顺序（函数名、API 调用、阶段）。
- 真实数字：数据集大小、计数、权重、时间、限制。绝不凭空捏造一个数字。如果源代码没有提供某个值，则要么删掉它，要么在 REVIEW.md 中标记为“示意性”。
- 品牌：强调色十六进制码、辅助色、Logo SVG、字体、任何样式锁定文件。
- 一个开发者可能会引用的意外细节（一个钳位、一个回退链、一个曾上线的缺陷）。
如果对方提到了源代码未使用的技术（赞助商、推文里的工具），不要画蛇添足。直接说明并询问其作用。
2. 编写 SPEC.md（有明确指令的提示）
模糊的提示（如“酷炫、高级、现代”）会变成深蓝、发光环、粒子和一个虚构的标语。
有明确指令的提示才会生成真实的影片。从 references/spec-template.md 在项目根目录下编写 SPEC.md。每一行都是一个数字：
- 目标、输出（默认为 1080x1080、60 fps，针对 X）、时间（秒数 x 60 = 帧数）。
- 视觉风格：背景色、墨水色、静音色、规则颜色、强调色及其含义、显示字体和正文字体（带 px 大小和字间距）、卡片圆角和阴影。
- 元素：观众必须识别的每一个事物，来自产品真实 UI。
- 运动：按角色区分的缓动函数、持续时间和交错帧数（参见
references/numbers.md）。 - 镜头：帧范围、每个镜头一个主要动效、观众看到的内容、切换到下个镜头的衔接方式。
- 禁止项和 QA（需要检查的帧以及每帧必须展示的内容）。
3. 故事结构（cofoundr 影片成功的要素）
- 第一帧就抓住眼球。 第一帧就是缩略图。钩子句子已经在上面出现，使用衬线显示字体、左对齐、强调色标记一个词。旁边放置一个巨大的品牌形状。 示例：“我找不到联合创始人。”配上蓝色圆形。
- 一个完整的工作示例贯穿整个机制。 一个真实输入（用户的 LinkedIn URL、一个真实的查询）进入产品卡片并经过每个阶段。钩子中的形状会延续到卡片中（变成头像），因此观众永远不会跟丢线索。
- 顶部阶段轨道 命名真实阶段（“丰富你的信息、搜索 7 亿人、评分 30 人、撰写介绍”）并在画面到达时点亮每个节点。这是内置于影片中的架构图。
- 每个阶段都有自己的画面形状：输入字段、从 7 亿缩窄到 30 的点的场域、按分数排序的条形图（保留前 10 并使用强调色）、正在打出结果的卡片。相似的线条绝不会使用相同的画面。
- 结尾 = Logo 具有意义。 两个形状（你和匹配对象）滑动合并成 Logo，字标淡入，一行关键数字。保持 2 秒以上，完全静止。
时长 15-17 秒。如果对方想要循环，则短于 15 秒。
4. 视觉风格
默认使用产品自身的浅色应用壳，而不是深色虚空：背景色如 #f0f2f8，白色卡片圆角 28 并带有 0 18px 40px rgba(15,23,42,.08) 阴影，墨水色 #0f172a，静音色 #64748b。
显示字体：品牌的衬线字体（下载到 assets/fonts/，在每个使用它的场景中使用 @font-face）。正文字体：Inter 500/700。文本至少以 28 px 大小读取。强调色每帧只标记一个焦点。
禁止使用：深蓝虚空、发光、辉光、霓虹、粒子、紫蓝渐变、玻璃卡片、等宽大写标签、药丸形徽章、所有内容居中、每个元素都淡入、落地后漂移的标题、放置在角落的 Logo、一排三张卡片、KPI 网格、真人的面孔或姓名作为虚拟候选人。
5. 构建
- 在
<slug>-video/中执行npx hyperframes init <dir>。根目录的index.html挂载 3 个场景：hook、机制场景（UI 动作时保持连续帧）、payoff。 - 为所有随机数种下种子（mulberry32）。生成的点和条形图属于一个计时场景的子元素。
- 每个补间动画使用
fromTo；对于同一目标的重复fromTo，在第一次之后设置immediateRender: false。 - 在机制场景中保留一个时间偏移辅助函数（
const at = (t) => t + …），这样调整时间只需修改一行，而不是二十行。 - 可能更改的副本（URL、标题）放入组合变量中。
6. 实验室循环（带证据的跟进）
永远不要相信第一次构建。每次迭代后：
- 执行
npx hyperframes check --json；修复所有错误。line_unread意味着需要延长行显示时间（每个词 0.5 秒 + 0.3 秒）或减少文字；切勿缩小字体。 - 执行
npx hyperframes snapshot --at <每个镜头的中间和结束帧>并查看接触印样。 - 将每个问题写成一个带编号的跟进，并附上数字，就像参考输出中打印的那样：“nead 标签在屏幕上停留 0.56 秒，最低要求 1.27 秒：在 0.9 秒时让其出现，并将之后 1.6 秒的所有内容向后移动 +0.6 秒”。将这些问题记录在 REVIEW.md 中。
- 渲染完成后，从 MP4 文件中提取接缝帧（
ffmpeg -vf "select='eq(n\,F1)+eq(n\,F2)',scale=360:-1,tile=Nx1"）并查看它们。
7. 音乐
使用用户提供的曲目（将其复制到 assets/audio/）。如果没有提供，则向用户索取一首，或者提供通过代码从帧号合成的配乐（参见 references/sound.md）。
- 执行
python3 scripts/find_drop.py <track>打印响度图以及最大的重音，包含精确的起始点和周围的节拍。 - 选择影片的高潮时刻（Logo 形状接触、结果落地）。计算它实际发生的帧号（对于
back.out(1.4)缓动，形状在大约 23% 的补间时长时接触）。 data-media-start= 重音起始时间 − 高潮时间，对齐到最近的节拍，这样影片从第一拍开始。声音应比画面 晚 0-1 帧，绝不提前。<audio id="music" class="clip" data-start="0" data-duration="<影片时长>" data-media-start="…" data-volume="1" data-fade-in="0.05" data-fade-out="1.2">。- 渲染，然后测量：
npx hyperframes audio <mp4> --json必须显示在离高潮帧一帧之内有一个起始点；响度 −16 到 −14 LUFS，真实峰值 ≤ −1 dBTP。说明这是测量结果，而非主观感受。
8. 交付
- 执行
npx hyperframes render -f 60 -q delivery -o renders/<slug>.mp4，然后使用ffprobe检查尺寸、fps 和帧数。 - 将 MP4 发送给用户。
- REVIEW.md：创意决策、测量内容、最弱的节拍、故意保留的警告。
- 以用户的语气草拟帖子（默认：全小写、钩子在前、短行、机制以
>步骤列出、一个来自代码的真实细节、无夸夸其谈的词语）。绝不发布它。