2022-10-31 13:31:13|已瀏覽:71次
UI動效設計如何做?動畫效果現(xiàn)在已經(jīng)滲透到UI界面的每個角落,由于動效效應,屏幕之間的切換更加連貫,而交互式的語境邏輯由于動效效應而更加清晰。下面讓我們一起來看看UI動效設計如何做吧。
UI動效設計如何做?
動效的持續(xù)時間和速度
當元素的位置和狀態(tài)發(fā)生變化時,動效的速度應該足夠慢,以保持足夠長的時間讓用戶注意到變化,但同時,不應該慢到需要用戶等待。
大量研究表明,動效的最佳持續(xù)時間在200毫秒到500毫秒之間。這個研究數(shù)字是基于人腦的認知方式和信息消化的速度。任何小于100毫秒的動效對于人眼來說幾乎是瞬間的,難以識別。然而,超過一秒鐘的動效又會讓人感覺遲鈍。
在移動設備(如手機)上,動效持續(xù)時間應控制在200至300毫秒之間,而在平板電腦上,持續(xù)時間應延長約30%,即持續(xù)時間應在400至450毫秒之間。網(wǎng)頁的處理方式也不同。因為我們習慣于直接在瀏覽器中打開網(wǎng)頁,考慮到瀏覽器的性能和大家的使用習慣,用戶對瀏覽器動效變化速率的預期仍然相對較快。
與移動終端中的動效速度相比,網(wǎng)頁中的速度會快上一倍,換句話說,動效的持續(xù)時間應該在150到200毫秒之間。如果持續(xù)時間太長,用戶會覺得網(wǎng)頁卡住了。
大屏幕=較慢的動效
事實絕對不是這樣。
請記住,動效的持續(xù)時間不僅僅取決于屏幕大小和運動距離,還取決于平臺特性、元素大小、功能設置等。不管是什么平臺,元素越小或變化越小,相應的動效應該越快。因此,大而復雜的元素動效持續(xù)時間更長,看起來更舒適一點。
動效的運動規(guī)律應符合物理規(guī)律,當元素移動到邊界并發(fā)生碰撞時,碰撞的“能量”將最終均勻分布。然而,彈跳的特效在大多數(shù)情況下并不適用,僅適用于特殊情況。
元素的運動過程應該是清晰的,盡量不要在運動中使用模糊效果,模糊效果不適合ui界面。
列表項使用的動效在實際的移動過程中,項與項之間應有輕微的延遲,元素之間的延遲應控制在20 ~ 25毫秒之間。如果持續(xù)時間較長,可能會給人一種遲滯的觀感。
注:尊重原創(chuàng)文章,轉載請注明出處和鏈接 http://m.dedgn.cn/news-id-65290.html 違者必究!部分文章來源于網(wǎng)絡由培訓無憂網(wǎng)編輯部人員整理發(fā)布,內容真實性請自行核實或聯(lián)系我們,了解更多相關資訊請關注UI設計頻道查看更多,了解相關專業(yè)課程信息您可在線咨詢也可免費申請試課。關注官方微信了解更多:150 3333 6050