用超多案例,幫你掌握尼爾森十大設(shè)計原則

2022-7-3    純純

關(guān)于尼爾森原則

「尼爾森十大原則」又稱為「用戶界面設(shè)計的10種可用性啟發(fā)式」,是由雅各布·尼爾森(Jakob Nielsen)提出的10條交互設(shè)計一般原則。之所以將其定義為“啟發(fā)式”,是因為它們是廣泛的經(jīng)驗法則,而不是特定的可用性準(zhǔn)則。

在官方2019年的描述視頻中將原則定義為「十大UX設(shè)計試探法」,運用這些原則有助于我們試探設(shè)計的邊界,探索設(shè)計的可能性,千萬不要讓原則成為束縛我們設(shè)計的枷鎖。

原則六:識別而不是回憶

“保證元素對象,操作選項的可見性,以此降低用戶的記憶負荷?!?

這個原則直譯文過來的話有點拗口,其實就是指盡量減少需要用戶記憶的東西,特殊情況下提供可選項讓用戶在此確認信息。特別是在一些較為長流程的頁面流轉(zhuǎn)中,一定要注意上下文的關(guān)聯(lián)性,以此協(xié)助用戶進行回憶,而不是從頭開始記憶。

1. 選項可視性

最常見的運用,將選項以用戶最能理解的方式呈現(xiàn)出來,不讓用戶疑惑。

undefined

在平常練習(xí)的飛機稿或者一些風(fēng)格獨特的產(chǎn)品中我們經(jīng)常會看到只使用了icon的tab欄,雖然美觀,但是當(dāng)用戶量達到一定程度,且用戶屬性較多的情況下很容易造成識別上的問題。目前市面上較多的產(chǎn)品還是選擇了文字+icon的展示形式,通過文字與圖形加深用戶的識別,高德則選擇了使用表意最為明確的文字。

2. 頁面可視性

頁面標(biāo)題也是最為常見的運用形式,產(chǎn)品需要清晰的告知用戶目前所處的位置。特別是在一些需要長時間停留,存在操作被打斷的界面中標(biāo)題尤為重要。

undefined

目前市面上常見的產(chǎn)品都會在用標(biāo)題來告知用戶當(dāng)前所處頁面,有段時間特別流行類似APP Store這種刻意放大來突出頁面標(biāo)題。值得一提的是,在IOS中如果從一個APP跳轉(zhuǎn)至另一個APP左上角則會出現(xiàn)上一個APP的名稱,切點擊可以快速返回。如上圖中的淘寶頁面,我是通過微博點擊廣告鏈接后跳轉(zhuǎn)進入的。

3. 交互通用性

只要是用戶熟悉的交互形式,用戶就不用浪費時間去記憶,即使不用文字說明,也能有效的保證用戶的識別。

undefined

在文字閱讀或者編輯的時候,長按可以拷貝/粘貼,即使不用說明,絕大部分用戶也能get到,還有就是預(yù)覽圖片時候,使用手指交換進行縮放。

4. 歷史記錄

提供最近訪問項可以幫助用戶恢復(fù)他們未完成的任務(wù)以及難以回憶的任務(wù)。

undefined

最常見的莫過于瀏覽器的歷史記錄,可以幫助用戶回憶尋找某個時間節(jié)點的內(nèi)容,微信的聊天記錄劃分了更多的維度來幫助用戶搜索相應(yīng)的記錄。淘寶瀏覽商品不穩(wěn)定性較大,有時用戶會因為某個宣傳而點進某個商品,通過足跡可以查看瀏覽記錄,這樣就不用特地去記店鋪名稱或者加入收藏夾了。

原則七:靈活高效的使用

“用戶看不見的加速器(快捷方式)通??梢约涌鞂<矣脩舻慕换ニ俣?,從而使系統(tǒng)可以同時滿足經(jīng)驗不足和經(jīng)驗豐富的用戶。允許用戶定制頻繁的操作。”

系統(tǒng)需要同時適用于新手用戶與專家用戶,對于新手用戶來說,需要盡量降低他們的學(xué)習(xí)成本,幫助他們快速上手,而對于專家用戶來說,他們需要的是快捷以及高效。

1. 千人千面

在注重用戶數(shù)據(jù)分析的今天,很多時候已經(jīng)不用用戶自己手動去設(shè)置自己的偏好,產(chǎn)品便能像你所想。

undefined

左圖的滴答清單是最為常見的為新手用戶準(zhǔn)備的引導(dǎo)方式,右圖支付寶的財富界面,如果是新手用戶,那么金剛區(qū)下方則展示現(xiàn)金紅包,基金推薦等吸新人,如果是基金老用戶了,則會展示更加專業(yè)的數(shù)據(jù)字段來幫助用戶決策。

2. 重復(fù)操作

對于熟悉的產(chǎn)品,一般來說用戶更希望一切趨于穩(wěn)定。

undefined

在外賣這種使用頻次較高選擇項較多的產(chǎn)品中,很大一部分用戶不愿意冒著風(fēng)險嘗試新的菜品,或者點餐決策時間較短(比如開會),他們很多時候會選擇“再來一單”。

3. 快捷方式

在操作同一款軟件時,專家用戶的屏幕只有一個預(yù)覽窗口,而我…恨不得屏幕再大點,塞下所有工具欄。

undefined

在各種軟件中都會設(shè)置快捷鍵便于專家用戶的高效操作,比如專家用戶的Photoshop和我的PS。

原則八:美學(xué)和簡約設(shè)計

“對話中不應(yīng)包含無關(guān)緊要或很少需要的信息。對話中每增加一個信息單元都會與相關(guān)信息單元競爭,從而降低其相對可見度?!?

我們在設(shè)計一個頁面的時候,如果其中的元素都想突出,最終只會導(dǎo)致沒有任何突出的元素。這里可以參考“信噪比”的概念,即相關(guān)信息與無關(guān)信息的比例,用戶的注意力是有限的,降低不必要的視覺噪音,才不會過于分散用戶的注意力,提高用戶效率。

1. 文字內(nèi)容

資訊類產(chǎn)品中最為常見,如果一大段文字又臭又長,那么就很容易影響到想要傳達給用戶的核心思想。

undefined

36氪在快訊頁面中會將重點資訊標(biāo)紅來突出,此外默認情況下只展示資訊標(biāo)題,方便用戶快速瀏覽,如果遇到感興趣的資訊可以再選擇展開瀏覽詳細信息。

2. 視覺元素

利用這個原理,現(xiàn)在的產(chǎn)品會在一些視覺元素處理上做出區(qū)分,不僅能引導(dǎo)用戶快速完成預(yù)設(shè)的操作路徑,且對產(chǎn)品本身業(yè)務(wù)也是相當(dāng)有利。

undefined

淘寶的結(jié)算頁面中,為了促使用戶剁手不受干擾,會將付款btn與其他做高反差處理,同理Airbnb在首頁中將搜索房源作同樣的的處理,只要促使用戶搜索了,那就提高了剁手的轉(zhuǎn)化率。

原則九:幫助用戶識別,診斷錯誤并從錯誤中恢復(fù)

“錯誤信息應(yīng)該使用簡單的語言表示,準(zhǔn)確指示問題并建設(shè)性地提出解決方案。”

原文中特地強調(diào)不要用代碼去表示錯誤信息,即用用戶能夠理解的,通俗的,接地氣的詞匯,千萬不要用一些專業(yè)性術(shù)語。用語盡量禮貌,不要責(zé)怪用戶,讓他們覺得自己是個傻逼,這樣很容易讓他們產(chǎn)生挫敗感。

undefined

得道在使用手機號登錄的時候手機號少輸入了一位,以至于登錄btn一直無法點擊,雖然診斷了錯誤,但是沒有明確的告知用戶錯在哪。Behance在這方面就顯得更為完善,會實時判斷狀態(tài),并且實時告知原因,協(xié)助用戶進行改正。

原則十:幫助文檔

“即使可以在沒有文檔的情況下使用系統(tǒng)會更好,但可能仍需要提供幫助和文檔。任何此類信息都應(yīng)該易于搜索,著眼于用戶的任務(wù),列出要執(zhí)行的具體步驟,并且信息量不要太大。”

每個用戶的背景都有所不同,所以很難確保所有用戶都能暢通無阻的使用自己的產(chǎn)品。無論什么類型的產(chǎn)品,都盡量給用戶提供一個幫助的途徑,對于那些只需要一句話就能概括的,可以考慮在附近進行簡短的說明,而對于需要復(fù)雜說明的,最好統(tǒng)一一個幫助入口,且放置于用戶易于找到的位置。

undefined

在IOS的設(shè)置中,會在一些設(shè)置項下添加簡要的說明,以此來幫助用戶更好的理解。印象筆記與普遍的產(chǎn)品一樣,在菜單欄上有幫助的入口,而且提供精準(zhǔn)的搜索功能,幫助用戶更快的解決有可能遇到的問題。


作者:CE青年   來源:站酷
藍藍設(shè)計建立了UI設(shè)計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計,如果有興趣的話,可以進入一起成長學(xué)習(xí),請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系。

魏華的微信.png

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍藍設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍藍設(shè)計bouu.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 


分享本文至:

日歷

鏈接

個人資料

存檔