动画效果 - 移动

移动

Material的移动受摩擦力、重力、惯性力等力的影响,且在不同的情境中有的移动轨迹和变化速率。

视窗内的移动

弧线轨迹

上升的物体需要克服重力,竖直方向的速度由慢到快;下落的物体受重力影响,竖直方向的速度提升更快。因此斜向运动的Material层面运动轨迹表现为向下凸起的弧线。

正确

Material层面斜向移动时因重力作用导致其运动路线向下弯曲。

错误

反重力的Material层面移动轨迹显得不自然。

直线轨迹

Material层面朝单一水平或垂直方向移动不需要沿弧线轨迹。

正确

朝单一水平或垂直方向移动的层面只需简单沿直线移动。

错误

朝单一水平或垂直方向移动的层面沿弧线移动徒增了动画的复杂程度。


进出视窗的移动

Material层面沿直线进出视窗。

正确

层面沿直线进出有利于用户视觉焦点轻松跟随进场层面,并快速减弱对退场层面的注意。

错误

层面沿弧线进出不利于用户视觉焦点跟随进场层面,或会误引导用户注意退场元素。

独立移动

若Material层面进入或者退出视窗时不会对视窗内其它元素的位置产生影响,则应:

  • 对进场层面施用减速曲线,减少用户对进场层面原始位置的关注和推测
  • 对长期退场层面施用加速曲线,减少用户对退场层面停止位置的关注和预测
  • 对暂时退场层面施用对称标准曲线,表示层面退至离视窗边缘不远的位置,可以快速唤出
正确

对进场层面施用减速曲线,对长期退场层面施用加速曲线。

错误

层面进场时无需缓慢加速,用户只需要注意层面最终停止的位置。层面退场时也无需缓慢减速,因为层面最终会消失,注意不可见的位置没有意义。

正确

对暂时退场层面施用对称标准曲线。

错误

若层面重新进场的方向与退场方向不一致,则应对离场施用加速曲线,而不是对称标准曲线。

关联移动

若Material层面进入或者退出视窗时会对视窗内其它元素的位置产生影响,则应统一施用标准曲线增强视窗内外层面运动的共性。

正确

对位置互相影响的层面移动施用标准曲线。

错误

视窗内的层面突然快速移动,没有留给用户足够转移注意的时间,或突然完全停止,误形成了限制边界。