用途：为课程材料、仪表盘、Hero 页面和技术演示生成美观、可交互的动画组件。核心理念是动效服务于理解，每个动画必须能引导注意力、提供交互反馈或揭示静态布局无法展示的结构，否则应删除。
主要能力：提供五种输出模式——component-snippet（Next.js/React 可复制 .tsx）、single-file-html（单文件 HTML，内联 CSS+JS，CDN Motion，≤80KB）、dashboard-widget（KPI、迷你图、动画图表）、interactive-experience（多节交互式课程教程）、landing-page（Hero 驱动的营销/提案页）。库选择优先级：CDN 可移植 Motion 模式、shadcn 注册表组件、GSAP+ScrollTrigger、Lottie、View Transitions API。动效语汇默认使用 motion/react 导入、弹簧 { duration: 0.5, bounce: 0.25 }、缓动令牌与 150/300/500/700ms 时长，并始终尊重 prefers-reduced-motion。
使用方式：根据交付物选择模式；若为交互式多节课程选 interactive-experience，有 Next.js 项目选 component-snippet，单页展示选 landing-page，仪表盘小部件选 dashboard-widget，其余选 single-file-html。
适用场景：课程页、仪表盘、Hero 区、产品落地页、技术演示。
限制：不适用于静态文档、纯文本输出或基础组件；禁止紫色/粉色渐变 Hero、无意图玻璃拟态、表情符号堆砌、通用图标卡片网格、超过 1.2 秒的动画、触摸设备悬停动画，以及混用 framer-motion 与 motion/react。该技能扩展 codebase-to-course 设计系统，不重复其令牌。