用途概括HyperFrames Animation 提供全部动画知识：原子规则、场景蓝图、转场、技法及 7 种运行时适配器（默认 GSAP）。通过选规则或加载蓝图编排确定性、可定位的动画，并用脚本审计。价值：更快产出可渲染的视频合成。
业务领域
Design
技能形态
Style GuideWorkflow
业务领域
技能形态
技能解析
剖析技能的工作原理和产出物，快速判断你的场景与价值。
当 Agent 或用户需要在 HyperFrames 合成中制作任何动效或动画——原子动效、场景蓝图、转场或特定运行时 API（GSAP/Lottie/Three.js 等）。也用于审计已有合成的动作编排。
animation-map.mjs 采样时间线并输出 JSON 供审计。确定性的、可定位的动画代码，或揭示空窗与生命周期警告的动画映射审计，可直接用于渲染。
使用场景
设计师制作产品发布视频需品牌揭幕场景。使用 hyperframes-animation 加载 logo-assemble-lockup 蓝图，拼接 GSAP 规则并遵守核心约束。技能输出基于单暂停时间线的可运行 HTML/CSS/GSAP 代码。价值：节省数小时动效设计，确保确定性渲染无帧漂移。
编写完复杂五阶段合成后，编辑运行技能内的 animation-map.mjs 审计编排。脚本采样所有 GSAP 时间线、计算包围盒并标记空窗与错落问题。价值：在渲染前发现生命周期警告，降低返工成本并提升动效质量。
技能关系
依赖关系读作「上一格指向下一格」。当前 Skill 位于第二格，上下分别是影响它与被它影响的 Skill。
第一层 · 这些 Skills 用了我
第二层 · 当前 Skill
第三层 · 我用了这些 Skills
在所属技能集的全局上下文中浏览当前 Skill 的关系。点击节点切换右侧详情,搜索框可快速定位技能。
技能文件