用途
该技能在用户请求动画、转场、微交互、滚动效果、页面转场、动态排版、视差、悬停物理、加载序列，或任何让网页界面显得生动、高级的需求时触发。其目标是把静态页面提升为具有工作室级质感的体验。
主要能力
- 四阶段流水线：Phase 1 动效审计（分类、提取动效意图）→ Phase 2 编排（序列图、时间表、缓动调色板）→ Phase 3 构建（逐层实现：入场 → 滚动 → 悬停 → 转场 → 环境动效）→ Phase 4 动效差异检查（60fps 检查、手感检查、reduced-motion 审计）。每个阶段都有质量门，未通过则阻断下一阶段。
- 动效人格锁定：必须从 Surgical（精准）、Physical（物理）、Cinematic（电影感）中选定一种，并约束全部下游决策，禁止混用。
- 缓动调色板：分三层，优先使用 CSS linear() 实现真实弹簧物理，其次为 cubic-bezier，用于环境/背景动效。
- 元素动效覆盖清单：为页面上每个可见元素分配入场、滚动揭示、悬停/聚焦、环境/微动效，任何空行即视为实现不完整。
- 动效预算频率门：按使用频率分配动效预算，键盘触发的操作永不动画。
- 无障碍：所有动画必须置于 prefers-reduced-motion 之后，reduced motion 下仅允许透明度淡入淡出。
使用方式
技能以流程形式运作：先填写动效上下文分类表，锁定动效人格，标记动效层，填写元素动效映射表，输出动效简报，再进入编排与构建。资料中提供了 CSS linear() 弹簧缓动调色板的代码蓝图，以及各阶段的质量门检查项。
适用场景
营销落地页、产品应用、作品集、电商、编辑类页面、仪表盘等需要高级动效的网页界面。
限制
资料未提供具体安装命令、依赖版本、框架集成细节、浏览器兼容性范围、性能基准数据或收费信息，这些内容暂未提供。