SuperAPI AI 工具集

motion-design

设计与创作

查看项目

更新于 10-15 21:13

技能介绍

用途:motion-design 是一套动效设计约束,用于在界面设计与评审中判断动画是否应该存在。核心原则是:动画必须服务于四种目的之一,否则移除。

四种目的:反馈(50-150ms),确认操作已被接收,如按钮按下、开关切换、表单提交;方向引导(200-400ms),展示空间关系,如侧边栏滑入、弹窗从触发点缩放;强调(300-600ms),吸引注意力,如通知脉冲、新元素淡入,应罕见且有意义;愉悦(时长可变),营造情绪效果,如加载个性、完成庆祝,需简短、可跳过、绝不阻塞。要求为每个动画归类,若不属于任何一类则删除。

品味信号:克制,最好的动效是让人察觉不到的动效;整个系统使用一致的缓动曲线;基于物理的运动(到达用 ease-out,离开用 ease-in,UI 中绝不使用 linear);时长与目的成正比,功能性越强越快。

反模式:加载动画比实际加载时间更长;页面转场延迟内容访问;给每个元素都加悬停效果(动效应引导注意力而非制造噪音);在功能元素上使用弹跳/弹性缓动(俏皮缓动用于庆祝而非导航);为动效而动效。

使用方式:在对话中输入 /motion-design 即可将动效设计约束应用到当前对话。

限制:资料未提供具体平台、收费、价格或效果数据,暂未提供。