用途:为 HyperFrames 合成提供统一动画知识,包括原子规则、多阶段场景蓝图、场景转场、运动设计技法与各运行时适配器。
主要能力:默认方式是组合原子规则,从 rules-index.md 取 2-4 条,用单条暂停的 GSAP 时间线粘合。需要场景级编排时可加载蓝图,如 brand-reveal、social-proof、demo-page-scroll-spotlight 等模板,蓝图入口在 blueprints-index.md,含 recipes 与可运行示例。还提供转场(transitions/overview.md、catalog.md)、技法(techniques.md),以及 GSAP、Lottie、Three.js、Anime.js、CSS、WAAPI、TypeGPU/WebGPU 等适配器说明。
使用方式:按需求查对应文件;GSAP 是 95% 动画工作的默认选择,原子规则均基于 GSAP。可用命令 node skills/hyperframes-motion/scripts/animation-map.mjs <composition-dir> --out <composition-dir>/.hyperframes/anim-map 生成动画映射以审计编排。合成契约见 /hyperframes → core/。
限制:须遵守 core 的不可协商规则(单条暂停时间线、data-duration 控长、禁用 Math.random/Date.now/performance.now、禁用 repeat:-1 等);空间运动仅用 GSAP transform 别名 x/y/scale/rotation,不用 width/height/top/left 做布局动画;坐标须在设置阶段预先计算,不能在 tween 时用 getBoundingClientRect() 测量。