一 物體運動
- 為什么需要motion
motion提供:
引導不同視圖
暗示用戶當完成某個動作時的結果
元素之間的層級和空間關系
分散用戶注意力當后臺在運行的時候(比如獲取內容或者加載下一個視圖的時候)
有特點,修飾,令人愉悅的 - 物體是怎樣運動的
(1)反應靈敏 一旦觸發,能夠快速響應
(2)自然運動 在外力作用下自然運動
(3)與周圍物體互動
(4)具有目的性 引導用戶的注意力 - 一個成功的動作設計具有的特點
(1)快速 避免引起用戶不必要的等待
(2)動作簡潔干凈連續,避免一次做太多動作
(3)運動是相關的 物體是速度,反應和目的的結合,app的每一個自定義的動作應該保持統一貫穿于整個app。
二 持續時間與緩入緩出
- 速度 速度的大小既要足夠快不讓用戶等待又要給予充分的時間讓用戶理解這種過渡
2 持續時間 持續時間與物體的運動距離,速度及表面變化相吻合,而不是用單一的持續時間,當一個物體離開屏幕的時候用更短的時間因為它們沒必要引起用戶的注意。
通常的持續時間:
(1)手機:
通常情況下,手機上動作的過渡時間一般在300ms左右,但以下情況除外:
大的,復雜的,全屏的過渡需要更長的過渡時間,375ms左右;
進入屏幕需要225ms;
離開屏幕需要195ms
過渡時間超過400ms,會讓人覺得太漫長。
(2)大屏幕:
大屏幕需要的持續時間要大于小屏幕的,因為物體相同時間內,運動距離越長速度越大。
(3)平板電腦
平板運動的持續時間比手機長30%。例如,在手機上需要300ms的運動時間在平板電腦上需要390ms。
(4)可穿戴設備
在可穿戴設備上的運動持續時間要比手機上短30%。
(5)臺式電腦
臺式電腦上的運動應該比移動設備的更快更簡潔。一般在150ms到200ms。
因為臺式電腦的過渡不需要太明顯,復雜的web運動經常導致丟失幀,快速的運動使得這個現象不明顯。
- 自然的緩入緩出
(1)物體的加速和減速要平滑
(2)加速和減速不對稱
緩入緩出曲線的有多種形式,最常見的有:標準曲線,減速曲線,加速曲線,銳曲線
標準曲線:最常見的的形式,物體快速加速緩慢減速,適用于事物放大和縮小
減速曲線:物體全速進入屏幕,然后減速到達靜止位置,在減速過程中,物體或者尺寸增大到100%,或者透明度增加到100%。有些情況下,當物體進入屏幕時透明度為0%,在進入的過程中可能會尺寸稍微縮小。
加速曲線:物體全速離開屏幕。離開過程中不減速。物體在動畫一開始就開始加速,活著尺寸減速到0%,或者透明度減到0%。
銳曲線:適用于物體會隨時回到屏幕的情況下。
加速出現在屏幕,減速離開屏幕,加速和減速時對稱的。減速過程快于標準曲線。