SuperAPI AI 工具集

fitness-wellness

设计与创作

查看项目

更新于 10-15 16:24

技能介绍

用途

这套动画原则用于指导健身应用、健康平台、运动追踪器与冥想类产品的界面动效设计。其目标是把迪士尼十二项动画原则转化为能够激励用户、增强能量感、庆祝成就并支持健康习惯养成的动效语言。

主要能力

资料将十二项原则逐一对应到健身与健康场景:

  1. 挤压与拉伸:训练按钮点击时的能量挤压、进度环随成就脉冲、活动图标完成时的弹跳。
  2. 预期:训练开始前的倒计时积累能量、计时器启动的“准备—就绪—开始”序列、目标完成前的悬念铺垫。
  3. 舞台化:当前动作全屏聚焦、训练中数据展示处于辅助角色、休息时段突出恢复指标。
  4. 逐帧与姿势到姿势:直播训练采用连续计时流(逐帧),动作序列采用逐动作推进(姿势到姿势),冥想引导采用明确的呼吸阶段。
  5. 跟随与重叠动作:训练完成时徽章先落定、随后数据出现;卡路里计数带跟随感落定;活动环按顺序带重叠地动画。
  6. 慢入与慢出:高能量时刻使用快速有力的节奏,恢复与冥想使用缓慢平缓的缓动,转场匹配当前活动强度。
  7. 弧线:进度圆的平滑弧线完成、跑步路线的曲线路径可视化、手势控制的自然弧线运动。
  8. 次要动作:命中目标时成就保存伴随烟花、个人纪录出现皇冠庆祝、连续打卡保持时火焰燃烧同时计数更新。
  9. 时间节奏:激烈时刻使用 100–150ms 的快速动效,正念场景使用 500–700ms 的缓慢动效,常规 UI 使用 200–300ms。
  10. 夸张:大幅庆祝,健身依赖激励感;个人纪录采用戏剧化的成就揭示;连续里程碑采用令人难忘的庆祝。
  11. 扎实造型:身体力学动作演示准确、数据可视化清晰可读、动作插画体现正确姿势。
  12. 吸引力:动效令人振奋、鼓励;双模式区分训练的高强度与健康的平静;每个成就都显得重要。

使用方式

资料给出了一套行业常见的动效时长与缓动标准,可直接作为实现参考:

动作 时长 缓动
按钮按下 150ms ease-out
进度环完成 600ms spring
训练转场 250ms ease-in-out
冥想淡入淡出 500ms ease-in-out
成就弹窗 800ms custom-bounce

适用场景

适用于健身应用、健康平台、运动追踪器与冥想体验的界面动效设计与实现,尤其适合需要同时兼顾“训练激励”与“身心放松”两类氛围的产品。

限制

资料未提供具体的技术框架、代码实现、组件库或平台适配说明,也未提及收费、价格或效果数据,这些信息暂未提供。