pixel2motion

Pixel2Motion (v2)

像素 → 矢量 → 动效。 此技能融合了两个领域：

1. 矢量化规范（来自 logo-vectorizer-minimal-smooth）：使用能够通过视觉 QA 的最低复杂度可编辑几何图形拟合栅格源图。
2. 动效规范（来自 Disney 的 12 Principles of Animation）：运用有依据的时间安排和缓动方式，为这些几何图形编排符合品牌风格的动效。

这种融合基于一个洞见：简洁平滑的几何图形就是可制作动效的几何图形。由 3 个语义部分构成的徽标可以流畅地制作动效；由 400 个描摹像素阶梯的点构成的徽标则无法编排动效，也无法作为专业徽标矢量图通过验收。因此，阶段 2 不只是矢量化，而是为动效构建结构。而且，动效结束时必须精确落在通过 QA 验证的静态矢量图上（即 最终帧契约）。

交付内容

• logo.svg — 最终静态矢量图（具备动效所需的结构）
• logo_motion.html — 独立的展示风格 HTML，包含主动画、原子动效研究、重播/慢速/加速控制和 QA 检查点
• motion_spec.md — 个性词汇、应用的原则、时间线表格、缓动标记、原子动效、可调控件
• outputs/fit_iterations/*.png + overlay_progress_strip.png — 几何 QA 证据
• outputs/motion_frames/*.png + motion_strip.png — 动效 QA 证据
• final_render.png、html_render.png — 静态渲染；关注平滑度时的路径审计文件

---

阶段 1 — 像素：读取源图，撰写简报

1. 分析栅格源图。 记录图像大小、模式、Alpha 通道、前景色和背景（透明/纯色）。识别语义部分：图形标记与字标、单个字母、圆点、飘带、容器、负空间。每个部分都是动效中的一个未来角色。
2. 开始处理几何图形前，先撰写动效简报：
   • 个性：用 3 个词描述品牌动效（例如“迅捷、精准、自信”）。根据徽标本身的视觉语言推导（几何形状 = 工程感动效，有机形状 = 流动感动效，圆润形状 = 柔和/弹跳感动效），并结合用户提供的品牌背景。参阅 references/motion-personality.md，了解如何将词汇映射为时间尺度、缓动标记和原则侧重。
   • 使用场景：启动画面/开场（有意为之的 1200–2000ms）、页眉呈现（300–800ms）、加载状态（连续循环）、悬停微交互（150–300ms）。只有在确实含糊不清时才询问用户；默认采用启动画面式呈现，并以静态状态结束。
   • 编排草图：哪些部分会动、顺序如何、采用哪种呈现模式（参阅 references/reveal-patterns.md）。
3. 将简报记录在 motion_spec.md 中。之后的每个参数都必须能追溯到这份简报。

阶段 2 — 矢量：拟合简洁几何图形，并为动效构建结构

遵循优先采用最低复杂度的工作流。默认情况下不要一味追求像素级拟合；先从能够解释图形标记的最简单可编辑几何图形开始，只有在叠加图显示存在结构性不匹配时才增加复杂度。

复杂度阶梯

选择与源图足够匹配的最低级别：

1. 基本图元：圆形、椭圆、矩形、直线、简单弧线、变换。
2. 基本图元组合：由少量基本图元或蒙版进行类似布尔运算的组合。
3. 少量曲线构成的解析路径：用少量三次曲线段绘制平滑飘带、 swoosh、C 形标记、叶片、波浪、盾牌。对于闭合和／或自相交的可变宽度飘带（∞ 标记、手写字形），请使用中心线骨架方案——references/ribbon-fitting.md + scripts/fit_ribbon_centerline.py；该脚本的报告还会输出每个交叉点的弧长比例，供第 3 阶段的分段描画使用。
4. 平滑轮廓路径：仅在源图确有形状变化处增加节点；保持 G1 切线连续，不要让控制柄方向杂乱跳变。
5. 描摹生成的路径：仅用于较简单的几何无法表现的不规则剪影（可使用 scripts/raster_logo_trace.py 生成测量数据／初始蒙版）。描摹结果仅用于辅助测量，绝不能直接作为最终图稿。交付前应平滑或重新拟合描摹结果。

如果更高复杂度的版本仅改善像素抗锯齿，就保留较低复杂度的版本。如果较低复杂度版本的端点、宽度分布、中心、剪影、负空间不正确，或边缘存在明显阶梯状锯齿，就提升一个级别，或使用平滑曲线重新拟合。除非必须精确还原字形，否则文字标志优先使用可编辑的 SVG <text>。根据源图本身确定初步复杂度，并在 motion_spec.md 中记录原因。

平滑度门槛（硬性要求）

IoU 不能掩盖糟糕的矢量绘制质量。**平滑的 Logo 源图必须以平滑的矢量几何图形交付。**即使 IoU 数值很高，只要最终 SVG 中任何预期的平滑边缘存在明显阶梯状锯齿、抖动、沿像素网格延伸的水平或垂直线段、杂乱的描摹节点，或在 200-400% 缩放时看起来像位图蒙版，几何验收就不合格。

• 从阈值蒙版生成的像素网格轮廓，仅可用于初始测量，或用于真正的像素艺术 Logo。对于普通 Logo，应在第 3 阶段之前将其重新拟合为基本图元、弧线、椭圆或三次曲线路径。
• 对于曲线、飘带、椭圆、圆形、字母和圆角形状，如果路径主要由 1px 的水平／垂直线段组成，则未通过平滑度门槛。
• 平滑部分必须使用尽可能少的曲线段表示，同时保留剪影、宽度分布、极值点和负空间。不要为了追求抗锯齿效果而使用数百条线段。
• 如果用更平滑的曲线替换 IoU 较高但锯齿明显的描摹路径，会略微降低 IoU，那么只要结构性地标仍然匹配，就应优先选择平滑版本。如果残差有合理解释、视觉上轻微，且由刻意平滑、抗锯齿、字体替换或栅格源图伪影造成，则 IoU 较低的平滑结果也可通过验收。请在 motion_spec.md 中记录这一取舍。
• 验收前请检查放大后的渲染图（final_render.png 或专用放大裁剪图）。如果用户在截图或浏览器缩放时会注意到阶梯状锯齿，则该矢量图不能通过验收。

为动画做好准备的结构（融合层）

SVG 中的元素是演员，而不只是一张图片。拟合几何形状时，务必做到：

• 每个语义部分对应一个元素（或 <g>），并使用稳定的 id：#mark、#wordmark、#letter-a、#dot、#swoosh。动画以 id/class 为目标，绝不要使用 path:nth-child(3) 这类结构选择器。
• 沿动画分界拆分路径。 如果动作草图要求 swoosh 和圆点分别动画，即使一个复合路径就能同时绘制二者，也必须将它们拆成独立元素。
• 变换原点：需要缩放或旋转的部分应设置 transform-box: fill-box; transform-origin: center（或有意指定其他原点）。此项在第 3 阶段通过 CSS 设置，但现在就要确认每个部分的边界框能让该原点位置合理。
• 做好描边绘制动画的准备：任何将通过动画逐渐绘制的描边都应设置 pathLength="1"，这样虚线动画就能使用 stroke-dasharray: 1; stroke-dashoffset: 1 → 0，不受实际长度影响。确认路径的起点和方向符合预期的绘制方向；如不符合，则反转路径。
• 字标中的字母：如果字母将依次错开显示，应为每个字母单独设置元素或 <text> span；单个 <text> 无法实现级联效果。
• 不要预先烘焙会妨碍动作编排的变换：保持各部分的局部坐标简单，让动画变换能够以可预测的方式组合。

几何 QA（必须提供证据）

• 使用正确的 viewBox 编写 SVG，渲染为 PNG，并在源图上生成青色叠加图；将每张叠加图保存到 outputs/fit_iterations/NN_name_overlay.png。
• 使用多模态视觉检查中心、半径、端点、宽度变化、极值、负空间和轮廓。
• 每次迭代都计算并记录 IoU，但不要采用固定的全局 IoU 阈值。在确保平滑度和结构正确的前提下，尽可能提高 IoU。若叠加效果在视觉上忠实且已记录残差，稍低的 IoU 也可以通过；而即使 IoU 很高，只要存在结构不匹配、控制柄不平滑、可见凸起、负空间错误、像素阶梯边缘或路径审计不通过，拟合仍不合格。
• 每次只迭代一个复杂度级别；优先移动或调整少数节点，再增加节点；只有叠加图显示拟合失败的地方才增加局部复杂度。如果路径看起来凹凸不平，应减少节点并重新拟合宏观曲线，而不是添加点。
• 对复杂的平滑路径或任何感觉不均匀的手工拟合曲线，运行 scripts/svg_path_audit.py（控制柄不平滑、切线突变、交替出现的微小线段以及阶梯状描摹线段，即使 IoU 很高也都视为失败）。
• 如果源图包含曲线，至少保存一张平滑度证据图：可以是放大的裁剪图、路径审计产物，或能检查边缘质量的渲染图。并在 motion_spec.md 中记录视觉评估结果。
• 最后运行 scripts/overlay_progress_strip.py（仅包含源图、当前运行的叠加图和最终渲染图）。

迭代预算：平滑且通过验收，或从 10 次中择优

拟合循环很容易陷入无休止的调整。默认预算：每次运行进行 10 次几何迭代（一次迭代 = 一次几何变更 + 渲染 + 叠加检查）。循环会在以下任一条件先满足时停止：拟合通过验收（平滑度、结构和视觉检查均通过，且 IoU 尽可能高），或已尝试 10 次迭代。

• 为每次迭代的产物编号（NN_name_overlay.png），并记录每次迭代的指标（IoU、src_only_px、render_only_px、边界 RMS / 局部残差、审计警告、平滑度结论、视觉结论）。将拟合脚本和参数保存在 outputs/fit_work/ 下，以便日后恢复任意一次迭代——切勿将它们留在临时目录中。
• 若提前通过验收，则提前结束循环；立即进入 Phase 3。
• 若 10 次迭代预算用尽：停止继续优化并选出最佳候选方案。“最佳”的排序依据为：（1）通过平滑度门槛；（2）无结构不匹配；（3）IoU 和像素差值；（4）边界 RMS / 局部残差；（5）审计发现的切线折点和切线问题最少；（6）视觉叠加结论；（7）可编辑复杂度最低。干净但稍微宽松的拟合，通常胜过更贴合但存在明显切线折点的拟合；只有在不可见的折点可以保留，但必须作为已披露的已知问题。
• 如果最终交付的候选方案 IoU 低于另一个被拒绝的候选方案，请说明为何它仍然通过验收，或为何它只能作为预览（例如：“IoU 较低，是因为平滑了锯齿状阈值伪影；端点和轮廓关键点均匹配”）。仅优化几何无需重做动画编排——部件 ID 和中心线仍然有效，因此可以复用 motion.css，只需重新打包（animate_svg_showcase.py）并重新检查 Final Frame Contract。

Phase 3 — 动态：运用 12 条原则进行编排

参照 references/twelve-principles-for-logos.md 进行编排。最低要求：每个动画都要有意识地运用场景呈现、缓入缓出、时间安排、跟随动作和吸引力；其余原则按个性需求采用。

使用黄金比例安排时间线

Anticipation : Action : Follow-through  =  20% : 50% : 30%

对于 1500ms 的显现动画：约 300ms 用于预备动作，约 750ms 用于主要动作，约 450ms 用于收尾。重叠的部件应错开启动，错开的时长为各自持续时间的 10–20%；切勿让所有部件在同一帧开始或停止（这是机械运动最常见的错误）。较重或较大的部件移动得更慢；拖动层级（根部 → 主要部件 → 次要部件 → 细节部分）决定了动作级联的顺序。

推导参数，不要凭空设定

根据使用场景选择持续时间范围，根据个性映射选择缓动令牌和夸张程度，并根据部件清单选择显现模式。references/reveal-patterns.md 中提供了带注释并标注原则的模式：描线显现、错开组装、带过冲的缩放弹出、遮罩擦除、从基础形状变形、字母级联，以及待机循环和悬停状态。定义一次 CSS 自定义属性（--p2m-duration、--p2m-ease-*），并在各处统一使用——品牌一致性体现在令牌中。覆盖此规则的例外：在 @keyframes 内，时间函数必须使用字面值（参见 Implementation）——在此处引用令牌会被静默丢弃，动作也会在没有任何错误提示的情况下退化为线性。

实现

• 构建 logo_motion.html 前，先阅读 references/html-delivery-template.md。
• 在 motion.css 中使用以部件 id 为目标的 CSS 关键帧编写主动画；若编排需要测量枢轴、实时排序或逐字母布局，则使用定制的 JS 动作／阶段时间线。若使用 JS，请保留下文所述相同的 QA 钩子。
• CSS 关键帧必须使用 animation-fill-mode: both 或 forwards；否则，确定性的 ?t=<ms> 帧捕获和 ?static=1 最终状态检查都不可靠。
• 关键帧缓动必须使用字面值。 在 @keyframes 中使用 animation-timing-function: var(--token)，Chromium 不会解析：该声明会被静默丢弃，片段会退回动画的基础缓动函数——通常是 linear，也就是原则明确禁止的机械观感。更糟的是，若多部件编排通过细分缓动来控制节奏，就会退化为各片段恒定速度，并在每次交接时出现速度断崖（测得速度突变达 4.3 倍，观感像“卡顿”）。animation: 简写（时长／延迟能正常解析）和文档中仍可使用 token，但每个关键帧都必须写入字面的 cubic-bezier(...)，并添加注释注明对应的 token。这种问题在随意播放和等间距帧条中都看不出来——请使用缓动探针验证（Motion QA 第 3 步）。
• 将所有部件动画编排在同一个共享时钟上（使用一个时长，将阶段偏移设为关键帧内的百分比），这样 ?t=<ms> 才能与编排一一对应，探针／捕获也更容易理解。
• 优先采用每个元素单组关键帧的设计；若一个元素需要独立的属性时间线（例如缓动移动与线性淡出），则在同一时钟上使用逗号分隔的并行动画。
• 使用 scripts/animate_svg_showcase.py 构建默认交付物——它通过 JavaScript DOM 调用重建主 SVG，为动态 CSS 添加减少动态效果的安全处理，并加入模板外壳，其中包含原子动画研究、原则条、重播按钮、慢动作切换、速度滑块、?t=<ms>、?static=1 和 window.__p2mReady。
• scripts/animate_svg_html.py 仍是用于 QA 或调试的简易备用方案；它并非首选的最终用户 HTML，因为缺少原子动画和调节控件。
• HTML 必须不依赖外部依赖，并且必须源自与 logo.svg 相同的几何图形；原子变体必须复用同一个标志图形，不得另行装饰性重绘。
• 默认 HTML 动画舞台以 SVG 固有宽度的 0.7 倍显示主标志（width * 0.7，但仍受视口限制）。这样可为动画留出空间，并降低裁切风险。QA 截图可以覆盖视口／裁切设置，但面向用户的模板应保持 0.7 倍的呈现比例。
• 必须支持减少动态效果：在 prefers-reduced-motion: reduce 下，标志必须立即显示为最终静态状态。
• 无限循环（加载／空闲）必须无缝衔接：100% 关键帧状态必须与 0% 状态相同；请在脑海中测试 30 秒后是否依然令人愉悦。

穿过自相交处的描画效果

宽幅遮罩描画笔迹沿着自交中心线移动（∞ 标记、手写签名、字母组合）时，路径交叉处的另一条分支会过早显现——笔尖还没画到那里，“X” 就已经出现。中心线发生自相交时，请使用 references/reveal-patterns.md §1b 中的拆分填充方案：在每次交叉处将填充分割成若干片段（每个片段都有自己的遮罩脊线），使用平头端点和虚线图案 1 1（圆头端点会使可见笔尖领先笔迹半个笔画宽度——每次交接时都会停顿，然后下一段会以一个端点半径大小的圆盘突然出现），使用 de Casteljau 精确细分全局缓动，使合成后的速度符合设计，并在后续绘制经过时，用沿着 offset-path 移动的笔尖微光填补颜料先于墨迹显现的空窗期。同一参考资料中的虚线数学伪影表可避免 t=0 端点圆点和尾部漏色伪影。从 scripts/fit_ribbon_centerline.py 的报告中获取切分比例（报告会输出每个排除区间的弧长比例）。通过每次交叉经过前后的帧，以及连续性扫描（Motion QA 步骤 4），证明修复有效。

展示用 HTML 要求

最终 HTML 必须遵循提供的模板模式：

• 主动画：在 #logo-root 中设置主要展示舞台，支持点击／轻触以及使用 Replay 按钮重新播放。
• 原子动作：至少包含 3 个小型示例，例如悬停、脉冲、弧线／旋转、按压／挤压、描画或字母级联。它们应展示独立的运动原理，并在可行时以语义部分为目标。
• 调节控件：重播按钮、慢动作切换开关和速度滑块。速度滑块必须影响正在播放的主动画，而不只是影响之后的重播。
• 原理条：用简洁的圆角标签列出所用原理；使用 JS 时间轴时，在原理可见的阶段高亮对应原理。
• QA 钩子：保留与 scripts/capture_motion_frames.py 兼容的 #logo-root、?t=<ms>、?static=1 和 window.__p2mReady。

动效 QA（需提供证据）

1. 使用 scripts/capture_motion_frames.py 在编舞关键时间点捕获帧（该脚本使用 ?t= 钩子实现确定性跳转）：至少包括 t=0、预备动作结束、中段动作、过冲峰值、稳定后和最终帧——还要覆盖每个风险窗口：每次交叉经过、部件交接以及遮挡物进入／离开都要有各自的前后帧（只截取间隔均匀的一串帧会完全掩盖交接缺陷）。
2. 使用多模态视觉检查帧序列：预备动作是否清晰可辨？部件是否依次动作，而不是齐步动作？过冲是否符合个性设定的范围？飞行过程中是否有内容被 viewBox 裁切（扩展 viewBox 或收敛动作幅度——绝不能让 logo 被裁切）？
3. 探测实际应用的缓动效果：运行 scripts/probe_motion_continuity.py --probe，读取 2–3 个跳转时间点的计算值（stroke-dashoffset、offset-distance 等），并与设计曲线对比。如果每个时间点的值都与 LINEAR 窗口进度一致，说明关键帧的缓动函数被悄悄丢弃了（参见字面缓动规则）。还必须检查 t=0 帧是否存在虚线描边伪影（端帽墨点、尾部漏墨）。
4. 检查风险窗口的连续性：使用 --ink-sweep 每隔约 10ms 计算一次交接／交叉期间的墨迹像素差异。先停滞再跳变是停顿后突变的特征，本次运行不合格。笔尖从已绘制的墨迹下方经过时出现的单个近零采样属于物理现象——用笔尖微光在视觉上衔接，不要让它显得空白。
5. 最终帧契约：捕获的最终帧必须在几何形状、颜色、缩放和位置上与 final_render.png（经 QA 验证的静态矢量图）一致。使用 --compare-final 计算跨管线像素差异值，然后执行决定性的同管线检查：使用相同工具、视口和 DPR 捕获 ?static=1 与 ?t=<end>——两者必须完全一致（差异为 0）。跨管线残差（由不同渲染器、DPR 或重采样造成）属于噪声，应通过视觉确认，不要执着于数值。动画最终停在已验证 logo 以外的位置，本次运行不合格。
6. 对于循环动画，在循环接缝前后各捕获一帧；两帧在视觉上必须完全一致。
7. 将 motion_strip.png 组装为动效版的叠加进度条。

---

打包脚本

# Phase 2 — measurement / starter trace (inspect & simplify its output; never final art by default)
python3 scripts/raster_logo_trace.py source.png --out outputs

# Phase 2 — render + cyan overlay + IoU metrics in one step (headless Chrome; set CHROME_BIN if needed)
python3 scripts/render_overlay.py logo.svg source.png \
  --out outputs/fit_iterations/02_refined_overlay.png \
  --render-out outputs/final_render.png --report outputs/fit_metrics.json

# Phase 2 — closed / self-intersecting variable-width ribbons (∞ marks, scripts):
# centerline scaffold + auto-recenter + source edge snap; report includes each
# exclusion's arc fractions (= split-cut parameters for Phase 3)
python3 scripts/fit_ribbon_centerline.py source.png --seeds seeds.json --out-dir outputs/ribbon_fit

# Phase 2 — Bezier smoothness audit before accepting complex paths
python3 scripts/svg_path_audit.py logo.svg --out-svg bezier_segments.svg --report bezier_audit.json

# Phase 2 — geometry QA strip
python3 scripts/overlay_progress_strip.py --source source.png --dir outputs/fit_iterations \
  --pattern "*overlay*.png" --final-image outputs/final_render.png --out outputs/overlay_progress_strip.png

# Phase 3 — static HTML (intermediate check of JS DOM reconstruction)
python3 scripts/svg_to_js_html.py logo.svg --out logo_static.html --title "Logo"

# Phase 3 — animated showcase HTML deliverable
python3 scripts/animate_svg_showcase.py logo.svg --css motion.css --out logo_motion.html \
  --title "Logo Motion" --duration-hint 1500

# Phase 3 — minimal fallback HTML (debug/QA only, not preferred final delivery)
python3 scripts/animate_svg_html.py logo.svg --css motion.css --out logo_motion_minimal.html \
  --title "Logo Motion" --duration-hint 1500

# Phase 3 — deterministic frame capture + strip + final-frame diff (requires playwright)
python3 scripts/capture_motion_frames.py logo_motion.html \
  --times 0,300,700,1000,1250,1500 --out outputs/motion_frames \
  --strip outputs/motion_strip.png --compare-final outputs/final_render.png

# Phase 3 — easing probe: is the designed curve the one the browser runs? (requires playwright)
python3 scripts/probe_motion_continuity.py logo_motion.html \
  --times 500,700,900 --probe "#draw-stroke:stroke-dashoffset,#pen-glint:offset-distance"

# Phase 3 — ink-delta continuity sweep across handoffs/crossings (requires playwright)
python3 scripts/probe_motion_continuity.py logo_motion.html --ink-sweep 850:1010:10

环境说明：如果系统 Python 由外部管理，可通过虚拟环境安装 Pillow/numpy（python3 -m venv .venv && .venv/bin/pip install pillow numpy）；几何渲染使用无头 Chrome（必要时设置 CHROME_BIN），而动效帧捕获需要 Playwright 或同等的确定性浏览器截图工具。

如果无法使用 Playwright，请使用环境中任何可用的真实浏览器截图工具，并采用相同的 ?t=<ms> URL；对运行中动画进行实时截图不属于可接受的证据（结果不具确定性）。

验收标准

完成工作需要证据，而非声明：

几何（继承要求）：

• logo.svg 存在且可渲染，并采用能够通过叠加 QA 和流畅度门槛的最低复杂度；不存在结构性偏差（中心、缩放、端点、宽度轮廓、间距、负空间、轮廓）；平滑标记通过视觉放大检查，并在预算允许或曲线看起来不均匀时通过路径审计。
• 报告最终 IoU 和像素差值，但不要应用固定的全局 IoU 通过／失败阈值。在保持流畅度和结构正确性的前提下，IoU 应尽可能高。如果 IoU 较低的结果仍然通过，需准确说明残余偏差为何可以接受。
• 最终几何不得在预期为平滑的形状上出现明显的阶梯边缘。除非源图本身是刻意设计的像素艺术，且对此有明确说明，否则即使 IoU 很高，锯齿状描摹也不予接受。
• overlay_progress_strip.png 展示源图 → 当前运行的迭代过程 → 最终渲染。
• 预算内交付：如果 10 次迭代预算用尽，只要最佳运行结果通过流畅度、结构和视觉 QA，且已披露残余偏差，就可以交付。如果残余偏差不可接受，应将输出标记为预览，确保可从 outputs/fit_work/ 恢复拟合状态，并提供继续优化的选项。最终帧契约适用于交付的任何几何结果。

结构（融合）：

• 每个编排部分都是可独立寻址的元素，并具有稳定的 id；绘制路径带有 pathLength="1"；motion_spec.md 中的部分清单与 SVG 结构一致。

动作（新增）：

• logo_motion.html 遵循展示模板：在 #logo-root 中播放主动画，包含原子动作研究、重播／慢放／速度控制、原理条、无依赖执行、prefers-reduced-motion、?t= 定位、?static=1 和 window.__p2mReady。
• 速度控制会改变当前正在运行的主动画的播放速度；重播会确定性地重新开始；原子动作具有可见的交互／运动效果，并由 logo.svg 派生。
• 编排确实体现了 motion_spec.md 中所声称的原理；时间线遵循 20/50/30 结构（或说明不遵循的原因）；除非有意采用分阶段编排，否则任意两个部分的起止时间不得完全相同。
• motion_strip.png 存在，且已通过多模态视觉检查；动画过程中没有元素被裁切。
• 已验证缓动效果确实生效（在 2–3 个时间点进行探测；并非意外使用线性缓动），并且交接／交叉过程的连续性检查中不存在停顿后突跳的特征。
• 满足最终帧契约：捕获的最终帧 ≡ 已验证的静态渲染（报告跨管线差异并进行视觉确认；同一管线下 ?static=1 与 ?t=<end> 完全一致）。循环需经过接缝检查。
• IoU 是必须报告的诊断指标，但不是完整动作交付的固定阈值门槛：即使动画技术上流畅，只要缺乏个性、显得机械（各部分同步运动、线性缓动），或最终未落在已验证的 Logo 上，仍判定为失败。

参考资料

• references/twelve-principles-for-logos.md — 每项 Disney 原则及其针对 Logo 的应用和参数范围
• references/motion-personality.md — 品牌个性 → 时间尺度、缓动 token、夸张程度上限、原则侧重
• references/reveal-patterns.md — 编排模式库：显现、空闲循环、悬停状态，附时间表和 CSS 骨架；§1b 自交标记的分段填充绘制及虚线数学伪影表
• references/html-delivery-template.md — 最终 HTML 的必需结构：主动画、原子动作、调节器、原理条、QA 钩子
• references/ribbon-fitting.md — 闭合／自交变宽丝带拟合（中心线脚手架 + 重新居中 + 源图边缘吸附）和字标字体匹配

v2 更新日志

根据一次生产运行进行了强化（书法风格的 ∞ + 圆珠 + 衬线字体文字标识），当笔迹在第二次自交处出现明显卡顿时，我们找出了三个叠加原因，并分别制定了新规则或开发了新工具：

1. 在 Chromium 中，@keyframes 内的 var() 缓动函数会静默退化为线性缓动 → 字面缓动规则 + 缓动探测工具（scripts/probe_motion_continuity.py --probe）。这是主要原因：各段采用线性节奏，导致段落衔接处的速度骤降 4.3 倍。
2. 圆头笔触的绘制遮罩会让可见笔尖领先笔迹半个线宽 → 段落衔接处出现停顿后跳变（测得 50ms 平直段 + 笔头圆盘跳变）→ 平头端点虚线方案 + 虚线数学计算产物表 + 墨迹变化连续性扫描（--ink-sweep）。
3. 后续交叉笔画会绘制在现有墨迹下方 → 物理上无法避免约 10–25ms 的停滞窗口 → 笔尖微光次级动作（中心线上的偏移路径，基础不透明度为 0，在遮挡物下方结束）。

新增内容还包括：用于自交绘制效果的分段填充方案，支持精确的 de Casteljau 缓动细分（reveal-patterns §1b）；用于封闭可变宽度带状几何的 scripts/fit_ribbon_centerline.py + references/ribbon-fitting.md（其报告会输出 Phase 3 所需的分割切点弧长比例）；使用同一流水线的 Final Frame Contract 检查（期望值为精确的 0）；以及 Motion QA 中的风险窗口帧界定。