HyperFrames 帧内剪切目录：用 Zoom-Through、Cut the Curve 与 Waterfall Cut 构建连续镜头语言

本文围绕 HyperFrames faceless-explainer 工作流中由**帧工人（frame worker）**在单帧合成内部构建的“帧内缝合”（within-frame seams）技术展开：当一帧的镜头序列内部出现文字/元素替换、Scene 到 Scene 的切换或逐行文本变化时，如何用四条速度匹配的剪切技术（Zoom-Through、Inverse Zoom-Through、Cut the Curve、Waterfall Cut）让它读起来像一次连续镜头运动，而不是生硬的幻灯片硬切。读完本文，你将掌握每种技术的三阶段参数模型（缩放/模糊/透明度/缓动/时长）、模糊逻辑（Blur Logic）的取值规则、变体选择表与反模式清单，并能结合仓库中的帧工人契约与转换注入器源码理解“帧内剪切”与“帧间转场”两种机制的分工边界。

什么是帧内缝合（Within-Frame Seams）

在 HyperFrames 的视频生产工作流中，画面按帧（frame）组织，每帧是一个独立的 HTML 合成（composition）。帧工人（frame worker）在 Step 5 构建帧时，会在一帧自己暂停的 GSAP 时间线（paused timeline）上完成 Z 轴缩放、模糊、透明度补间，或逐词 x 轴错峰（per-word x-staggers）——这些都属于帧内剪切（within-frame cuts）。

帧内剪切与**帧间转场（between-frame transition）**是两个完全不同的概念：

• 帧间转场由故事层（story）通过 transition_in 字段指定，由装配层的注入器（injector）从独立的注册表词汇（crossfade / blur-crossfade / push-slide / zoom-through / squeeze）盖章生成。这份注册表可在 skills/faceless-explainer/scripts/lib/transitions.json 中查看，每种类型都携带默认时长与 GSAP 模板，注入器 scripts/transitions.mjs 会按 transition_in 解析、替换令牌（__OLD__、__NEW__、__T__、__DUR__ 等）并写入主时间线。
• 帧内剪切（本文目录中的 cut-the-curve / inverse-zoom / waterfall）不是合法的 transition_in 值——它们是帧工人自己在一帧合成内部构建的，属于 worker build-recipe（Step 5 的配套配方），与 hyperframes-animation/rules/ 目录下的规则是姊妹关系，而不是第二份动效文档。

一个 Scene 是单帧内部的某个时间窗口（time window within one frame），不是帧与帧之间的边界。当一帧的镜头序列内部出现下列任一情况时，就应该使用本目录：

• 场景内（within-scene）的文字/元素替换；
• Scene 到 Scene 的剪切（Scene-to-Scene cut）；
• 文本到文本的行切换（text-to-text line change）。

此时若不做处理，画面会呈现“文本进入、停留、退出，下一段文本再进入、停留、退出”的幻灯片感（slideshow feel）。值得注意的是 zoom-through 同时存在于两个世界：作为注册表里整帧包裹式转场（transitions.json 中 "name": "zoom-through"，模板为 scale: 2.5 配合 power3.in/out），以及作为元素级的 Z 轴剪切——同一思想，不同作用域。

四条技术的统一原则

本目录共四条技术：

1. Zoom-Through——场景内文字替换，Z 轴，向观众方向移动；
2. Inverse Zoom-Through——Z 轴替换，向远离观众方向移动；
3. Cut the Curve——Scene 之间的 x/y 轴转场；
4. Waterfall Cut——逐词执行的 cut-the-curve，带错峰退出与进入。

四条技术本质上是同一条底层原则：在峰值速度处剪切，剪切两侧匹配方向与速度（cut at peak velocity, match direction and speed on both sides of the cut）。差异仅在于轴（axis）、作用域（scope）与粒度（granularity）。

在缝合处如何选择变体：

• 面对一个未完成的短语（跨多个视觉上不同的 Scene 仍在构建同一个更大的想法——多行文本、一连串连续卡片），使用 cut-the-curve / waterfall；
• 面对状态切换（转向视频的新部分——最常见的是 hook → context，或两个不同章节之间），使用 zoom-through；
• inverse zoom-through 用于到达 / 回报节拍（arrival / payoff beat）。

把这些技术串联起来，帧内的内部缝合会让人感觉像是一台摄像机在内容中连续穿行。

Blur Logic：所有 Z 轴变体通用的模糊规则

模糊（blur）在剪切处“售卖速度感”，但它必须随主体尺寸缩放：

主体（Subject）	峰值模糊（Peak blur）	原因（Why）
文本缩放（标题、行、词群）	10px	20px 时文本糊成一团无法辨认——眼睛会丢失正在追踪的词，剪切读起来像故障（glitch）而非速度；20px 时字形在剪切中途变得模糊（mushy），10px 能保持可读。
整帧表面（终端窗口、卡片、截图）	18–20px	大表面拥有能承受重模糊的边缘和纹理；整帧移动时过轻的模糊会被读成渲染卡顿（rendering hiccup）而不是运动。

两个硬性要求：

• 剪切两侧使用相同的峰值模糊——数值必须在交换帧（swap frame）处完全匹配；
• 模糊应用到包裹层（WRAPPER），永远不要应用到单个子元素。

Zoom-Through（正向 Z 轴剪切）

要解决的问题

文本进入、停留、退出，然后下一段文本进入、停留、退出。每个文本块相互独立——没有深度、没有连续性。视频看起来像幻灯片。

原理

Z 轴上的速度匹配剪切。你永远不会同时看到两段文本。 退出的文本向观众方向缩放（加速），模糊与透明度在剪切点达到峰值以掩盖硬交换，进入的文本从背后继续放大（减速进入焦平面）。一次连续的前向运动，两段不同的文本。

三个阶段

Phase 1：退出（Exit）——文本向前加速（朝向观众）

• 缩放：1.0 -> 1.2，模糊：0px -> 10px（文本缩放；见 Blur Logic），透明度：1.0 -> 0.15
• 缩放/模糊缓动：power3.in（陡峭加速）
• 透明度缓动：none（线性——均匀变暗，与缩放分离）
• 时长：0.2s

Phase 2：硬切（Hard cut）——在峰值速度 + 峰值模糊处

• 退出元素：opacity: 0（通过 tl.set 瞬时设置）
• 进入元素：opacity: 0.15, scale: 0.75, blur: 10px（通过 tl.set 瞬时设置）
• 所有属性在剪切处匹配：模糊、透明度，以及缩放方向（两侧都在放大）

Phase 3：进入（Entry）——文本继续向前（增长进入焦平面）

• 缩放：0.75 -> 1.0，模糊：10px -> 0px，透明度：0.15 -> 1.0
• 缓动：expo.out（陡峭的初始爆发匹配退出速度，长尾沉降）
• 时长：0.5s

为什么退出阶段透明度必须分离

缩放使用 power3.in，但这会让透明度在补间的大部分时间里保持在接近 1.0。将透明度拆分为独立的线性缓动补间，能让变暗过程均匀。而进入阶段，所有属性可以共享 expo.out。

Inverse Zoom-Through（反向 Z 轴剪切）

正向变体的镜像：摄像机“拉回”而不是“推过”。退出的元素远离观众后退；进入的元素超大尺寸到达（仿佛它刚刚在摄像机身后），然后回缩进入焦平面。两侧都沿收缩方向移动——同方向规则保持，只是反转。

何时优先于正向变体： 到达节拍（arrival beats）。进入的元素因为从大于画面的尺寸而来而自带分量（presence）——适合回报台词（如“That changes today.”）、巨型回复或保持的终态。正向 zoom-through 读作“正在穿行内容”（progressing through）；反向读作“抵达内容”（arriving at）。

三个阶段

Phase 1：退出——元素后退（远离观众）

• 缩放：1.0 -> 0.8，模糊：0px -> 10px（文本缩放）
• 缩放/模糊缓动：power3.in；透明度：1.0 -> 0.15 用 none（独立补间）
• 时长：0.2s

Phase 2：硬切

• 退出元素：opacity: 0 通过 tl.set
• 进入元素：opacity: 0.15, scale: 1.25, blur: 10px 通过 tl.set

Phase 3：进入——进入元素回缩到位

• 缩放：1.25 -> 1.0，模糊：10px -> 0px，透明度：0.15 -> 1.0
• 缓动：expo.out，时长：0.5s

Cut the Curve（Scene 转场）

原理

对 x/y 轴上的所有 Scene 到 Scene 转场使用 cut-the-curve。退出的 Scene 的主角元素（hero element）朝一个方向加速，剪切落在运动中途，进入的 Scene 的主角元素沿同一方向继续运动并减速。没有任何元素完全移出画面，也没有任何元素从完全画面外进入——速度加上透明度淡出欺骗了眼睛；部分位移就已足够。

同路径、同方向

如果 Scene A 的主角向左滑出，Scene B 的主角从右侧进入并继续向左滑。两者都向左移动。一次连续的运动。

方向（Direction）	Scene A 退出（exit）	Scene B 进入起点（entry start）	Scene B 进入终点（entry end）
向左（Leftward）	x: 0 -> -230	x: +230	x: 0
向右（Rightward）	x: 0 -> +230	x: -230	x: 0
向上（Upward）	y: 0 -> -230	y: +230	y: 0
向下（Downward）	y: 0 -> +230	y: -230	y: 0

通过镜像缓动匹配速度

最干净的匹配：退出用 power4.in，进入用 power4.out，并保持相同的距离和时长——数学上这就是一次 power4.inOut 复合曲线的两半，因此进入的元素恰好在不存在的路径 50% 处、以完全相同的速度接续（例如 230px / 0.3s ≈ 剪切两侧均为 3,070 px/s）。

淡出技巧：退出的透明度在其行程约 25–30% 处完成（淡出时长 ≈ 0.18–0.3s，而运动时长为 0.3–0.34s）——元素在仍然明显加速时消失，且无需到达画面边缘。进入的元素在其减速过程中从约 0.35 快速淡入。让最后一个淡出的元素恰好死在硬切处——出现“没有任何东西在动”的空档会读成尴尬的静止空气（dead air）。

规则

• 所有 Scene 转场都使用 cut-the-curve——它是默认项（default），不是点缀（accent）；
• 两侧同方向；镜像的 .in / .out 缓动，相同距离 + 时长；
• 退出时长要短（0.2–0.4s），进入时长 ≥ 退出时长；
• 部分位移 + 淡出，绝不完整移出画面。

Waterfall Cut（逐词的 cut-the-curve）

Cut-the-curve 在词（word）粒度上的最强版本——用于文本到文本缝合处的左向剪切。退出行的每个词沿各自明显的曲线加速退出；进入行的每个词在运动中途级联进入。错峰（stagger）把剪切变成一道眼睛可以顺着越过的波浪。

退出（逐词）

• 运动：x: 0 -> -230，0.34s，power4.in——比常见的 power2 明显更陡的斜坡：词先几乎不动，然后撕开（RIPS）；
• 淡出：opacity -> 0，0.18s（独立补间，power1.in）——在词仅完成约 25–30% 行程时结束；
• 错峰：按阅读顺序，每词约 0.022s，时机设定为最后一个词恰好在硬切处完成淡出。

进入（逐词）

• fromTo x: +230 -> 0, opacity: 0.35 -> 1，0.3s，power4.out——复合曲线的镜像后半段；每个词以匹配速度点火即动；
• 瀑布式错峰使用递减间隔（起点 0.05s，每个词乘以约 0.84）——级联在整行中加速推进，而不是每词固定延迟；
• 构建期将所有词预置为 x: +230, opacity: 0——仅靠 immediateRender: false 会让未启动的词在错峰窗口内以静止状态可见地停留在画面中。

整行变体

单个行的节拍（如大标题开场行）作为一组以同样明显的斜坡退出，但把淡出拉长到约 0.3s，并在剪切前约 0.02s 结束——过早淡出的孤立元素会留下本可由词级联覆盖的静止空气。

注意与 hyperframes-animation/rules/waterfall-entry.md（skills/hyperframes-animation/rules/waterfall-entry.md）区分：waterfall entry 是场景内的到达（arrival）——透明度通过 tl.set 二进制 0→1，永不淡入，默认 Y 轴从下方；而 waterfall cut 是缝合（seam）——在行程中途以 0.35 点火，淡出本身即是速度技巧，默认 X 轴随当前方向。二者规则不得混用。

选择变体（Choosing a Variant）

	Zoom-Through	Inverse Zoom	Cut the Curve	Waterfall Cut
作用域（Scope）	场景内文本替换	到达/回报节拍	Scene 之间	文本到文本缝合
轴（Axis）	Z，朝向观众	Z，远离观众	X / Y	X，逐词
峰值模糊（Peak blur）	文本 10px / 整帧 20px	文本 10px / 整帧 20px	不需要	不需要（淡出完成工作）
剪切处透明度（Opacity at cut）	0.15	0.15	退出在剪切处已淡出	最后一个词死在剪切处
感受（Feel）	正在穿行（progressing through）	正在抵达（arriving at）	被横向携带（carried sideways）	越过缝合的波浪

反模式（Anti-Patterns）

不要（Don't）	原因（Why）	改为（Instead）
zoom-through 期间两段文本同时可见	重叠文本破坏 Z 轴错觉	在模糊峰值处硬切，一次只显示一段文本
文本缩放主体上用 20px 模糊	字形糊成一团；读成故障	文本 10px，18–20px 仅用于整帧
剪切两侧元素走不同路径	眼睛追踪一个方向，剪切去了另一个方向	相同属性、相同方向
交换处模糊/透明度不匹配	可见闪烁或亮度跳变	在剪切帧处数值完全一致
进入用温和缓动（power2.out）	进入速度感觉比退出慢	镜像退出：power4.out / expo.out
完整移出/移入画面	浪费时间并破坏速度错觉	部分位移 + 提前淡出
孤立元素在剪切前很久就淡出	缝合处出现静止空气	淡出在剪切前约 0.02s 结束，或使用词级联
正文文本上做 zoom-through	小文本在 0.75 缩放下不可读	仅用于标题和短短语
Scene 剪切不用 cut-the-curve	静态剪切感觉像幻灯片	cut-the-curve 是默认项

与仓库机制的对应关系

本目录在 faceless-explainer 工作流中的位置与配套机制，可以在仓库中直接追踪到：

• 帧工人契约：sub-agents/frame-worker.md 定义帧工人“N-up，一人一帧”，在帧自己的暂停 GSAP 时间线上构建动效；本目录的剪切正是 worker 在帧内构建的 recipe。
• 运动语言与 doctrine：references/motion-language.md 将帧内缝合列为“Seam cuts (worker-built, inside a frame)”并直接指向本目录（cut-catalog.md），同时确立了“平滑优先于弹跳（power3 默认）”“在峰值速度处剪切”等负载规则；其“seek-safe core”明确帧内所有运动必须在暂停时间线内完成，禁止 repeat/yoyo、Math.random/Date.now、CSS transition/@keyframes 驱动动效——这些约束同样约束着本目录中的四种剪切实现。
• 视觉设计方法：references/visual-design.md 定义了 Scene 是“帧内时间窗口”这一概念，要求每帧写成 time-coded shot sequence，并在“Where the detail lives”一节将帧内剪切/缝合（zoom-through · cut-the-curve · waterfall）指引到本目录。
• 帧间转场的边界：scripts/transitions.mjs 的 parseTransitionIn 只接受注册表中的五个类型名（未知类型回退到 default_calm 即 blur-crossfade），cut/none/空字符串表示硬切；scripts/lib/transitions.json 是这份词汇表的来源。这从源码层面印证了：cut-the-curve / inverse-zoom / waterfall 不是 transition_in 值，帧内剪切由工人构建，帧间转场由注入器盖章。

实战建议：如何在一帧中编排缝合

结合 references/visual-design.md 的 time-coded shot sequence 方法，将本目录落地到实际帧的 Scene 行中：

1. 先判定缝合类型：按“未完成短语 → cut-the-curve / waterfall；状态切换 → zoom-through；到达/回报 → inverse zoom-through”的规则选择变体，并在 Scene 行中命名（如 zoom-through / cut-the-curve / waterfall cut），帧工人据此从本目录取配方实现，而不是靠名称猜测曲线与毫秒数。
2. 锁定模糊参数：按主体尺寸取 Blur Logic 表的 10px（文本）或 18–20px（整帧），并确保剪切两侧数值一致、模糊施加在包裹层。
3. 遵守三阶段骨架：退出（0.2s 左右，power3.in/power4.in + 独立线性透明度补间）→ 硬切（tl.set 瞬时交换，所有属性匹配）→ 进入（0.5s 左右，expo.out/power4.out），速度在剪切点两侧匹配。
4. 避免反模式：逐条对照反模式表，尤其是“两段文本同屏”“完整移出画面”“孤立元素过早淡出”这三点，它们直接决定缝合是“连续镜头”还是“幻灯片”。
5. 与帧间转场协同：帧内缝合负责帧内部的连续感，帧间 transition_in 由故事层在 scripts/lib/transitions.json 的五种词汇中选取、由注入器盖章——两者分工明确，不要混用词汇表。