UI動效設(shè)計怎么做

UI動效設(shè)計怎么做

UI動效設(shè)計怎么做?動畫效果現(xiàn)在已經(jīng)滲透到UI界面的每個角落，由于動效效應(yīng)，屏幕之間的切換更加連貫，而交互式的語境邏輯由于動效效應(yīng)而更加清晰。今天小編主要給大家分享UI動效設(shè)計怎么做，希望對你們有幫助!

動效的持續(xù)時間和速度

當元素的位置和狀態(tài)發(fā)生變化時，動效的速度應(yīng)該足夠慢，以保持足夠長的時間讓用戶注意到變化，但同時，不應(yīng)該慢到需要用戶等待。

大量研究表明，動效的最佳持續(xù)時間在200毫秒到500毫秒之間。這個研究數(shù)字是基于人腦的認知方式和信息消化的速度。任何小于100毫秒的動效對于人眼來說幾乎是瞬間的，難以識別。然而，超過一秒鐘的動效又會讓人感覺遲鈍。

在移動設(shè)備(如手機)上，動效持續(xù)時間應(yīng)控制在200至300毫秒之間，而在平板電腦上，持續(xù)時間應(yīng)延長約30%，即持續(xù)時間應(yīng)在400至450毫秒之間。網(wǎng)頁的處理方式也不同。因為我們習(xí)慣于直接在瀏覽器中打開網(wǎng)頁，考慮到瀏覽器的性能和大家的使用習(xí)慣，用戶對瀏覽器動效變化速率的預(yù)期仍然相對較快。

與移動終端中的動效速度相比，網(wǎng)頁中的速度會快上一倍，換句話說，動效的持續(xù)時間應(yīng)該在150到200毫秒之間。如果持續(xù)時間太長，用戶會覺得網(wǎng)頁卡住了。

大屏幕=較慢的動效

事實絕對不是這樣。

請記住，動效的持續(xù)時間不僅僅取決于屏幕大小和運動距離，還取決于平臺特性、元素大小、功能設(shè)置等。不管是什么平臺，元素越小或變化越小，相應(yīng)的動效應(yīng)該越快。因此，大而復(fù)雜的元素動效持續(xù)時間更長，看起來更舒適一點。

動效的運動規(guī)律應(yīng)符合物理規(guī)律，當元素移動到邊界并發(fā)生碰撞時，碰撞的“能量”將最終均勻分布。然而，彈跳的特效在大多數(shù)情況下并不適用，僅適用于特殊情況。

元素的運動過程應(yīng)該是清晰的，盡量不要在運動中使用模糊效果，模糊效果不適合ui界面。

列表項使用的動效在實際的移動過程中，項與項之間應(yīng)有輕微的延遲，元素之間的延遲應(yīng)控制在20 ~ 25毫秒之間。如果持續(xù)時間較長，可能會給人一種遲滯的觀感。