十年前，用戶界面避免使用動畫，大多數(shù)與彈出界面和閃爍性廣告相關，但這已經(jīng)發(fā)生了變化。如今，交互設計和動畫的細節(jié)制作讓現(xiàn)代網(wǎng)站和app產(chǎn)生根本的不同。這種心態(tài)的轉變在zurb的聲明中有清晰地表達。
我們不再只是設計靜態(tài)屏幕。我們設計的是如何使用戶可以從屏幕中得到具有愉悅感的內容。
如果我們要設計更好的產(chǎn)品，那么我們需要從最初開始全心接受app和網(wǎng)站的交互特性。
為什么動畫起作用
從本質上來說，動態(tài)動作在用戶界面中享有高的地位。文本拷貝和靜態(tài)圖像都不能與運動相抗衡。我們的眼睛天生就會注意移動物體——這幾乎是一種反射。我們可以很好利用這個功能性動畫。
什么是功能性動畫？
功能性動畫，作為設計功能的一部分，是嵌入在UI中的一種微妙的動畫。它有一個非常清晰和合乎邏輯的目的
減少認知負荷
防止盲點變化
在空間關系中建立更好的回憶
在以人為中心的設計方法中，用戶是主要的焦點。用戶界面需要直觀、具響應性和人性化。功能性動畫可以幫助你實現(xiàn)這些目標。
功能性動畫如何提高用戶體驗
我們對app或網(wǎng)站的體驗和印象是由多種因素共同作用形成的，其中交互作用扮演著重要的角色。當我們找到合適的環(huán)境時，在我們的設計中加入動態(tài)是有意義和功能的。經(jīng)過深思熟慮和測試的功能性動畫有可能實現(xiàn)多個功能，包括：
1.視覺反饋
良好的交互設計提供反饋。反饋承認系統(tǒng)已經(jīng)接收到用戶的行為，并演示了交互的結果，不管它是否成功，這個組的動畫都需要非常精細，并且具有設計感
按鍵反饋
在現(xiàn)實生活中，按鍵響應我們的交互，這就是我們如何期望事物起作用的方式。為了能夠預測用戶的數(shù)字界面，我們應該采取同樣的方式
來源：Jaron Pulver
動作結果視覺化
通過遵循原則可以看到，不告訴你，你可以使用動畫反饋來強調出錯的地方。例如，在不正確的密碼輸入上，出現(xiàn)視覺抖動動畫。這就像搖頭一樣，好像在說“不，再試一次”。用戶會注意到動畫，并立即了解當前的狀態(tài)。
您還可以加強用戶正在執(zhí)行的操作。在下面的例子中，當用戶點擊“提交”時，一個微調器會在app顯示成功狀態(tài)之前短暫出現(xiàn)。選擇目錄動畫讓用戶覺得流程已經(jīng)成功完成。
圖片致謝：Colin Garven
2.軟化處理的狀態(tài)改變
在設計中，加入動畫的其他好的地方是在變化的時刻。特別是在web上，用戶界面上的狀態(tài)變化經(jīng)常需要進行硬性的削減，這可能會使他們難以跟上。沒有什么比突然的變化更讓人感到不自然的了。界面的突然變化對用戶來說是很難處理的。這些變化的時刻應該通過
UI設計添加一些動畫來軟化。
建立連接
動畫轉換應該作為用戶界面的不同狀態(tài)之間的中介，幫助用戶理解當屏幕狀態(tài)發(fā)生變化時，到底發(fā)生了什么。用戶只需跟蹤動作并了解兩個UI狀態(tài)是如何相關的，就可以了。
圖片致謝：Anish Chandran
動畫轉換也能很好地關聯(lián)縮略圖和視圖細節(jié)。動畫卡片從它原來的位置變成了模式的位置，使它清楚地表明內容是相同的，只是有更多的細節(jié)。
對改變喚起注意
動畫可以幫助你的眼睛看到一個新的物體，來自于它的顯露或者隱藏的物體位置，并且可以再次被發(fā)現(xiàn)。我們可以使用動畫來喚起對隱藏或顯示的信息變化的關注，比如打開一邊抽屜的內容。在下面的例子中，當你點擊漢堡包圖標時，主導航就會跳出來。這個動作讓你知道主菜單并沒有消失。
圖片致謝：Tamas Kojo
3.系統(tǒng)狀態(tài)可見性
作為Jakob Nielsen 10個可用性的原始方法之一，系統(tǒng)狀態(tài)的可見性仍然是用戶界面設計中最重要的原則之一。對于用戶來說，在任何予定的時間內了解和清楚他們系統(tǒng)當前的上下文是非常重要的
進度指標
數(shù)據(jù)上傳和下載過程是制作功能性動畫的好機會。動態(tài)加載條設置了對操作的處理速度的期望值。在某些失敗的例子中，動畫是很有幫助的。即使是一個不愉快的通知，比如數(shù)據(jù)下載失敗，也應該以一種更好的方式傳達。
圖片致謝：xjw
下拉刷新
用戶的等待時間是從他們行動的那一刻開始的，最壞的情況是，沒有任何跡象表明，系統(tǒng)已經(jīng)收到了他們發(fā)出指令。刷新動作的吸引力應該有一個即時的反應。重要的是，在收到用戶的請求后應立即給出一些可視化反饋，以表明流程已經(jīng)啟動。而動畫會幫你解決這個問題。
圖片致謝：Tony Babel
4.動畫說明
有時用戶需要一些額外的幫助來理解用戶流，或者如何與某些界面元素相互作用。尤其是用戶界面。對于用戶來說，用戶界面中包含了新的或不熟悉的特性或交互。
登陸界面
用戶登陸要求好的用戶體驗，而在用戶界面上的動畫會對一次使用app的用戶產(chǎn)生巨大的影響，動畫會以一種娛樂的方式，給你無限的自由來傳達任何信息，不管主題多么復雜，多么枯燥。
視覺提示
動畫可以提供一些有用的視覺線索。在一次打開頁面時，最常見的是說明類動畫。動畫顯示了頁面的某些元素是如何被使用的。這種類型的動畫可以在游戲中找到，它通常與漸進式解密聯(lián)系。當你進一步進入游戲時，游戲機制會顯示出來。只有當用戶達到他們的經(jīng)驗的適當點時，才會觸發(fā)這些提示。
結論
當使用復雜的方法時，動畫是強大的工具
我們需要從一開始就全心接受這個動作，并把它看作是我們設計的自然組成部分，因為設計不僅僅是視覺呈現(xiàn)。
正如喬布斯所闡述的設計理念:不僅僅是它的樣子和感覺，設計就是它的工作方式。
網(wǎng)站題目：在UI設計中，使用功能性動畫的四種方法
標題鏈接：http://www.js-pz168.com/news40/189190.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供品牌網(wǎng)站設計、定制網(wǎng)站、網(wǎng)站建設、網(wǎng)站策劃、網(wǎng)站營銷、網(wǎng)站維護
廣告
![]()
聲明：本網(wǎng)站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經(jīng)允許不得轉載，或轉載時需注明來源：
創(chuàng)新互聯(lián)
