Cut the Curve — 技术目录

Cut the Curve — 技术目录 是做什么的？

五项 SEAM 技术，遵循一个原则：在峰值速度处剪切，匹配剪切两侧的方向和速度——加上两项场景内技术（§6 入场，§7 滑动）。SEAM 法则（向量法则、电流、账本、SEAM 门）位于 motion-doctrine 中；请先阅读它。本技能提供参数和机制。 所有 GSAP 代码模板（worker + registry）：examples/gsap-implementation.md。

目录

#	技术	范围	轴	用途
1	缩放穿越（正向）	场景内文字交换	Z，朝向观众	深入到同一思想的更深处
2	反向缩放穿越	入场 / 收尾节拍	Z，远离观众	更大事物的降临
3	切曲线	场景之间	X / Y	默认边界，影片的“电流”
4	瀑布剪切	文字到文字接缝	X，逐词	大字幕节拍之间的逐词交接
5	拉焦模糊剪切	同一表面状态交换	X / Y / Z	你希望被看到的唯一剪切——DSLR 拉焦风格的华彩效果
6	瀑布入场	场景内 ARRIVAL（无接缝）	Y，从下方	标题卡、片段开场白、列表介绍
7	微调曲线	场景内组滑动（无接缝）	X / Y	重新定位已编排的组以腾出空间

Z 方向即符号

在 Z 轴上，仅“同一轴”是不够的——d(scale)/dt 的符号必须在剪切两侧匹配：

Z 向量	退出缩放	进入缩放	变体
推（正向）	增大 1 → 1.2	增大 0.75 → 1	缩放穿越
拉（反向）	缩小 1 → 0.8	缩小 1.25 → 1	反向缩放穿越

禁止的镜像：退出时缩小，进入时从小到大放大（拉动变为推动——这是常见的，因为从小到大是默认的元素入场方式），以及退出时推动，进入时超大尺寸收缩。这会约束进入场景在 SEAM 窗口期间（剪切 + 约0.5秒）自身的入场方式，而不仅仅是包装器补间：保持进入帧已编排好，或编写其入场以匹配符号。请根据 SEAM 门规则 7 进行验证。

模糊逻辑（所有 Z 变体）

主体	峰值模糊	原因
文本缩放（标题、词组）	10px	20px 会使字母形状模糊——剪切被视为故障，而非速度
全帧表面（窗口、卡片、截图）	18–20px	大表面上较轻的模糊会被视为渲染故障

在交换帧处，两侧使用相同的峰值模糊。模糊应用于包装器，绝不应用于子元素。

---

1. 缩放穿越（正向）

Z 轴速度匹配剪切；两个文本永远不会同时可见。 所有元素都在增大：退出的文本加速朝向摄像机，在峰值模糊处进行硬交换，进入的文本持续增长进入焦平面。仅适用于标题和短句。总时长约 0.4s。

阶段	缩放	模糊	不透明度	缓动函数	持续时间
退出	1 → 1.2	0 → 10px	1 → 0.15	power3.in（不透明度：单独的 none 补间）	0.2s
剪切 (tl.set)	进入: 0.75	10px	退出: 0 / 进入: 0.15	—	—
进入	0.75 → 1	10 → 0px	0.15 → 1	expo.out	0.5s

退出不透明度必须是其自身的线性补间——power3.in 会使不透明度在接近1处保持太久。进入时所有属性共享 expo.out。

2. 反向缩放穿越（反向）

拉回镜像：退出的元素后退；进入的元素以超大尺寸出现（仿佛就在摄像机后方）并收缩进入焦平面。所有元素都在缩小。用于 ARRIVAL/收尾节拍——收尾台词、巨大的回应、最终的静止状态——而非普通边界。总时长约 0.7s（30% 退出 / 70% 进入）。

阶段	缩放	模糊	不透明度	缓动函数	持续时间
退出	1 → 0.8	0 → 10px	1 → 0.15	power3.in（不透明度：单独的 none 补间）	~0.2s
剪切 (tl.set)	进入: 1.25	10px	退出: 0 / 进入: 0.15	—	—
进入	1.25 → 1	10 → 0px	0.15 → 1	expo.out	~0.5s

模糊为 10px 文本缩放；仅当两侧均为全出血表面时使用 18–20px。

符号纪律： 进入场景以编排好的帧形式出现在收缩的包装器内——在 SEAM 窗口内不得有从小到大放大的入场。分阶段入场应在收缩稳定后发生，或者从 ≥1 开始并收缩。

3. 切曲线（默认场景边界）

X/Y 速度匹配剪切——所有场景到场景边界的默认方式，遵循影片的“电流”，而非强调。退出的主角在一个方向上加速，剪切发生在运动中途，进入的主角继续同一方向并减速。总时长约 0.6s；方向：左/右/上/下（默认左侧）。

局部运动： 帧的约12%（1920 分辨率下约 230px）——绝不做全屏移出。

方向	退出	进入起始 → 结束
向左	x: 0 → −230	x: +230 → 0
向右	x: 0 → +230	x: −230 → 0
向上	y: 0 → −230	y: +230 → 0
向下	y: 0 → +230	y: −230 → 0

机制：

• 镜像缓动： 退出使用 power4.in + 进入使用 power4.out，距离和持续时间相同——构成一个 power4.inOut 的两个部分，因此速度在剪切处精确匹配。
• 淡出技巧： 退出不透明度在其行程的约 25–30% 处完成（淡出约 0.18–0.3s 对比运动 0.3–0.34s）；进入在行程中途以约 0.35 的不透明度开始。将最后一个淡出元素的消失时间正好安排在剪切点——如果没有任何元素运动，就会产生死寂感。
• 退出 0.2–0.4s；进入时间 ≥ 退出时间。可选的模糊 8–10px。
• 舞台背景： #root 必须是不透明的 (background: var(--canvas-deep, var(--canvas, #000))) —— 中途剪切会打开一个总和透明度 < 1 的窗口，否则会闪现白色（参见 seam-craft）。

push-slide 存在但违反了局部运动和运动中途相位；优先使用切曲线。

4. 瀑布剪切（逐词切曲线）

在单词粒度上实现切曲线——用于文字到文字接缝的最强向左剪切。退出词语在自己的曲线上渐出；进入词语在飞行中级联入场——这是眼睛跨过接缝时跟随的波浪。

范围： 由 worker 在一个多节拍组件（堆叠的全帧 .beat 层）内部编排，而非 registry/injector 类型——它补间的是单词 spans，而非剪辑包装器。进出文本节拍块的边界仍使用正常的 registry 转场。不占用 2–3 个转场预算。

参数	值	原因
行程	±230px (~12% 帧)	局部运动 + 速度 > 全帧推动
退出	0.34s power4.in	加速本身就是剪切
退出淡出	0.18s, 与 x 同时开始	单词在行程约 25–30% 时消失——无拖影
退出交错	+0.022s 按阅读顺序	行被剥离，而非整块滑动
进入	0.3s power4.out	组合的后半部分——速度匹配
进入起始不透明度	0.35	中途点火；二进制 0→1 会显得突兀
进入间隔	0.05s × 0.84 衰减	加速级联，解析为编排好的状态

规则：

• 每个链一个方向，跟随电流。反向缩放只能是该链的 ARRIVAL 节拍。
• 在构建时将所有单词预设为 x: +230, opacity: 0——仅使用 immediateRender: false 会使未开始的单词在静止时可见。
• 较短的第一个节拍可以整行退出：其淡出在剪切前约 0.02s 结束，这样当后续单词点火时它仍在运动——无死寂间隙。
• 仅使用变换/不透明度（查找安全）；不透明舞台背景适用。

5. 拉焦模糊剪切（可见剪切）

唯一一种剪切可见的变体：散焦模糊的尖峰隐藏了单帧硬交换——类似手持 DSLR 的拉焦效果。用作同一视觉主题内相同表面的状态交换的偶尔华彩；不能作为默认边界。

与其他变体的区别：退出元素在剪切前保持完全不透明（模糊隐藏了交换——没有早期淡出）；缓动函数为 power2.in / power2.out（柔和光学效果，而非动量）。

规则：

• 仅在叙事节拍处触发，每约 8 秒最多一次；绝不在字幕中间或保持期间触发。
• 在峰值模糊处剪切（≥6px；峰值为 8–12px，最大 ≤16–18px）——在上升过程中交换会暴露剪切。
• 微妙的缩放（约 1.06 镜头呼吸）使其看起来像光学效果。
• 两侧方向相同——向量法则仍然成立。进入时长 ≥ 退出时长。
• 模糊应用于包装器；绝不在一个元素的一次补间中使用模糊 + 不透明度（无头合成错误）；绝不直接模糊 <video>（用包装器包裹它）。

---

6. 瀑布入场（场景内入场——非接缝）

交错 ARRIVAL 级联：词语/元素从下方（一致方向）快速进入，每个元素在前一个元素稳定前开始——加速的波形最终解析为编排好的布局。适用于标题卡、片段开场白、列表/功能简介。其接缝兄弟是 §4；不要混淆它们的规则：

	§6 入场（到达）	§4 瀑布剪切（接缝）
不透明度	通过 tl.set 在入场时二进制 0→1——永不淡入	在行程中途以 0.35 点火——淡出本身就是速度技巧
默认轴	Y，从下方	X，跟随电流
退出侧	无	词语通过镜像的 power4.in 渐出

编排：

• 重叠而非排队——下一个元素在前一个元素稳定后 ±2 帧内开始；级联中的间隔缩小；最后一个元素迅速到位。
• 速度因权重而异——重/锚定元素移动更远更久；轻词语/标点快速到位：

参数	锚定/重	正常词语	轻/标点
Y 偏移	60–80px	40–50px	30–48px
持续时间	0.16–0.20s	0.13–0.16s	0.10–0.13s
重叠	0–2f 间隙	1f 重叠	1–2f 重叠

• 缓动函数 power4.out（使用 expo.out 以获得额外的快速感）；入场从不使用 .inOut。
• 每个级联一个方向。
• 将最后一个词语拆分为片段以延长高潮；片段移动更远。
• 稳定后，该组通常会滑动以为下一个节拍腾出空间——那是 §7 的内容。

7. 微调曲线（场景内组滑动——非接缝）

慢-快-慢地重新定位已编排的组（词语行、卡片堆叠、列表）以揭示内容或腾出空间。没有内置的缓动函数能产生这种效果——power4.inOut 会生硬地停止。对一个属性链式使用三个补间：

阶段	缓动函数	距离	时间	感受
1 斜坡输入	power3.in	~10%	~20%	几乎不动——运动被感知，无突兀感
2 爆发	none（线性）	~65%	~18%	约 2× 平均像素/帧——有目的性
3 尾段	power4.out	~25%	~62%	衰减蠕行至静止——消除停顿感

规则：

• 尾段时间至少是斜坡输入时间的 3 倍。如果仍有停顿感：延长尾段时间（非距离）或使用 power5.out。
• 阶段 2 保持线性——缓动它会失去爆发对比。
• 在阶段 2 期间揭示新内容——爆发掩盖了其出现。
• 垂直方向保持相同比例；按比例调整距离，保持时间比例。

---

选择变体

	缩放穿越	反向缩放穿越	切曲线	瀑布剪切
范围	场景内文字交换	入场/收尾节拍	场景之间	文字到文字接缝
Z 符号/轴	增大（推动）	缩小（拉动）	X / Y	X，逐词
行程/缩放	1→1.2, 然后 0.75→1	1→0.8, 然后 1.25→1	±230px	±230px
峰值模糊	10px 文本 / 18–20 全帧	10px 文本 / 18–20 全帧	8–10px 可选	无
缓动函数	power3.in / expo.out	power3.in / expo.out	power4.in / power4.out	power4.in / power4.out
感受	深入	到达	被侧向携带	跨过接缝的波浪

反模式

不要做	改为这样做	原因
在场景边界使用缩放穿越或反向缩放穿越（状态定价规则）	使用切曲线作为默认边界；只在同一场景内文字交换或 beat 收尾时使用缩放变体	变体突破场景的上下文；观众感受到连接中断
为缩放穿越使用 20px 文本模糊	10px 峰值模糊；仅在两边都是全出血表面时使用 18–20px	20px 会使字母形状模糊——剪切被视为故障，而非速度
退出使用 power3.in 同时不透明度也使用 power3.in（缩放穿越）	不透明度使用单独的 linear 补间，持续至结束	power3.in 保持不透明度接近1太久；在模糊峰值处仍有可见残留
舞蹈效果：所有词语相同重叠/间隔	按权重变化：重/锚定词语定期开始；轻词语快速到位；最后的词语拆分片段	统一的节奏读起来像 UI 故障
使用 slide-and-fade 注册转场而非切曲线	使用切曲线并遵循局部运动 + 相位窗口规则	slide-and-fade 在帧中产生死寂间隙；违反局部运动和速度匹配
在任何变体中使用 power4.inOut 作为入口	入口使用 power4.out 或 expo.out	inOut 在入口端加速，在中间撞击结束；破坏了速度匹配契约
在场景边界的切曲线中途引入临时摄影机视角或“电影边框”	在剪切前后保持干净、坚硬的矩形帧	边框创造了空虚的视觉子空间；中间剪切在容器边界上显示出空隙
在 SEAM 窗口 (< 0.5s 进入后) 内为进入场景元素使用从小到大放大入场	让进入场景以 ≥1 的缩放到达，或在 SEAM 窗口关闭后使用分阶段入场	从小到大的入场与反向缩放穿越的收缩符号冲突，破坏了方向契约

速度匹配的数学表达

切曲线 + 瀑布剪切使用镜像的 power4 缓动函数，在剪切点处达到精确的速度匹配：

• 退出：power4.in，从 0 加速（t=0 时 v=0）到峰值（t=1 时 v 最大）
• 进入：power4.out，从峰值速度减速（t=0 时 v 最大）到 0（t=1 时 v=0）

结果：剪切点（t_exit=1, t_entry=0）处的瞬时速度相同。

缩放穿越 + 反向缩放穿越在 Z 轴上使用类似原则：

• 退出：power3.in 加速朝向摄像机（推动）或远离摄像机（拉动）
• 进入：expo.out 从最大速度减速进入焦平面

在交换帧处，两个补间的瞬时缩放速度匹配，创建一个连续的缩放动作，看似无修剪。

请参阅 examples/gsap-implementation.md 以获取所有七种技术的完整 GSAP 代码模板。