一、前言

本次分享開始前我們可以先思考幾個問題:

  1. 決定設計方案的依據(jù)是感覺嗎?
  2. 從哪里入手改進產(chǎn)品的體驗呢?
  3. 如何將設計理論應用到項目中?

接下來我將逐層解析尼爾森十大設計原則,并分享 10 個設計案例,以此來解答上述問題。

更多尼爾森設計原則干貨:

二、尼爾森十大設計原則詳解

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

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

超多案例!深度解析尼爾森十大設計原則

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

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

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

1)根據(jù)系統(tǒng)響應時間的長短,通過不同的設計方案反饋用戶。

超多案例!深度解析尼爾森十大設計原則

2)適當反饋:對用戶操作進行適當反饋是用戶界面設計的基本準則。讓用戶了解當前所處的狀態(tài)、位置、操作是否成功、進度如何,增強用戶的操控感,減少不確定性。通過設計方案的功能設定指引用戶進行正確的操作,而不是在迷霧中前行。

超多案例!深度解析尼爾森十大設計原則

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

4)位置反饋:網(wǎng)絡世界和現(xiàn)實世界之間存在很多隱喻。人們在現(xiàn)實世界的物理空間中需要導航系統(tǒng)指引,例如機場登機口的指示標識。網(wǎng)絡同樣也需要一些視覺元素對用戶進行提醒,以免用戶迷失造成疑惑。

超多案例!深度解析尼爾森十大設計原則

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

超多案例!深度解析尼爾森十大設計原則

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

使用用戶聽得懂的設計語言、單詞、短語、圖形等,而不是炫技的過于技術化的專業(yè)術語。

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

超多案例!深度解析尼爾森十大設計原則

2)模擬現(xiàn)實。在運動軟件,游戲軟件中較為常見,讓用戶更有沉浸感和真實感。

超多案例!深度解析尼爾森十大設計原則

3. 可控性原則

用戶在遵循自身心智使用產(chǎn)品的過程中會“錯誤”的使用系統(tǒng)功能,這時需要有幫助用戶離開的明確標識。比如,支持撤銷和重做,以及草稿箱等。

超多案例!深度解析尼爾森十大設計原則

4. 一致性和標準化原則

遵循平臺的慣例。在同一平臺中,同一用語、功能、操作保持一致性,減少用戶疑惑。

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

超多案例!深度解析尼爾森十大設計原則

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

超多案例!深度解析尼爾森十大設計原則

5. 防錯原則

用戶在使用產(chǎn)品的過程中會不經(jīng)意間“犯錯”,這時需要對用戶進行提醒,以免造成損失。

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

超多案例!深度解析尼爾森十大設計原則

2)二次確認。一些重要的操作需要進行二次確認,并將操作后果告知用戶。

超多案例!深度解析尼爾森十大設計原則

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

盡量減少用戶對目標任務的記憶負荷,交互動作和選項都應可見,系統(tǒng)的使用說明應該是容易獲取的。

1)非必要的情境中,讓用戶選擇而不是輸入。因為選擇更加便捷。

超多案例!深度解析尼爾森十大設計原則

2)自動讀取,減少操作。降低用戶記憶負荷,把信息直接呈現(xiàn)給用戶。

超多案例!深度解析尼爾森十大設計原則

3)內容可預期,用戶無需在頁面間來回跳轉。

超多案例!深度解析尼爾森十大設計原則

7. 靈活高效原則

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

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

超多案例!深度解析尼爾森十大設計原則

2)允許用戶重復操作,高頻功能提供快捷入口。

超多案例!深度解析尼爾森十大設計原則

3)通過提供系統(tǒng)默認選項,減少用戶的多余操作。

超多案例!深度解析尼爾森十大設計原則

8. 簡約設計原則

頁面中的每個信息元素都會降低主要內容的相對可見性,盡量不要包含不相關或低頻次的信息/操作。

1)建立清晰的視覺層級,讓用戶可以無障礙的瀏覽信息,越重要的內容越突出。

超多案例!深度解析尼爾森十大設計原則

2)降低頁面的信息干擾。頁面中背景、裝飾元素的使用要克制,不要干擾到用戶對信息的閱讀。

超多案例!深度解析尼爾森十大設計原則

9. 容錯原則。

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

1)給出操作引導。

超多案例!深度解析尼爾森十大設計原則

2)幫助用戶從錯誤中恢復,安撫用戶的行為挫敗感,將損失降到最低。

超多案例!深度解析尼爾森十大設計原則

10. 人性化幫助原則

有必要提供使用幫助和文檔。幫助性提示最好的方案依次是:無需提示;一次性提示;常駐提示;幫助文檔。

①信息引導。

超多案例!深度解析尼爾森十大設計原則

②步驟引導。復雜流程可利用登門檻效應分步驟引導用戶完成,而不是將所有操作呈現(xiàn)給用戶,那樣會嚇到用戶。

超多案例!深度解析尼爾森十大設計原則

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

三、優(yōu)秀設計案例詳解

1. 騰訊視頻

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

超多案例!深度解析尼爾森十大設計原則

2. 美團 app

借助設計心理學,運用的特定設計方案有效支撐業(yè)務目標。以及通過實時活動小組件增強用戶的操控感,緩解用戶的等待焦慮。

超多案例!深度解析尼爾森十大設計原則

3. 小紅書

在使用小紅書發(fā)布動態(tài)的情境中,通過對非模態(tài)組件的設計和交互文案的優(yōu)化給用戶提供輕松愉悅的使用體驗。

超多案例!深度解析尼爾森十大設計原則

4. 優(yōu)酷

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

超多案例!深度解析尼爾森十大設計原則

5. 使命召喚手游

射擊類型的手游中,使命召喚通過文本和游戲內導航功能的設定提供流暢易學的游戲體驗。

超多案例!深度解析尼爾森十大設計原則

6. 中國銀行

金融類 app 使用中,通過設計細節(jié)突出其安全性,并兼顧易用性。

超多案例!深度解析尼爾森十大設計原則

7. 高德地圖

在使用地圖類軟件查詢公交的實時狀態(tài)時,通過提高系統(tǒng)狀態(tài)的可見性,增強用戶操控感,并通過動畫等設計細節(jié)緩解用戶的等待焦慮。

超多案例!深度解析尼爾森十大設計原則

8. Moo 日記

側重情感類型體驗的社交類 app,通過各種趣味性設計引導用戶完成發(fā)布動態(tài)的操作。

超多案例!深度解析尼爾森十大設計原則

9. Lightroom 蘋果端手機版

滑桿控件兼具快速調整和細微調整兩個功能,讓用戶獲得高效和細膩的使用體驗。

超多案例!深度解析尼爾森十大設計原則

10. NeckGo

一款健康類 app,趣味性的界面設計給予用戶愉悅的使用體驗,并運用設計心理學提升付費操作的轉化率。

超多案例!深度解析尼爾森十大設計原則

超多案例!深度解析尼爾森十大設計原則

四、總結

本文結合具體案例詳細解析了尼爾森十大設計原則,以及分享了 10 個值得借鑒的設計案例。這些內容可以在一定程度幫助我們規(guī)避一些顯而易見的可用性問題。但在實際工作中,面對用戶不同的使用偏好和個性化的需求,我們該怎樣提供更加細膩更具溫度的使用體驗呢?請期待我下一期的設計分享。

收藏 129
點贊 60

復制本文鏈接 文章為作者獨立觀點不代表優(yōu)設網(wǎng)立場,未經(jīng)允許不得轉載。