一、前言

本次分享開(kāi)始前我們可以先思考幾個(gè)問(wèn)題：

1. 決定設(shè)計(jì)方案的依據(jù)是感覺(jué)嗎？
2. 從哪里入手改進(jìn)產(chǎn)品的體驗(yàn)?zāi)兀?/li>
3. 如何將設(shè)計(jì)理論應(yīng)用到項(xiàng)目中？

接下來(lái)我將逐層解析尼爾森十大設(shè)計(jì)原則，并分享 10 個(gè)設(shè)計(jì)案例，以此來(lái)解答上述問(wèn)題。

二、尼爾森十大設(shè)計(jì)原則詳解

隨著用戶使用習(xí)慣的養(yǎng)成和偏好場(chǎng)景的變化，體驗(yàn)設(shè)計(jì)不僅要滿足可用性和功能性的使用要求，更進(jìn)一步也需要滿足用戶的個(gè)性化需求和情感需求。體驗(yàn)設(shè)計(jì)師需要具備一定的設(shè)計(jì)理論支撐和可落地性強(qiáng)的設(shè)計(jì)策略來(lái)應(yīng)對(duì)這一要求和挑戰(zhàn)。

全球著名可用性專家尼爾森博士提煉出的十項(xiàng)交互設(shè)計(jì)原則是"啟發(fā)式"的經(jīng)驗(yàn)法則，被廣泛運(yùn)用于網(wǎng)頁(yè)設(shè)計(jì)、交互設(shè)計(jì)、UI 設(shè)計(jì)等各種人機(jī)交互領(lǐng)域之中。

以下將尼爾森十大設(shè)計(jì)原則與具體的頁(yè)面案例進(jìn)行搭配和解析，如您有不同見(jiàn)解或更優(yōu)的設(shè)計(jì)方案建議，歡迎討論。

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

系統(tǒng)應(yīng)該通過(guò)在合理時(shí)間內(nèi)對(duì)用戶的操作進(jìn)行適當(dāng)反饋，告知用戶正在發(fā)生的事情或者當(dāng)前的狀態(tài)。不要蒙蔽用戶，系統(tǒng)與用戶之間也是有存在信任度。

1）根據(jù)系統(tǒng)響應(yīng)時(shí)間的長(zhǎng)短，通過(guò)不同的設(shè)計(jì)方案反饋用戶。

2）適當(dāng)反饋：對(duì)用戶操作進(jìn)行適當(dāng)反饋是用戶界面設(shè)計(jì)的基本準(zhǔn)則。讓用戶了解當(dāng)前所處的狀態(tài)、位置、操作是否成功、進(jìn)度如何，增強(qiáng)用戶的操控感，減少不確定性。通過(guò)設(shè)計(jì)方案的功能設(shè)定指引用戶進(jìn)行正確的操作，而不是在迷霧中前行。

3）進(jìn)度反饋：進(jìn)度存在的情境通常有頁(yè)面加載進(jìn)度、文件下載或上傳進(jìn)度、視頻播放進(jìn)度、社交軟件發(fā)表動(dòng)態(tài)進(jìn)度等。

4）位置反饋：網(wǎng)絡(luò)世界和現(xiàn)實(shí)世界之間存在很多隱喻。人們?cè)诂F(xiàn)實(shí)世界的物理空間中需要導(dǎo)航系統(tǒng)指引，例如機(jī)場(chǎng)登機(jī)口的指示標(biāo)識(shí)。網(wǎng)絡(luò)同樣也需要一些視覺(jué)元素對(duì)用戶進(jìn)行提醒，以免用戶迷失造成疑惑。

5）反饋方式多樣化：反饋的形式可以是視覺(jué)反饋、聲音反饋、觸覺(jué)反饋等。也許未來(lái)有一天智能硬件設(shè)備可以散發(fā)特定的味道為用戶提供個(gè)性化服務(wù)。

2. 系統(tǒng)與現(xiàn)實(shí)世界的匹配。

使用用戶聽(tīng)得懂的設(shè)計(jì)語(yǔ)言、單詞、短語(yǔ)、圖形等，而不是炫技的過(guò)于技術(shù)化的專業(yè)術(shù)語(yǔ)。

1）使用目標(biāo)用戶的語(yǔ)言。這里的語(yǔ)言是泛指，包含產(chǎn)品的色彩風(fēng)格、圖形偏好等。產(chǎn)品的語(yǔ)言應(yīng)該是用戶能夠清晰的理解，并高效的完成目標(biāo)任務(wù)。如果用戶難以理解，他們會(huì)產(chǎn)生挫敗感，會(huì)感受到不被尊重，進(jìn)而不再使用該產(chǎn)品。

2）模擬現(xiàn)實(shí)。在運(yùn)動(dòng)軟件，游戲軟件中較為常見(jiàn)，讓用戶更有沉浸感和真實(shí)感。

3. 可控性原則

用戶在遵循自身心智使用產(chǎn)品的過(guò)程中會(huì)"錯(cuò)誤"的使用系統(tǒng)功能，這時(shí)需要有幫助用戶離開(kāi)的明確標(biāo)識(shí)。比如，支持撤銷和重做，以及草稿箱等。

4. 一致性和標(biāo)準(zhǔn)化原則

遵循平臺(tái)的慣例。在同一平臺(tái)中，同一用語(yǔ)、功能、操作保持一致性，減少用戶疑惑。

1）與用戶的使用習(xí)慣保持一致，用戶不需要重新學(xué)習(xí)，各種產(chǎn)品的相似功能具有一致性。

2）產(chǎn)品規(guī)范化。在同一產(chǎn)品中，同一層級(jí)的信息應(yīng)使用一致的設(shè)計(jì)語(yǔ)言。例如導(dǎo)航、彈窗、按鈕、列表等元素，這也是我們推行設(shè)計(jì)組件化的原因之一。

5. 防錯(cuò)原則

用戶在使用產(chǎn)品的過(guò)程中會(huì)不經(jīng)意間"犯錯(cuò)"，這時(shí)需要對(duì)用戶進(jìn)行提醒，以免造成損失。

1）范圍限制。通過(guò)明確的規(guī)則定義限制用戶的可選項(xiàng)。

2）二次確認(rèn)。一些重要的操作需要進(jìn)行二次確認(rèn)，并將操作后果告知用戶。

6. 協(xié)助記憶原則

盡量減少用戶對(duì)目標(biāo)任務(wù)的記憶負(fù)荷，交互動(dòng)作和選項(xiàng)都應(yīng)可見(jiàn)，系統(tǒng)的使用說(shuō)明應(yīng)該是容易獲取的。

1）非必要的情境中，讓用戶選擇而不是輸入。因?yàn)檫x擇更加便捷。

2）自動(dòng)讀取，減少操作。降低用戶記憶負(fù)荷，把信息直接呈現(xiàn)給用戶。

3）內(nèi)容可預(yù)期，用戶無(wú)需在頁(yè)面間來(lái)回跳轉(zhuǎn)。

7. 靈活高效原則

優(yōu)秀的產(chǎn)品需要兼顧新用戶和資深用戶的使用需求。對(duì)于新用戶來(lái)說(shuō)，希望功能明確、清晰，而老用戶希望能夠快捷高效的使用高頻功能。最好不要為了迎合某一類型用戶，將不必要的信息占據(jù)頁(yè)面的重要位置。

1）提供快捷入口。首頁(yè)放置常用功能，或者支持用戶自定義入口。

2）允許用戶重復(fù)操作，高頻功能提供快捷入口。

3）通過(guò)提供系統(tǒng)默認(rèn)選項(xiàng)，減少用戶的多余操作。

8. 簡(jiǎn)約設(shè)計(jì)原則

頁(yè)面中的每個(gè)信息元素都會(huì)降低主要內(nèi)容的相對(duì)可見(jiàn)性，盡量不要包含不相關(guān)或低頻次的信息/操作。

1）建立清晰的視覺(jué)層級(jí)，讓用戶可以無(wú)障礙的瀏覽信息，越重要的內(nèi)容越突出。

2）降低頁(yè)面的信息干擾。頁(yè)面中背景、裝飾元素的使用要克制，不要干擾到用戶對(duì)信息的閱讀。

9. 容錯(cuò)原則。

用戶使用產(chǎn)品發(fā)生錯(cuò)誤后，可以快速幫助用戶識(shí)別和糾正錯(cuò)誤。

1）給出操作引導(dǎo)。

2）幫助用戶從錯(cuò)誤中恢復(fù)，安撫用戶的行為挫敗感，將損失降到最低。

10. 人性化幫助原則

有必要提供使用幫助和文檔。幫助性提示最好的方案依次是：無(wú)需提示；一次性提示；常駐提示；幫助文檔。

①信息引導(dǎo)。

②步驟引導(dǎo)。復(fù)雜流程可利用登門檻效應(yīng)分步驟引導(dǎo)用戶完成，而不是將所有操作呈現(xiàn)給用戶，那樣會(huì)嚇到用戶。

小結(jié)：尼爾森十大設(shè)計(jì)原則源于對(duì)大量設(shè)計(jì)經(jīng)驗(yàn)的總結(jié)，也是我們檢驗(yàn)與評(píng)估設(shè)計(jì)方案的重要參考依據(jù)。但在實(shí)際的工作中，不可盲目套用設(shè)計(jì)原則，而是需要根據(jù)不同的用戶場(chǎng)景和使用偏好靈活運(yùn)用。接下來(lái)我將分享 10 個(gè)優(yōu)秀的設(shè)計(jì)案例，詳細(xì)闡述如何將設(shè)計(jì)原則運(yùn)用到具體的用戶場(chǎng)景之中。

三、優(yōu)秀設(shè)計(jì)案例詳解

1. 騰訊視頻

騰訊視頻的投票組件和視頻進(jìn)度條的互動(dòng)功能很好的滿足了用戶個(gè)性化的使用需求。在觀看影視劇《樂(lè)游原》時(shí)，當(dāng)播放到特定節(jié)點(diǎn)時(shí)，會(huì)彈出互動(dòng)組件讓用戶對(duì)劇情發(fā)展進(jìn)行投票操作，增加了用戶的參與感。

2. 美團(tuán) app

借助設(shè)計(jì)心理學(xué)，運(yùn)用的特定設(shè)計(jì)方案有效支撐業(yè)務(wù)目標(biāo)。以及通過(guò)實(shí)時(shí)活動(dòng)小組件增強(qiáng)用戶的操控感，緩解用戶的等待焦慮。

3. 小紅書(shū)

在使用小紅書(shū)發(fā)布動(dòng)態(tài)的情境中，通過(guò)對(duì)非模態(tài)組件的設(shè)計(jì)和交互文案的優(yōu)化給用戶提供輕松愉悅的使用體驗(yàn)。

4. 優(yōu)酷

優(yōu)酷視頻看劇完播的情境中通過(guò)相關(guān)內(nèi)容推薦和視頻進(jìn)度條給到用戶優(yōu)秀的峰終體驗(yàn)。

5. 使命召喚手游

射擊類型的手游中，使命召喚通過(guò)文本和游戲內(nèi)導(dǎo)航功能的設(shè)定提供流暢易學(xué)的游戲體驗(yàn)。

6. 中國(guó)銀行

金融類 app 使用中，通過(guò)設(shè)計(jì)細(xì)節(jié)突出其安全性，并兼顧易用性。

7. 高德地圖

在使用地圖類軟件查詢公交的實(shí)時(shí)狀態(tài)時(shí)，通過(guò)提高系統(tǒng)狀態(tài)的可見(jiàn)性，增強(qiáng)用戶操控感，并通過(guò)動(dòng)畫等設(shè)計(jì)細(xì)節(jié)緩解用戶的等待焦慮。

8. Moo 日記

側(cè)重情感類型體驗(yàn)的社交類 app，通過(guò)各種趣味性設(shè)計(jì)引導(dǎo)用戶完成發(fā)布動(dòng)態(tài)的操作。

9. Lightroom 蘋果端手機(jī)版

滑桿控件兼具快速調(diào)整和細(xì)微調(diào)整兩個(gè)功能，讓用戶獲得高效和細(xì)膩的使用體驗(yàn)。

10. NeckGo

一款健康類 app，趣味性的界面設(shè)計(jì)給予用戶愉悅的使用體驗(yàn)，并運(yùn)用設(shè)計(jì)心理學(xué)提升付費(fèi)操作的轉(zhuǎn)化率。

四、總結(jié)

本文結(jié)合具體案例詳細(xì)解析了尼爾森十大設(shè)計(jì)原則，以及分享了 10 個(gè)值得借鑒的設(shè)計(jì)案例。這些內(nèi)容可以在一定程度幫助我們規(guī)避一些顯而易見(jiàn)的可用性問(wèn)題。但在實(shí)際工作中，面對(duì)用戶不同的使用偏好和個(gè)性化的需求，我們?cè)撛鯓犹峁└蛹?xì)膩更具溫度的使用體驗(yàn)?zāi)?？?qǐng)期待我下一期的設(shè)計(jì)分享。

作者：寂靜之間