人機交互主流設計原則【干貨】
- 2019-08-08 17:46
- 來源/作者:吳軼/吳軼
- 己被圍觀 次
本篇文章要講的設計原則包含六類: 1.尼爾森十大可用性原則 2.三大原則定律 3.Ant Design設計原則 4.微信小程序設計原則 5.iOS設計原則 6.Material Dedign 設計原則
本篇文章要講的設計原則包含六類:
- 1.尼爾森十大可用性原則
- 2.三大原則定律
- 3.Ant Design設計原則
- 4.微信小程序設計原則
- 5.iOS設計原則
- 6.Material Dedign 設計原則
尼爾森十大可用性原則
尼爾森(Jakob Nielsen)是一位人機交互學博士,于1995年1月1日發表了「十大可用性原則」。十大可用性原則不僅適用于Web端,也適用于移動端。
熟練掌握十大可用性原則對于指導設計來說意義重大,可提升整個產品的可用性體驗。
十大可用性原則分別為:狀態可感知、貼近用戶認知、操作可控、一致性、防錯、識別好過回憶、靈活高效、美學和最簡主義原則、容錯、人性化幫助。
原則一 狀態可感知
定義:告知系統的當前狀態,讓用戶可清晰的感知所處的操作狀態。
例如:淘寶注冊,用戶所處流程情況通過步驟條,可以清晰告知用戶注冊整體的注冊流程狀態。

例如:微信轉發消息,發送成功時,通過底部的snakcbar提示告知用戶轉發成功。
原則二 貼近用戶認知
定義:盡量將生活中的邏輯和設計邏輯保持統一,這樣就會更貼近用戶的認知,用戶上手成本也就更低。
例如:iOS7之前的iPhone解鎖,滑動解鎖,這和生活中的用戶側拉開門的場景一樣。這個設計非常貼切日常生活認知,用戶上手成本特別低。

例如:微信紅包的設計,紅包樣式和現實中用戶認知的紅包基本一致,都是紅色且外觀相似。
用戶要發紅包時,先要塞錢進紅包。其他人點擊紅包時,有一個拆開的按鈕,用戶拆開就會存入零錢,整個流程完全貼近用戶的生活認知。
原則三 操作可控
定義:用戶對于行為可預期可控制。對于用戶的誤操作,提供二次確認或者撤銷的功能,這樣可提高用戶的操作可控性。
例如:移動端中對于毀滅性操作,大部分都做二次確認,這樣是防止用戶誤操作帶來的刪除損失。用戶不用因為操作帶來的心里負擔,從而提升操作可控性。
例如:微信聊天對話列表,用戶刪除列表,由于會清空消息記錄,因此,通過對話框提示用戶,這種做法可提升操作可控。
例如:gmail郵箱,用戶發送郵件成功后,可點擊撤回操作。
原則四 一致性
定義:遵循統一的產品設計規范/邏輯。這里的一致性也包含產品和跨平臺產品之間的一致性。
產品間的一致性,包含視覺和交互的一致性,無論是文案、視覺風格、組件樣式等都包含一致性。
例如:微信的卡片結構設計,列表的提示文案都是卡片里面,這個遵循Material design設計規范,ios中設計則提示語在卡片下方。

原則五 防錯
定義:設置防錯的機制,減少用戶犯錯。避免因為沒有做防錯措施,導致用戶去犯錯誤。
例如:微信朋友圈發動態時,什么都沒有輸入時,發表按鈕置灰。如果不置灰時,點擊發送是空數據,是不允許發送的。所以防錯設計可以減少用戶出錯概率。

原則六 識別好過回憶
定義:減少用戶記憶負荷,盡量提供用戶需要獲取的信息。
例如:boss直聘,二次篩選時,所有填寫是我篩選條件都展示出來,方便用戶查看和修改。

例如:三星手機相冊,當刪除相冊時,對話框會把選擇刪除的數量標題上展示,提示用戶會刪除多少張,減少用戶回憶。

原則七 靈活高效
定義:提供靈活的操作和高效的獲取信息的操作。
例如:mac原生郵件客戶端上,提供過濾方式:未讀,點擊未讀即可篩選出所有未讀的郵件,靈活高效。

例如:短信提供批量刪除和全選刪除,這也是靈活高效的一個常見范例。

原則八 美學和最簡主義原則
定義:保留產品最核心的信息,如果不是視覺信息優先級不是普適需求,要盡一切可能避免去影響產品的簡潔和美觀。
qq空間和微信朋友圈的feed流形成比較明顯的對比。相比于qq空間,微信朋友圈更符合美學和最簡主義原則。

原則九 容錯
定義:用戶在使用產品過程中出現了問題,及時準確的告知用戶出現問題的原因。
例如:淘寶注冊時,用戶輸入手機號時,光標離開輸入框時,進行較驗,如果手機格式錯誤會出現原位提示用戶手機格式不正確。
例如:郵件發送失敗時,會提示用戶郵件已保存至發件箱。

原則十 人性化幫助
定義:在用戶可能需要的時候,提供必要的幫助說明。
例如:在淘寶注冊時,用戶注冊失敗影響注冊成功率,提供幫助入口,提高用戶注冊率。

三大原則定律
三大原則定律包括:格式塔原則、菲茨定律和剃刀法則。
(責任編輯:PS家園網)
*PSjia.COM 傾力出品,轉載請注明來自PS家園網(www.wh207.com)
上一篇:社交互動創新:從點贊到擊掌
下一篇:如何更好地使用柵格系統




