交互設(shè)計(jì)師必懂的尼爾森十大原則

4 評(píng)論 21397 瀏覽 205 收藏 14 分鐘

尼爾森十大原則作為交互設(shè)計(jì)師的基礎(chǔ)理論知識(shí),各位設(shè)計(jì)師需要聊熟于心。

前段時(shí)間在某個(gè)群里看到有個(gè)小伙伴說(shuō),他在面試的時(shí)候面試官讓他說(shuō)尼爾森的十大可用性原則。

雖說(shuō)尼爾森10大可用性原則是交互設(shè)計(jì)師的基礎(chǔ)理論知識(shí),但是實(shí)際上,不知道或者不完全知道的小伙伴也有很多,今天就以實(shí)例跟大家聊聊尼爾森十大原則。

系統(tǒng)狀態(tài)可見(jiàn)性

定義:系統(tǒng)應(yīng)該在適當(dāng)?shù)臅r(shí)間內(nèi)做出適當(dāng)?shù)姆答?,告知用戶?dāng)前的系統(tǒng)狀態(tài);該原則強(qiáng)調(diào),產(chǎn)品要給用戶適當(dāng)?shù)姆答仭?/p>

當(dāng)頁(yè)面在加載的時(shí)候,需要告訴用戶頁(yè)面在加載,而不是空白的頁(yè)面。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

再比如按鈕的點(diǎn)擊,以前網(wǎng)速比較慢,當(dāng)你點(diǎn)擊完按鈕時(shí),無(wú)法立馬打開(kāi)新的頁(yè)面,需要等一會(huì)兒。

如果沒(méi)有點(diǎn)擊反饋,那么用戶很可能以為自己沒(méi)有點(diǎn)上,然后重復(fù)點(diǎn)擊,導(dǎo)致一下子會(huì)打開(kāi)很多重復(fù)頁(yè)面。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

再來(lái)看這個(gè)例子,當(dāng)你收到了微信的Push。于是,你點(diǎn)開(kāi)微信,發(fā)現(xiàn)沒(méi)有任何新消息。你會(huì)不會(huì)在想剛剛明明是告訴我微信有新消息的,為什么沒(méi)有?是軟件出了問(wèn)題?是自己網(wǎng)絡(luò)出了問(wèn)題?還是手機(jī)出了問(wèn)題?

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

現(xiàn)在又收到了微信的Push,于是點(diǎn)開(kāi)了微信,發(fā)現(xiàn)聊天窗口有一個(gè)記錄顯示“對(duì)方撤回了一條消息”。這時(shí)你就知道了,原來(lái)他剛剛給我發(fā)了一條消息然后撤回了,怪不得沒(méi)有新消息。這就是為什么當(dāng)對(duì)方撤回消息時(shí),微信會(huì)給出提示。

系統(tǒng)與現(xiàn)實(shí)世界相匹配

定義:系統(tǒng)應(yīng)該使用用戶熟悉的詞、句、語(yǔ)法,應(yīng)該符合真實(shí)世界中的使用習(xí)慣;該原則強(qiáng)調(diào),產(chǎn)品要使用用戶語(yǔ)言。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

比如這些彈窗的文案,簡(jiǎn)潔明了,通俗易懂。如果我們?cè)谖陌钢袑憽包c(diǎn)擊主按鈕”即可參與,那么很多用戶就會(huì)不理解“主按鈕”是什么意思。

用戶控制與自由

定義:用戶在使用產(chǎn)品時(shí)經(jīng)常會(huì)誤操作,因此需要一個(gè)非常明確的“緊急出口”來(lái)幫助他們脫離困境,需要支持撤銷與重做;該原則強(qiáng)調(diào),產(chǎn)品需要支持用戶“反悔”。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

作為設(shè)計(jì)師,撤銷、重做的重要性大家都知道,你想萬(wàn)一你每次只要畫錯(cuò)一點(diǎn)點(diǎn)就要從頭開(kāi)始重新畫,那得多崩潰。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

Gmail一次性將多個(gè)郵件標(biāo)為已讀時(shí),會(huì)有“撤銷”功能,防止出現(xiàn)誤操作,將重要未讀的郵件標(biāo)記已讀。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

當(dāng)你在打字時(shí),搖動(dòng)手機(jī)即可撤銷輸入的內(nèi)容,當(dāng)你刪除了部分文案時(shí),搖動(dòng)手機(jī)即可恢復(fù)刪除的內(nèi)容。

一致性與標(biāo)準(zhǔn)化

定義:產(chǎn)品的信息架構(gòu)、交互方式、功能名詞、視覺(jué)表現(xiàn)等應(yīng)該具有一致性;該原則強(qiáng)調(diào),產(chǎn)品需要具有一致性。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

一致性大到產(chǎn)品的架構(gòu),小到icon、文案,利用設(shè)計(jì)系統(tǒng)可以協(xié)助我們保持產(chǎn)品的一致性。

預(yù)防錯(cuò)誤

定義:無(wú)論錯(cuò)誤場(chǎng)景設(shè)計(jì)的多好看,都不如在第一時(shí)間防止用戶發(fā)生錯(cuò)誤;該原則強(qiáng)調(diào),產(chǎn)品需要有防錯(cuò)機(jī)制。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

填寫銀行卡信息時(shí),由于數(shù)字過(guò)長(zhǎng),因此我們將銀行卡填寫時(shí)以4位數(shù)字為一組便于用戶輸入,這個(gè)也屬于一種防錯(cuò)機(jī)制。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

同樣的,手機(jī)號(hào)登錄時(shí),將手機(jī)號(hào)分成344形式也可以降低錯(cuò)誤率,便于用戶檢查輸入的正確性。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

再比如支付寶兌換頁(yè)面,提示用戶積分不足同時(shí)按鈕置灰,也屬于防錯(cuò)機(jī)制。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

當(dāng)出現(xiàn)危險(xiǎn)操作或者不可逆操作時(shí),會(huì)進(jìn)行二次確認(rèn),防止用戶出現(xiàn)錯(cuò)誤。

辨認(rèn)而不是回憶

定義:將用戶的記憶負(fù)擔(dān)最小化,盡可能減少讓用戶去記住信息,應(yīng)該提供信息讓用戶辨認(rèn)。

我經(jīng)常遇到這樣的情況,讓我說(shuō)XX歌是怎么唱的,我說(shuō)不上來(lái),但是如果有音樂(lè)我就能知道是什么歌,這是就是辨認(rèn)與回憶的差別。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

淘寶搜索時(shí),使用關(guān)鍵詞聯(lián)想,這種情況下,即便有些商品名稱記得不完全,我們也能輕松搜到。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

有些歌名很長(zhǎng),很難記住,因此QQ音樂(lè)的關(guān)鍵詞聯(lián)想也解決了這個(gè)問(wèn)題。

靈活性與使用效率

定義:無(wú)論是老手還是小白,都能夠輕松高效的使用產(chǎn)品。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

當(dāng)產(chǎn)品進(jìn)行大版本迭代時(shí),會(huì)出現(xiàn)引導(dǎo)彈窗來(lái)提示用戶如何操作,讓用戶快速上手。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

當(dāng)產(chǎn)品第一次打開(kāi)時(shí),此時(shí)有很大可能是小白用戶,一般情況下會(huì)進(jìn)行新手引導(dǎo)來(lái)告訴用戶怎么做。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

學(xué)習(xí)能力有強(qiáng)有弱,有些用戶看一遍引導(dǎo)就知道怎么做,快速成為老手,而有些用戶可能還不太會(huì)用出于新手狀態(tài),此時(shí)引導(dǎo)就要做出區(qū)分,比如UOKA相機(jī),如果你一直點(diǎn)擊下方縮略圖切換,則會(huì)出現(xiàn)提示,告訴你左右滑動(dòng)也可以切換。

好看而簡(jiǎn)潔的設(shè)計(jì)

定義:頁(yè)面中不要出現(xiàn)無(wú)關(guān)的或者冗余的信息,每個(gè)多余的信息都會(huì)分散用戶的注意力;該原則強(qiáng)調(diào),產(chǎn)品要簡(jiǎn)潔明了

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

頁(yè)面內(nèi)容合理,不能用太多無(wú)用的內(nèi)容來(lái)分散用戶的注意力,讓用戶聚焦。

幫助用戶發(fā)現(xiàn)、判斷和修復(fù)錯(cuò)誤

定義:錯(cuò)誤信息需要告知用戶哪里有問(wèn)題,并且告知用戶如何解決問(wèn)題,而不是展示代碼;該原則強(qiáng)調(diào),異常狀態(tài)要告知用戶如何解決。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

比如上面這2個(gè)示例,雖然空狀態(tài)做的還比較精致,但是沒(méi)有告知用戶該如何解決這個(gè)問(wèn)題。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

這個(gè)示例中,第一張圖是搜索無(wú)結(jié)果,此時(shí)用按鈕告知用戶可以重新嘗試(搜索),第二張圖是沒(méi)有分組,因此用按鈕引導(dǎo)用戶創(chuàng)建一個(gè)分組。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

左圖中沒(méi)有數(shù)據(jù)的情況下,提示用戶可以返回首頁(yè)看看,右圖因?yàn)閮?chǔ)存空間不足給用戶報(bào)錯(cuò),用按鈕告知用戶可以去管理儲(chǔ)存空間。

幫助文檔

定義:即便最好就是不需要幫助文檔就能輕松使用產(chǎn)品,但是當(dāng)用戶需要幫助時(shí),幫助文檔需要易于查找,專注于用戶的任務(wù),列出使用步驟,并且信息量不能過(guò)大;該原則強(qiáng)調(diào),幫助文檔要清晰。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

微信在幫助里面羅列了熱門問(wèn)題,協(xié)助用戶快速解決問(wèn)題。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

QQ在幫助里面以不同的功能進(jìn)行信息架構(gòu),但是基礎(chǔ)功能是哪些功能?增值服務(wù)又是哪些?這些名詞并不容易理解。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

QQ音樂(lè)在幫助反饋中也首先展示了熱點(diǎn)問(wèn)題,協(xié)助用戶快速解決

總結(jié)

尼爾森十大可用性原則是交互設(shè)計(jì)師必須掌握的知識(shí),甚至有些時(shí)候面試還會(huì)提問(wèn),因此一定要聊熟于心。

不懂尼爾森十大原則?那還不算交互設(shè)計(jì)師

注:部分圖片來(lái)自網(wǎng)絡(luò),侵刪。

 

作者:何必復(fù)雜;公眾號(hào):何必復(fù)雜(UXSimple)

本文由 @何必復(fù)雜 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載

題圖來(lái)自Unsplash,基于CC0協(xié)議

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 系統(tǒng)狀態(tài)可見(jiàn)性、預(yù)防錯(cuò)誤、辨認(rèn)而不是回憶、幫助用戶發(fā)現(xiàn),判斷和修復(fù)錯(cuò)誤這4個(gè)好贊??

    來(lái)自廣東 回復(fù)
  2. 這個(gè)很好。我應(yīng)該發(fā)給我老板看看~

    來(lái)自廣東 回復(fù)
  3. 看了一遍,收藏以后再溫習(xí)

    回復(fù)
  4. 回復(fù)