SuperAPI AI 工具集

instant-0-100ms

通用与其它

查看项目

更新于 10-15 21:36

技能介绍

用途:该技能用于构建 100 毫秒以内的瞬时 UI 反馈动画,例如按钮按下、开关切换、复选框与单选框选择、焦点环出现、悬停颜色变化、触摸涟漪起始等,让界面感觉即时、响应迅速。

主要能力:以迪士尼动画原则为框架,说明在瞬时速度下哪些做法有效。可用:挤压与拉伸(按钮按下 2-5% 的轻微压缩)、缓出(ease-out,全速起步后轻微减速)、线性路径、极少的夸张(0.95-1.05 缩放或透明度变化)、以颜色与透明度变化为主。不适用:预备动作、跟随动作、次要动作、弧线、复杂多步序列、可见位移、超过 15 度的旋转、多属性同时变化、分阶段揭示。时序建议最多 1-3 帧,60fps 下每帧 16.67ms。

使用方式:资料给出缓动建议,如 transition: all 50ms ease-out;、transition: opacity 80ms linear;、transition: transform 50ms ease-out;。实现模式示例:.button:active { transform: scale(0.97); transition: transform 50ms ease-out; } 以及 .toggle-on { background: var(--active); transition: background 80ms ease-out; }。

适用场景与限制:核心观点是瞬时速度下动画用于确认而非传达信息,用户不应有意识地感知动画,而应感受到界面在响应。资料未提供安装命令、平台支持、收费或价格等信息。