淺談產品設計可用性原則
互聯網上有許多關於用戶體驗和產品設計的研究,寫的都很值得學習,如產品體驗要素中的五大層級的方法論、劃分需求類型的KANO模型等。但用戶體驗這個概念終究難免讓人感覺有些虛,畢竟她不具體指代某個事物,於是乎在這篇文章里,本小白選用尼克森的十大產品可用性原則來分析當我們在設計產品的時候,該注意哪些要素、該如何讓用戶感知到產品是友好的,該如何增強我們對用戶體驗的獲得感,讓她變得看得見、摸得著。
先介紹一下這位牛人:Jakob Nielsen是畢業於哥本哈根的丹麥技術大學的人機交互博士 , 他擁有79項美國專利,專利主要涉及讓互聯網更容易使用的方法,被賦予人機交互實踐的終身成就獎。他還被紐約時報稱為「Web 易用性大師」,被 Internet Magazine 稱為 「易用之王」。
狀態可見原則(Visibility of system status)
金句:系統應該讓用戶知道發生了什麼,在適當的時間內做出適當的反饋。 用戶在網頁上的任何操作,不論是單擊、滾動還是按下鍵盤等等,頁面應即時給出反饋。
解釋:基本所有的網站和APP都有導航欄的功能,Axure中也有站點地圖的功能,這些都是為了讓使用者明白自己目前在哪個位置,在操作哪些功能以及明確接下來的操作邏輯。」即時反饋」(feedback within reasonable time)到底是多麼即時呢? 這個當然由用戶說了算,不能讓用戶不舒服,也就是 用戶可以接受的等待時間差。一個頁面載入頁你不能讓我等數十秒,這樣用戶早就退出去了,讓用戶沒有明顯感知的應該控制在2秒內。
再如做了一個下拉動作後今日頭條、新浪微博、QQ都給出了相應的反饋信息,這就是所謂的狀態可見性,這就是給用戶的反饋,而不至於操作一個動作後任何反饋都沒有。網上的一個比喻「你要把你的用戶想像成一個極沒有安全感的小姑娘,你要時時向她(用戶)彙報你在幹什麼,只有這樣她(用戶)才不會感到無助、沒有方向、不知道幹什麼「。
環境貼切原則(Match between system and the real world)
金句:系統應該用用戶的語言,用詞,短語和用戶熟悉的概念,而不是系統術語。遵循現實世界的慣例,讓信息符合自然思考邏輯。網頁的一切表現和表述,應該儘可能貼近用戶所在的環境(年齡、學歷、文化、時代背景),而不要使用第二世界的語言。
解釋:許多APP的icon隱喻式的設計與擬物化是對這句話的一個很好的解釋。我們所做的任何一個交互點應該清晰易懂,不要讓用戶思考這是什麼,也不要輕易改變一些約定的習慣。比如,一個已付款的icon(通常如下圖標記處),無論是微信還是支付寶都是這個樣子,但你為了所謂的博人眼球,「創新」的設計出一個只有你這個APP才有的圖標類型,這就很尷尬了。
撤銷重做原則(User control and freedom)
金句:用戶經常錯誤地選擇系統功能而且需要明確標識離開這個的「出口」,所以需要做到當用戶在使用產品的過程中可以自由進退,當用戶陷入麻煩時要給用戶提供離開的出口即為用戶提供撤銷、重作等相關操作。
解釋:微信的消息撤回和郵箱的郵件撤回功能都是例子。據說有個面試產品的哥們被問到「為何微信會推出消息撤回功能並且設置在兩分鐘內」,網上回答七嘴八舌,有的甚至深入到厚黑學中…其實從這點原則出發,無非就是給用戶一個改錯的機會嘛,還不給我手滑? (當然有可能有其他原因 如增加社交趣味性等。至於為啥時兩分鐘,據說大數據顯示微信端從發出信息到接收人看到信息人均是2分鐘)
一致性原則(Consistency and standards)
金句:產品在遵循平台慣例的基礎上也要保證產品功能操作、控制項樣式、界面布局、提示信息的一致性,不要讓用戶在使用產品的時候發現不符合產品規範的地方。
解釋:這一點就是說你讓你的小姑娘對你產生信任了後,就不要多情善變啦,一個APP中的收藏icon,要不統一都是五角星型,要不統一是愛心型,不應該使用兩套標準。返回按鈕也是一樣。再如下圖兩款產品從啟動頁到首頁都是一個主色調,顯得統一整齊。而有的APP卻經常會忽略這一點,比如在淘寶的專題頁里你會發現,上一個下面和下一個頁面風格常常變化得很大,甚至讓你感激到這不是同一個APP里的內容(當然這點更應該是業務的問題,淘寶的小二隻管自己的KPI,哪有時間統一這些看起來不太必要的細節)
防錯原則(Error prevention)
金句:用戶在使用產品的時候難免會出錯,但一個好的產品應該是在用戶容易出錯的地方防止或直接把出錯的可能性給去除掉,避免錯誤的發生。因此如何讓用戶避免出錯就需要對產品頁面的設計、布局、規則上進行反覆驗證,並把發生錯誤的可能性降到最低或沒有。
解釋:許多網站對於刪除的操作往往都會有再次提醒的功能,如微信取消關注微信公號的功能,防止用戶誤操作(當然也是為了給公號點機會);再如途游網站上用萬年曆的元件取消手動輸入日期,同時將出發和結束時間進行分屏操作,這都是為了盡量將可能出錯的情況降低到最小程度。 當然還有很多,像「確認」和「取消」的按鈕,誰放在左邊誰放在右邊都是有考慮的,符合使用習慣、減少出錯機會。
易取原則(Recognition rather than recall)
金句:盡量減少用戶對操作目標的記憶負荷,動作和選項都應該是可見的。用戶不必記住一個頁面到另一個頁面的信息。系統的使用說明應該是可見的或者是容易獲取的。
解釋:人都是懶得,使用我們APP的用戶更懶,你能幫他省事,他就給你機會。就像早期蘋果手機出來的時候就非常富有創新力。市面上的手機都是帶實體鍵盤的,用戶需要記憶各種按鍵代表的意思,要實現一個功能可能出現多次按鍵,但iPhone的home一個鍵就可以了。(據說這個創新最初來源於抽水馬桶的一鍵沖水的設計 你懂得)。還有許多APP都會提供歷史記錄的功能,也是為了方便用戶去回憶曾經做過的操作,直接去記錄欄里找就可以了,如微信的紅包記錄頁,網易雲音樂的最近播放的歌曲記錄頁。
靈活高效原則(Flexibility and efficiency of use)
金句:用戶在使用產品時能夠方便快捷的完成相關任務或動作,即讓用戶以最快最便捷的方式完成任務。為大多數用戶設計,不要低估,也不可輕視,保持靈活高效。
解釋:這裡原文將用戶分為初級用戶、中級用戶、高級用戶。這三類用戶需求範圍依次擴大,要求的功能點也可能逐步升級,比如新媒體工作者常用的微信編輯器,有的用戶只需要使用文字和圖片編輯,操作一下模板就可以了,而有高級點的用戶則會使用代碼來使用更多的樣式更強大的功能(如下圖 其實兩者最終是一個效果)。但要始終記得二八原則,中級用戶數遠遠大於高級和初級用戶,為大多數用戶設計。
當然這個原則還有一個點就是方便快捷的操作,如QQ里會出現最近用的表情作為快捷回復,搜狗輸入法里會優先顯示你常打的關鍵詞等。
簡單化原則(Aesthetic and minimalist design)
金句:對話中不應該包含無關緊要的信息。在段落中每增加一個單位的重要信息,就意味著要減少相應的弱化一些其他信息。 互聯網用戶瀏覽網頁的動作不是讀,不是看,而是掃。易掃,意味著突出重點,弱化和剔除無關信息。
解釋: 要知道一頁可以展示的信息就那麼大,急於把你的信息一股腦傳遞給用戶只會適得其反。就像早期的淘寶網首頁一樣,信息繁雜缺乏次重點。在一個統一的頁面中,每個內容的出現都會影響到每條信息所佔的權重,而這個權重比是否分配的科學,會直接影響到用戶的感知效果,繼而影響用戶體驗。
下圖據說是調研公司做的熱力圖,研究了網站用戶在瀏覽網頁的時候首先看的哪裡會更多一些,停留得更久一些。所以你應該盡量簡單化你的設計,根據用戶習慣突出主次,這樣的效果才會更好一些 。優質的案例可以參見微信就行了,就是一個極簡的產品設計。但其實你看看微信,並不是因為人家內容少而顯得結構簡單,而是遵從了秩序,這裡安利一句前輩的話「想追求極簡的設計,不只是因為是拋去了多餘的裝飾,更是因為它能給複雜帶來秩序!」
容錯原則(Help users recognize, diagnose, and recover from errors)
金句:錯誤信息應該用語言表達(不要用代碼),較準確地反應問題所在,並且提出一個建設性的解決方案。同時幫助用戶從錯誤中恢復,將損失降到最低。如果無法自動挽回,則提供詳盡的說明文字和指導方向,而非代碼,比如404。
解釋:這個原則和某些職場毒雞湯是一樣的,聘你來公司不要只給我提出一堆問題,既然出現這個狀況了,你得給我解決了,不能辦完事擦擦屁股就走人了。像谷歌瀏覽器和早期的簡書出錯時給出的多種解決方式。再如註冊郵箱或者註冊APP賬號的時候,如果輸入的已經被註冊過的賬號則會有dialog或者toast提示你。
人性化幫助原則(Help and documentation)
金句: 為用戶提供必要的幫助文檔或者手段,文檔中要包含用戶所要的各種情況和信息,幫助文檔要全、簡單、用詞要本地化。幫助性提示最好的方式是:1、無需提示;2、一次性提示;3、常駐提示;4;幫助文檔。
解釋:如果系統不使用文檔當然是最好的,但是有必要提供幫助和文檔。任何信息應容易去搜索,專註於用戶的任務,列出具體的步驟來進行。實際上這點市場上用的是很多,基本每款APP都會有,形式不一,有的蒙灰指引,有的在旁邊加上問號的icon,有的加入一個使用說明頁藏在設置里,有的直接留下可以直接撥打的400電話。但還是要遵守上面的原則,是否有必要加,必要加的話採用什麼形式,放在什麼位置才會顯得更加有意義。
後記:這十條原則是尼克森老爺子在1995那年提出來的,不得不佩服這都過去二十多年依舊對現今有著巨大的指示作用,有人說互聯網變化得很快,但有些共通的東西曆久彌新。當然,某些地方也會存在不太合適的地方,這會在產品人日常工作實踐中不斷改進。
推薦閱讀:
※讀書筆記-上癮:讓用戶養成使用習慣的四大產品邏輯
※在生物醫學中心展示博士期間研發的助推型交互科技
※簡單好用的產品,背後都藏著這個定律 #019
※富途牛牛產品視覺組組長JimSoup:設計是我和其他人的媒介
※流程篇:產品交付和迭代