APP開發設計應以人為本！淺談APP互動設計原則

標籤：映射   協助   迅雷   輸入   mda   not   統一   簡單   相關   

      為什麼APP開發設計需要原則？設計原則其實就是對一些設計過程中基於人類的認知規律對設計做出的一些指導性原則，並且對已經成為行業共識的設計經驗做個總結，用來指導設計師界定問題、提高效率。

      先就APP開發設計 http://www.czwew.com 常州紫竹雲科技產品經理分享互動設計的時候最為大家所認可的幾條設計原則：可學習性、一致性、簡潔性、流暢性、及時反饋。除了這麼六個？還有其他的嗎？你放心，如果需要還有更多。

一、經常用的設計原則有哪些?

1.可學習性

 

      目標使用者在已有的知識和經驗基礎上，能正確理解產品介面，無需要思考而一目瞭然;或者是使用者通過自己的學習，藉助提示或協助說明，能夠理解產品介面。則介面具有了可學習性。

      可學習的內容包括：明確當前所在位置，知道當前能幹什麼、接下來要幹什麼，能快速辨別介面中的元素並明白其功能。在設計時可採用合理的隱喻、習慣用法、有效啟示。例如手機中收音機的調頻顯示和音量大小控制，類比真實收音機，一目瞭然。其實這是隱喻的手法，隱喻是非常利於新使用者學習的，從現實世界中直接映射過來。

 

2.一致性

 

      在相似的情景下，應在幾個方面保持一致性：視覺表現、互動行為、操作結果。良好的一致性，可以減少使用者學習成本培養使用者習慣，也可體現產品設計的嚴謹。如果有不同，應作相應的區別處理，特別是視覺表現上要予以區分。

 

3.簡潔性

 

      少即是多，儘可能精簡介面上的元素。當設計出原型，先將元素減半，然後再看能否再簡化。生活其實很簡單，但很多時候我們人為將其複雜化了。保證主要任務流程順利完成，消減其餘不相關元素的幹擾。

 

簡潔體現在三個方面：

• 減輕視覺幹擾；

• 精簡文字表述；

• 簡化操作步驟。

•  

 

4.流暢性

 

      使用者操作連貫，任務完成順暢，避免幹擾或打斷。明確最基本的核心任務，並保證它的順利執行，輔助操作應在不影響核心任務的基礎上展開。

 

      避免幹擾，讓使用者明確在特定介面中的首要任務和目標，儘可能避免介面上的視覺噪音和其他幹擾;避免打斷，讓使用者的操作保持連貫性，模態框的使用要謹慎。Gmail在把郵件刪除後，會將刪除的彈框設計成List Notification非模態這種方式，提醒使用者撤銷剛才的刪除操作，這種的處理，讓刪除的流程更加順暢和輕鬆自如。

 

5.及時反饋

 

      介面中任何可操作的地方，當使用者發生操作時，都應該及時給予反饋。讓使用者瞭解操作已經生效，介面還在使用者的控制之下。反饋內容包括：使用者操作反饋和產品狀態反饋。

 

      操作反饋，指的是介面元素在使用者進行滑過、點擊、移開等操作時，元素的反饋變化。狀態反饋，指的是產品在運行需要使用者等待或者系統出錯時的反饋，讓使用者明白狀況。迅雷每次下載完成都有聲音提醒音樂播放時的進度條顯示就是這類反饋。

 

6.可探索性

 

      使用者在使用產品過程也是一個探索過程，產品應該允許使用者犯錯，即使犯錯了也不能埋怨使用者，而且必須給使用者重新嘗試的機會，讓使用者處於放鬆的心態。

 

      設計過程中，首先要協助使用者避免出錯，比如採用合適的控制項(相同情況下選擇控制項比輸入控制項出錯機會更小)，給予輸入協助或啟示。在登陸郵箱的過程中如果忘記密碼，在登陸表徵圖的旁邊會有一個”忘記密碼?”的提示表徵圖，來提醒使用者不用擔心，點擊進入來解決問題。

      使用者出錯後，需要提供撤銷或返回功能，使使用者返回到上一步操作重新探索。出錯反饋要親和，避免責備使用者或魯莽的打斷或推出產品，要禮貌的指出錯誤所在並提供有用的補救建議。

 

除了這麼六個？還有其他的嗎？你放心，如果需要還有更多。

 

1. 一個介面為主要角色設計，而不是為所有人設計。

2. 為日常情境設計，不要讓邊緣情境主導你的設計。

3. 所有的習慣行為都需要學習，好的習慣行為只需學習一次。

4. 除了輸入所有的行為支援滑鼠操作;除了繪圖所有的行為支援鍵盤操作。

5. 在滿足需求的前進下，介面的資訊越少越好。

6. 在滿足需求的前進下，介面的功能越少越好。

7. 在滿足需求的前進下，介面的互動次數越少越好。

8.  介面的操作方式最好一目瞭然，不需要協助。

9. 操作前可預知;操作中有反饋;操作後可撤消。

10. 充分利用隱喻設計。

11. 讓使用者知道身在何處。

12. 介面結構合理、功能布局、措詞統一，突出重點。

13. 日常情境使用的介面應放在主要位置，且盡量的大。

14. 一般介面的顏色不超過3種，且避免大面積使用刺眼的顏色。

15. 減少使用者的記憶負擔，盡量讓使用者識別，而不是回憶。

16. 尊重使用者的習慣思維和行為，除非你有更好的設計。

17. 關注使用者的目標，而不是任務。

18. 盡量避免對話方塊，且對話方塊深度最多不應超過3級。

19 …

現在是不是已經看到快吐了?

二、設計原則這麼多，到底該怎麼用啊?

 

       紫竹雲科技產品部深切的感受到如果每次做設計都按照這些原則一條條的去比對，那麼就會“一條複一條，原則何其多”，於是就簡化總結了一下，互動就是設計行為，行為就是一連串的動作，具體到動作中的每一個環節都會有一個受動的對象，比如點擊按鈕、快顯視窗、閱讀彈窗內容、關閉彈窗等等，截取整個一連串動作中的一個對象——按鈕來看，分為前、中、後三個階段：

 

       ● 前期：使用者在點擊前對於點擊後的結果心理是有個預期的，是由之前頁面的上下文和按鈕本身資訊(文案、形狀等)來決定的；

 

       ● 中期：點擊的每一步動作都需要按鈕有個反饋，滑鼠進入按鈕的感應地區、懸浮(hover)在按鈕上，按鈕應該自身有個狀態的的變化，比如顏色，點擊中也應該有個變化；

 

       ● 後期：手動點擊後彈出的對話方塊是否符合使用者的心理預期，比如按鈕上邊的文字是“下載”，預期其實就是下載文檔，結果彈出一個對話方塊告訴你積分不夠，這樣做的體驗就是不好的。

 

     簡單的按鈕是這樣，複雜的登入註冊流程甚至是時間間隔好幾天的流程也是這樣，都適合用這個三個階段來劃分，只是量的大小問題。

 

雖然設計原則眾多，但是可以分為四類：

 

1. 設計價值

 

      這個是設計工作是否有效必要條件，決定了一下幾個層次的次級原則其實就是這個設計是否符合使用者的需求，是否滿足使用者的目標，互動設計在這一層次能夠為使用者做什麼。這一層做不好，後邊的都免談。

 

2. 概念設計

 

       用來界定產品定義，產品如何融入廣泛的使用情境，產品是怎麼使用的?以什麼形式呈現給使用者?是Web還是App？是為新手做引導還是為中間使用者提供方便等等。

 

3. 行為原則

 

      描述產品在一般情景和特殊情景應有的行為，這個才是我們上邊提到的一堆設計原則，什麼及時反饋啦、可學習啦。

 

4. 介面原則

 

     描述行為及資訊有效視覺傳達，這個就是“布局要突出重點”啦、“一個介面同時最好完成一個任務啦”等等。

 

 

三、符合設計原則與滿足使用者目標有衝突時如何權衡?

 

       設計是的本質就是為使用者解決問題提供價值，設計以人為本，使用者目標是最重要的。

APP開發設計應以人為本！淺談APP互動設計原則