用途:该技能面向 800-1200ms 区间的慢速动画,定位接近电影化表达,用于值得用户停下观看的关键时刻,例如应用启动序列、重大功能揭示、叙事时刻、错误恢复动画、成就解锁、教程序列、首次运行体验、演示中的章节切换,以及加载状态到内容的揭示。
主要能力:以迪士尼动画原则指导慢速运动,包括夸张的挤压与拉伸(25-35% 形变)、200-300ms 的完整预备动作、场景化构图与入场顺序、4-6 个关键姿势的姿势到姿势法、200-300ms 的延展跟随、强缓入缓出、明显弧线路径、多层次级动作、60fps 下 48-72 帧的计时、戏剧化夸张、完整维度变换(视差、深度、3D 旋转)以及情感连接。
使用方式:资料给出缓动建议,如 transition: all 1000ms cubic-bezier(0.16, 1, 0.3, 1); 以及优雅入场、沉重落地、弹性记忆等曲线;并提供 slowReveal 关键帧与 .slow-reveal、.sequence-item 交错序列的 CSS 实现模式,交错延迟用 calc(var(--index) * 150ms)。
限制:不适合视图间导航(太慢)、重复交互(用户会不耐烦)、高频操作、数据密集型界面和生产力工具。核心原则是慢动画以注意力为代价,只在时刻值得用户时间时使用。