在產(chǎn)品設(shè)計(jì)領(lǐng)域中，尼爾森設(shè)計(jì)原則可以說(shuō)是非?；A(chǔ)和必備的底層邏輯了。這篇文章，作者重新梳理了10大設(shè)計(jì)原則，并加以案例講解，希望可以幫到大家。

尼爾森十大設(shè)計(jì)原則是由著名的用戶(hù)體驗(yàn)專(zhuān)家、網(wǎng)站設(shè)計(jì)師雅各布·尼爾森（Jakob Nielsen）提出的。這些原則旨在幫助設(shè)計(jì)師創(chuàng)建更具用戶(hù)友好性和易用性的數(shù)字產(chǎn)品和網(wǎng)站。

這些原則的來(lái)源可以追溯到尼爾森在其著作《使用者體驗(yàn)的十大原則》（”10 Usability Heuristics for User Interface Design”）中提出的。

一、可見(jiàn)性原則

1. 信息的可見(jiàn)性

用戶(hù)在界面上應(yīng)該能輕易地看到他們需要的信息。如果信息不直接展示給用戶(hù)，那么應(yīng)通過(guò)明顯的提示來(lái)指引用戶(hù)如何獲取。

例如：如果一個(gè)功能可以通過(guò)菜單訪(fǎng)問(wèn)，那么這個(gè)菜單的標(biāo)識(shí)和位置應(yīng)當(dāng)清晰明確。

2. 反饋的可見(jiàn)性

當(dāng)用戶(hù)與界面進(jìn)行交互時(shí)，系統(tǒng)應(yīng)該提供及時(shí)的、可見(jiàn)的反饋。

 

 

例如：當(dāng)用戶(hù)點(diǎn)擊一個(gè)按鈕時(shí)，按鈕可以顯示不同的視覺(jué)效果（如顏色變化、陷入效果等）來(lái)告知用戶(hù)其操作已被系統(tǒng)識(shí)別。

3. 操作的可見(jiàn)性

用戶(hù)可用的操作選項(xiàng)應(yīng)該清晰展示。界面應(yīng)避免隱藏用戶(hù)可能需要的功能。操作的可見(jiàn)性可以通過(guò)良好的界面布局和適當(dāng)?shù)目丶x擇來(lái)加以增強(qiáng)。

例如：當(dāng)斷網(wǎng)時(shí)，下拉刷新用戶(hù)會(huì)看的一個(gè)情感化加載動(dòng)畫(huà)，提示用戶(hù)在加載中。

4. 狀態(tài)的可見(jiàn)性

系統(tǒng)的當(dāng)前狀態(tài)應(yīng)該對(duì)用戶(hù)是明顯的。

例如：在一個(gè)復(fù)雜的表單或多步驟流程中，界面應(yīng)該清楚地顯示當(dāng)前處于哪一步。這樣用戶(hù)可以隨時(shí)了解自己的進(jìn)度和狀態(tài)，降低因迷茫而產(chǎn)生的用戶(hù)挫敗感。

5. 錯(cuò)誤的可見(jiàn)性

如果發(fā)生錯(cuò)誤，應(yīng)該有清楚的錯(cuò)誤信息顯示給用戶(hù)，并且提供簡(jiǎn)單的、操作性的建議來(lái)解決這些錯(cuò)誤。錯(cuò)誤信息應(yīng)該具體到足夠用戶(hù)理解發(fā)生了什么問(wèn)題，并指導(dǎo)他們?nèi)绾渭m正。

例如：我們?cè)谳斎朊艽a的界面時(shí)，出現(xiàn)錯(cuò)誤時(shí)會(huì)在下方提示當(dāng)前密碼輸入錯(cuò)誤，提示引導(dǎo)用戶(hù)請(qǐng)輸入數(shù)字+符號(hào)的組合密碼。

可見(jiàn)性原則在生活中有哪些體現(xiàn)呢？

例如：我們常坐的地鐵到站顯示，乘坐高鐵時(shí)的候車(chē)室列表，還有去超市買(mǎi)菜時(shí)自動(dòng)結(jié)算上顯示的數(shù)量金額、計(jì)算器等。

二、貼近現(xiàn)實(shí)場(chǎng)景原則

1. 模仿真實(shí)物體和行為

模仿用戶(hù)在現(xiàn)實(shí)生活中熟悉的物體和行為，這樣可以使用戶(hù)能夠輕松地理解和使用軟件。

例如：將按鈕設(shè)計(jì)成與現(xiàn)實(shí)中的按鈕相似的樣式，讓用戶(hù)有按下按鈕的直觀(guān)感受。

2. 遵循行業(yè)標(biāo)準(zhǔn)和習(xí)慣

界面設(shè)計(jì)應(yīng)該符合行業(yè)內(nèi)人機(jī)交互和設(shè)計(jì)規(guī)范的標(biāo)準(zhǔn)符合用戶(hù)的習(xí)慣，以減少用戶(hù)的認(rèn)知負(fù)擔(dān)和學(xué)習(xí)成本。

例如：將網(wǎng)頁(yè)的導(dǎo)航菜單放置在頁(yè)面的頂部或側(cè)邊，符合用戶(hù)對(duì)網(wǎng)頁(yè)導(dǎo)航的常規(guī)期待。

3. 保持一致性

在整個(gè)界面中保持一致性，使得用戶(hù)在不同部分之間能夠輕松地轉(zhuǎn)換和理解。這包括一致的布局、一致的交互方式等。一致性可以提高用戶(hù)的操作效率，減少錯(cuò)誤和混淆。

例如：設(shè)計(jì)中的UI規(guī)范，交互樣式保持一致性，書(shū)籍畫(huà)冊(cè)等里面的標(biāo)題內(nèi)容字體大小也遵循一致性原則。

4. 提供直觀(guān)的反饋

當(dāng)用戶(hù)與界面進(jìn)行交互時(shí)，界面應(yīng)該提供及時(shí)、直觀(guān)的反饋，讓用戶(hù)清楚地知道他們的操作已被識(shí)別和響應(yīng)。

例如：按鈕被按下時(shí)產(chǎn)生的視覺(jué)反饋、鏈接被點(diǎn)擊時(shí)的狀態(tài)變化等。

5. 避免違背用戶(hù)期望

界面設(shè)計(jì)應(yīng)避免違背用戶(hù)的期望和常規(guī)操作，否則可能導(dǎo)致用戶(hù)的困惑和挫敗感。

例如：點(diǎn)擊一個(gè)圖標(biāo)卻得到了與期望不符的結(jié)果，這會(huì)讓用戶(hù)感到困惑和不滿(mǎn)。

6. 考慮用戶(hù)的認(rèn)知能力和心理模型

設(shè)計(jì)應(yīng)該考慮用戶(hù)的認(rèn)知能力和心理模型，（需要根據(jù)用戶(hù)畫(huà)像，數(shù)據(jù)統(tǒng)計(jì)等定義用戶(hù)群體，年齡端的不同認(rèn)知也是不同的），使得界面的布局和功能對(duì)用戶(hù)來(lái)說(shuō)更加自然和易于理解。

例如：將相關(guān)的功能組織在一起，符合用戶(hù)的認(rèn)知結(jié)構(gòu)。

例如：最簡(jiǎn)單案例體現(xiàn)，可以從圖標(biāo)的演變過(guò)程就可以感受到，從真實(shí)生活中的電話(huà)演變成圖標(biāo)，一直到現(xiàn)在的扁平化顯示的電話(huà)圖標(biāo)。

貼近現(xiàn)實(shí)場(chǎng)景在生活中有哪些體現(xiàn)呢？

例如：我們生活中的汽車(chē)發(fā)展過(guò)程，從蒸汽汽車(chē)，到油車(chē)再到現(xiàn)在的新能源汽車(chē)，一直在變的是外觀(guān)和里面的內(nèi)飾，不變的是在大家受環(huán)境影響認(rèn)知里的東西，四個(gè)輪子大家很容易就想到車(chē)。

三、用戶(hù)控制和自由原則

1. 提供明確的操作選項(xiàng)

界面應(yīng)該提供清晰明確的操作選項(xiàng)，讓用戶(hù)知道可以做什么以及如何做。

例如：在編輯界面中，應(yīng)該明確標(biāo)識(shí)出保存、撤銷(xiāo)、刪除等操作按鈕，讓用戶(hù)知道可以進(jìn)行哪些操作。

2. 允許用戶(hù)撤銷(xiāo)和返回

用戶(hù)應(yīng)該可以隨時(shí)撤銷(xiāo)之前的操作或返回到之前的狀態(tài)，而不會(huì)造成不可逆的影響。

例如：提供撤銷(xiāo)按鈕、返回按鈕或者多級(jí)回退功能，讓用戶(hù)可以自由地調(diào)整和修正他們的操作。

3. 避免強(qiáng)制性的操作和模式

界面設(shè)計(jì)應(yīng)避免強(qiáng)制用戶(hù)進(jìn)行某些操作或者遵循固定的模式。應(yīng)該給用戶(hù)足夠的自由度，讓他們根據(jù)自己的需求和偏好來(lái)進(jìn)行操作。

例如：不要強(qiáng)制用戶(hù)在注冊(cè)時(shí)填寫(xiě)過(guò)多的信息，而是提供必填和選填項(xiàng)，讓用戶(hù)可以根據(jù)自己的情況選擇填寫(xiě)。

4. 提供明確的退出選項(xiàng)

在界面中應(yīng)該提供明確的退出選項(xiàng)，讓用戶(hù)可以隨時(shí)退出當(dāng)前操作或者返回到上一層級(jí)。

例如：在應(yīng)用程序中提供退出按鈕或者返回到主界面的選項(xiàng)，讓用戶(hù)可以方便地退出當(dāng)前任務(wù)或者返回到初始狀態(tài)。

5. 防止誤操作的發(fā)生

界面設(shè)計(jì)應(yīng)該采取措施防止用戶(hù)因?yàn)檎`操作而造成不必要的損失或者困擾。

例如：在危險(xiǎn)操作（如刪除文件）前要求用戶(hù)確認(rèn)，以避免誤操作造成的后果。

6. 支持鍵盤(pán)快捷鍵和手勢(shì)操作

為用戶(hù)提供鍵盤(pán)快捷鍵和手勢(shì)操作的支持，讓他們可以通過(guò)更快速和高效的方式來(lái)完成操作。這可以提高用戶(hù)的操作效率和滿(mǎn)意度，增強(qiáng)用戶(hù)的控制感和自由度。

用戶(hù)控制和自由原則在生活中有哪些體現(xiàn)呢？

例如：我們經(jīng)常出去吃飯，有些飯店可能比較火需要進(jìn)行預(yù)約，預(yù)約后不想去了可以在軟件上取消也可以打電話(huà)取消。我們進(jìn)行購(gòu)物時(shí)，收到了物品不想要也可以進(jìn)行退換貨。

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

1. 一致的布局和樣式

界面中的布局、排版和樣式應(yīng)該保持一致，讓用戶(hù)在不同頁(yè)面和功能之間能夠輕松地切換和理解。例如：相似的功能應(yīng)該采用相似的排列方式和視覺(jué)風(fēng)格，按鈕、導(dǎo)航欄等元素的位置和樣式也應(yīng)該保持一致。

2. 一致的交互方式

界面中的交互方式和操作流程應(yīng)該保持一致，讓用戶(hù)能夠在不同的功能和場(chǎng)景中使用相似的操作方法。例如：點(diǎn)擊按鈕應(yīng)該在不同頁(yè)面中具有相同的效果，滑動(dòng)手勢(shì)在不同功能中也應(yīng)該具有相似的操作意義。

3. 遵循標(biāo)準(zhǔn)化設(shè)計(jì)規(guī)范

界面設(shè)計(jì)應(yīng)該遵循行業(yè)的標(biāo)準(zhǔn)化設(shè)計(jì)規(guī)范，符合用戶(hù)的習(xí)慣和期望，減少用戶(hù)的認(rèn)知負(fù)擔(dān)和學(xué)習(xí)成本。例如：網(wǎng)頁(yè)設(shè)計(jì)中遵循Web Content Accessibility Guidelines（WCAG）等國(guó)際標(biāo)準(zhǔn)，移動(dòng)應(yīng)用設(shè)計(jì)中遵循iOS Human Interface Guidelines或Material Design等平臺(tái)規(guī)范。

4. 統(tǒng)一的圖標(biāo)和符號(hào)

界面中使用的圖標(biāo)和符號(hào)應(yīng)該統(tǒng)一且易于理解，避免混淆和歧義。例如，使用相同的圖標(biāo)來(lái)表示相似的功能或操作，以便用戶(hù)能夠快速識(shí)別和理解。例如：手機(jī)主題界面的顯示，電話(huà)的圖標(biāo)會(huì)從生活中電話(huà)提取圖形標(biāo)識(shí)。

5. 保持一致的術(shù)語(yǔ)和語(yǔ)言

界面中使用的術(shù)語(yǔ)和語(yǔ)言應(yīng)該保持一致，避免混淆和困惑。

例如：在不同頁(yè)面和功能中使用相同的術(shù)語(yǔ)和表達(dá)方式，以便用戶(hù)能夠準(zhǔn)確地理解和識(shí)別。

6. 反饋一致性

界面中的反饋信息應(yīng)該保持一致，讓用戶(hù)能夠清晰地知道他們的操作已被識(shí)別和響應(yīng)。

例如：成功操作和錯(cuò)誤操作應(yīng)該有明確的視覺(jué)和語(yǔ)言反饋，以便用戶(hù)能夠及時(shí)調(diào)整和糾正。

一致性和標(biāo)準(zhǔn)化在生活中有哪些體現(xiàn)呢？

例如：我們經(jīng)常逛的超市或者菜市場(chǎng)都會(huì)遵循標(biāo)準(zhǔn)化，相同或相似的商品進(jìn)行歸類(lèi)，看起來(lái)很整齊方便用戶(hù)購(gòu)買(mǎi)，馬路上的紅綠燈，全國(guó)保持一致性降低用戶(hù)認(rèn)知負(fù)擔(dān)。

五、容錯(cuò)原則

1. 提供明確的反饋和指導(dǎo)

當(dāng)用戶(hù)出現(xiàn)錯(cuò)誤或者不確定性時(shí)，界面應(yīng)該提供明確的反饋和指導(dǎo)，讓用戶(hù)知道出了什么問(wèn)題以及如何解決。

例如：當(dāng)用戶(hù)輸入錯(cuò)誤的密碼時(shí)，界面應(yīng)該明確提示用戶(hù)密碼錯(cuò)誤，并且提供重新輸入或者找回密碼的選項(xiàng)。

2. 允許撤銷(xiāo)和返回

用戶(hù)應(yīng)該可以隨時(shí)撤銷(xiāo)之前的操作或者返回到之前的狀態(tài)，從而糾正錯(cuò)誤或者重新開(kāi)始。

例如：在編輯界面中提供撤銷(xiāo)按鈕或者返回按鈕，讓用戶(hù)可以隨時(shí)取消之前的操作并且返回到之前的狀態(tài)。

3. 避免嚴(yán)格的輸入要求

界面設(shè)計(jì)應(yīng)該盡量避免嚴(yán)格的輸入要求，允許用戶(hù)輸入格式的靈活性和容錯(cuò)性。

例如：在表單輸入時(shí)，可以采用自動(dòng)補(bǔ)全、格式化等技術(shù)來(lái)輔助用戶(hù)輸入，減少用戶(hù)的輸入錯(cuò)誤。

4. 提供輔助和提示

當(dāng)用戶(hù)出現(xiàn)錯(cuò)誤或者不確定性時(shí)，界面應(yīng)該提供輔助和提示，幫助用戶(hù)找到正確的解決方案。例如：在輸入框中提供提示性的文字或者示例，指導(dǎo)用戶(hù)如何正確地輸入信息。

5. 減少不必要的強(qiáng)制性操作

界面設(shè)計(jì)應(yīng)該盡量減少不必要的強(qiáng)制性操作，避免因?yàn)橛脩?hù)的操作失誤而造成不可逆的影響。例如：在我們進(jìn)行轉(zhuǎn)賬操作時(shí)要求用戶(hù)對(duì)轉(zhuǎn)賬金額進(jìn)行確認(rèn)，以避免誤操作造成的損失。

6. 優(yōu)雅地處理異常情況

當(dāng)用戶(hù)遇到異常情況時(shí)，界面應(yīng)該能夠優(yōu)雅地處理并給予用戶(hù)友好的提示和解決方案。

例如：當(dāng)網(wǎng)絡(luò)連接出現(xiàn)問(wèn)題時(shí)，界面應(yīng)該顯示友好的錯(cuò)誤信息，并且提供重試或者刷新的選項(xiàng)。

容錯(cuò)原則在生活中有哪些體現(xiàn)呢？

例如：想要出去旅游到窗口購(gòu)票，發(fā)現(xiàn)買(mǎi)錯(cuò)了可以去窗口找工作人員改簽，或退票重新購(gòu)買(mǎi)，這時(shí)工作人員會(huì)二次確認(rèn)是否改簽，用戶(hù)回答確定，改簽成功。因?yàn)樘鞖庠蛟斐傻牧熊?chē)無(wú)法發(fā)車(chē)，會(huì)提示用戶(hù)進(jìn)行退票或改簽操作。

六、易取原則

1. 簡(jiǎn)化操作流程

界面設(shè)計(jì)應(yīng)該盡量簡(jiǎn)化操作流程，減少不必要的步驟和冗余的操作，讓用戶(hù)能夠更快速地完成任務(wù)。

例如：在購(gòu)物網(wǎng)站中，簡(jiǎn)化下單流程，減少用戶(hù)填寫(xiě)信息的步驟。

2. 提供直接的路徑

界面應(yīng)該提供直接的路徑讓用戶(hù)達(dá)到目標(biāo)，不需要經(jīng)過(guò)多次點(diǎn)擊或者瀏覽。

例如：在網(wǎng)頁(yè)中提供明顯的導(dǎo)航鏈接，讓用戶(hù)可以直接跳轉(zhuǎn)到所需的頁(yè)面。

3. 減少用戶(hù)輸入

盡量減少用戶(hù)需要輸入的信息和數(shù)據(jù)，采用自動(dòng)填充或者預(yù)設(shè)數(shù)值的方式來(lái)簡(jiǎn)化用戶(hù)操作。

例如：在搜索框中提供模糊搜索提示的功能，減少用戶(hù)輸入的工作量。

4. 提供明確的標(biāo)識(shí)和提示

界面上的按鈕、鏈接和標(biāo)識(shí)應(yīng)該清晰明確，讓用戶(hù)一眼就能看出其功能和作用。同時(shí)，界面應(yīng)該提供明確的提示和指導(dǎo)，引導(dǎo)用戶(hù)完成操作。

例如：在網(wǎng)頁(yè)中使用明顯的按鈕和圖標(biāo)來(lái)表示可點(diǎn)擊的功能，同時(shí)提供鼠標(biāo)懸停提示來(lái)解釋按鈕的作用。

5. 響應(yīng)迅速

界面的響應(yīng)速度應(yīng)該盡量快速，減少用戶(hù)等待的時(shí)間。

例如；當(dāng)用戶(hù)點(diǎn)擊按鈕或者鏈接時(shí)，界面應(yīng)該立即給出反饋，讓用戶(hù)知道其操作已被識(shí)別。

6. 符合用戶(hù)期望

界面設(shè)計(jì)應(yīng)符合用戶(hù)的期望和習(xí)慣，讓用戶(hù)能夠直觀(guān)地理解界面上的布局和功能。

例如：將相關(guān)的功能組織在一起，符合用戶(hù)的認(rèn)知結(jié)構(gòu)。

易取原則在生活中有哪些體現(xiàn)呢？

例如：現(xiàn)在一些大型超市購(gòu)物時(shí)提供自動(dòng)掃碼結(jié)算的機(jī)器，減少用戶(hù)的等待時(shí)間，響應(yīng)速度快，還有快捷刷臉支付（手機(jī)沒(méi)有帶也可以支付喲）用戶(hù)可以很直觀(guān)的進(jìn)行支付。

七、靈活高效原則

1.支持多種操作方式

界面設(shè)計(jì)應(yīng)該支持多種操作方式，讓用戶(hù)可以根據(jù)自己的習(xí)慣和偏好選擇最適合自己的方式進(jìn)行操作。

例如：提供鍵盤(pán)快捷鍵、手勢(shì)操作、語(yǔ)音控制等多種方式。

2. 自適應(yīng)和響應(yīng)式設(shè)計(jì)

界面設(shè)計(jì)應(yīng)該具有自適應(yīng)和響應(yīng)式的特性，能夠適應(yīng)不同設(shè)備和屏幕尺寸的顯示，并且在不同分辨率下保持良好的布局和可用性。這樣用戶(hù)可以在任何設(shè)備上以相似的方式進(jìn)行操作。

例如：我們常見(jiàn)的PC端網(wǎng)站會(huì)根據(jù)屏幕尺寸的不同響應(yīng)式布局（Behance、花瓣等網(wǎng)站）。

3. 提供個(gè)性化的設(shè)置和選項(xiàng)

界面應(yīng)該提供個(gè)性化的設(shè)置和選項(xiàng)，讓用戶(hù)可以根據(jù)自己的需求和偏好進(jìn)行定制。

例如，允許用戶(hù)自定義界面的布局、顏色主題、字體大小等。

4. 支持快速導(dǎo)航和查找

界面設(shè)計(jì)應(yīng)該支持快速導(dǎo)航和查找功能，讓用戶(hù)能夠迅速找到所需的信息和功能。

例如：提供搜索框和過(guò)濾選項(xiàng)，讓用戶(hù)可以快速定位到目標(biāo)內(nèi)容。

5. 減少不必要的點(diǎn)擊和步驟

界面設(shè)計(jì)應(yīng)盡量減少不必要的點(diǎn)擊和步驟，簡(jiǎn)化操作流程，提高用戶(hù)的操作效率。

例如：采用一鍵下單的方式，減少用戶(hù)提交訂單的步驟。

6. 提供即時(shí)反饋和狀態(tài)更新

界面設(shè)計(jì)應(yīng)該提供即時(shí)的反饋和狀態(tài)更新，讓用戶(hù)清楚地知道他們的操作已被識(shí)別和響應(yīng)。這樣可以提高用戶(hù)的操作效率和滿(mǎn)意度。

例如：當(dāng)用戶(hù)提交表單或者完成購(gòu)買(mǎi)時(shí)，界面應(yīng)該立即顯示成功的反饋信息。

靈活高效原則在生活中有哪些體現(xiàn)呢？

例如：火鍋在選擇上提供了多種口味的美食，一口鍋全都煮了，用戶(hù)也可以根據(jù)自己口味不同進(jìn)行調(diào)料，做的比較哇塞的火鍋店，還會(huì)貼上不同口味的搭配引導(dǎo)，對(duì)于第一次或不經(jīng)常吃火鍋店用戶(hù)就很友好，食物放進(jìn)火鍋里會(huì)通過(guò)食材的顏色或軟硬程度辨別是否熟了，給到用戶(hù)反饋可以吃咯。

八、簡(jiǎn)潔性原則

1. 去除冗余信息

界面設(shè)計(jì)應(yīng)該去除不必要的冗余信息，只保留核心和重要的內(nèi)容，以減少用戶(hù)的干擾和混亂。例如：去除重復(fù)的導(dǎo)航鏈接、無(wú)關(guān)的廣告等。

2. 簡(jiǎn)化布局和排版

界面的布局和排版應(yīng)該簡(jiǎn)潔明了，避免過(guò)多的裝飾和復(fù)雜的結(jié)構(gòu)，以提高用戶(hù)的閱讀和理解效率。

例如：采用簡(jiǎn)單的網(wǎng)格布局，保持頁(yè)面的整潔和清晰。

3. 提煉核心功能

界面設(shè)計(jì)應(yīng)該將核心功能突出顯示，讓用戶(hù)一目了然地找到所需的功能和信息。不必要的功能應(yīng)該隱藏或者移除，以減少用戶(hù)的選擇困難和認(rèn)知負(fù)擔(dān)。

例如：商品頁(yè)面，商品名稱(chēng)、信息、價(jià)格、快捷加入購(gòu)物車(chē)、買(mǎi)幾份這種功能就放在了下一個(gè)頁(yè)面減少對(duì)用戶(hù)的干擾。

4. 簡(jiǎn)化操作流程

操作流程應(yīng)該簡(jiǎn)化至最少的步驟，避免不必要的點(diǎn)擊和跳轉(zhuǎn)，提高用戶(hù)的操作效率。

例如：采用一鍵式操作，減少用戶(hù)提交訂單的步驟。

5. 清晰明了的語(yǔ)言和標(biāo)識(shí)

界面中使用的語(yǔ)言和標(biāo)識(shí)應(yīng)該清晰明了，避免歧義和混淆。按鈕、鏈接等元素的標(biāo)識(shí)應(yīng)該直接表達(dá)其功能，讓用戶(hù)一目了然。

6. 精簡(jiǎn)視覺(jué)元素

視覺(jué)元素應(yīng)該精簡(jiǎn)，避免過(guò)多的裝飾和復(fù)雜的效果，以保持界面的干凈和清晰。顏色、字體、圖標(biāo)等元素的使用應(yīng)該簡(jiǎn)潔大方，突出重點(diǎn)。

7. 提供幫助和指導(dǎo)

界面設(shè)計(jì)應(yīng)該提供必要的幫助和指導(dǎo)，讓用戶(hù)能夠快速了解界面的使用方法和操作流程。但是這些幫助信息也應(yīng)該簡(jiǎn)潔明了，避免過(guò)多的文字和復(fù)雜的說(shuō)明。

簡(jiǎn)潔性原則在生活中有哪些體現(xiàn)呢？

例如：商場(chǎng)的逃生通道標(biāo)識(shí)，辦公室滅火器都會(huì)放在比較容易看到的地方，經(jīng)常坐地鐵的時(shí)候指引箭頭就很符合簡(jiǎn)潔性原則，不需要放過(guò)多的解釋說(shuō)明文案，大家都可以看懂具備什么含義。

九、幫助用戶(hù)識(shí)別和解決問(wèn)題原則

1. 提供清晰的幫助文檔和說(shuō)明

界面設(shè)計(jì)應(yīng)該提供清晰明了的幫助文檔和說(shuō)明，讓用戶(hù)能夠快速找到解決問(wèn)題的方法和答案。這些文檔和說(shuō)明應(yīng)該簡(jiǎn)潔明了，避免使用過(guò)多的專(zhuān)業(yè)術(shù)語(yǔ)和復(fù)雜的語(yǔ)言。

2. 實(shí)時(shí)反饋和指導(dǎo)

界面應(yīng)該提供實(shí)時(shí)的反饋和指導(dǎo)，讓用戶(hù)知道他們的操作是否成功，以及如何繼續(xù)下一步。例如，在表單輸入時(shí)實(shí)時(shí)檢查格式是否正確，并給予相應(yīng)的提示。

3. 提供可搜索的幫助資源

界面設(shè)計(jì)應(yīng)該提供可搜索的幫助資源，讓用戶(hù)能夠快速找到所需的信息和解決方案。這些幫助資源可以包括常見(jiàn)問(wèn)題解答、在線(xiàn)幫助文檔、視頻教程等。

4. 友好的錯(cuò)誤提示和解決方案

當(dāng)用戶(hù)遇到錯(cuò)誤或者問(wèn)題時(shí)，界面應(yīng)該給予友好的錯(cuò)誤提示和解決方案，讓用戶(hù)知道發(fā)生了什么問(wèn)題以及如何解決。錯(cuò)誤提示應(yīng)該具體明了，避免使用晦澀難懂的術(shù)語(yǔ)。

5. 提供在線(xiàn)支持和反饋渠道

界面設(shè)計(jì)應(yīng)該提供在線(xiàn)支持和反饋渠道，讓用戶(hù)能夠隨時(shí)聯(lián)系到客戶(hù)服務(wù)團(tuán)隊(duì)并獲得幫助。這些支持和反饋渠道可以包括在線(xiàn)聊天、電子郵件支持、社區(qū)論壇等。

6. 優(yōu)化用戶(hù)體驗(yàn)和流程設(shè)計(jì)

界面設(shè)計(jì)應(yīng)該優(yōu)化用戶(hù)體驗(yàn)和流程設(shè)計(jì)，減少用戶(hù)可能遇到的問(wèn)題和困難。例如，簡(jiǎn)化操作流程、提供明確的導(dǎo)航和引導(dǎo)、避免技術(shù)性障礙等。

7. 持續(xù)改進(jìn)和優(yōu)化

界面設(shè)計(jì)團(tuán)隊(duì)?wèi)?yīng)該持續(xù)改進(jìn)和優(yōu)化界面，根據(jù)用戶(hù)的反饋和需求不斷調(diào)整和改進(jìn)設(shè)計(jì)方案，以提高用戶(hù)的滿(mǎn)意度和體驗(yàn)質(zhì)量。

幫助用戶(hù)識(shí)別和解決問(wèn)題原則在生活中有哪些體現(xiàn)呢？

例如：我們?cè)谟∷?shū)籍時(shí)，印刷廠(chǎng)會(huì)給我們講解紙張的尺寸，材質(zhì)，類(lèi)型、價(jià)格等，幫助我們了解和選擇適合的印刷品。

十、人性化幫助原則

1. 溫馨的語(yǔ)言和表達(dá)

界面設(shè)計(jì)應(yīng)該使用溫馨、友好和人性化的語(yǔ)言和表達(dá)方式，讓用戶(hù)感到被關(guān)心和被尊重。

例如：在錯(cuò)誤提示和幫助文檔中使用親切的語(yǔ)氣和表達(dá)方式。

2. 關(guān)注用戶(hù)情感和需求

界面設(shè)計(jì)應(yīng)該關(guān)注用戶(hù)的情感和需求，根據(jù)用戶(hù)的心理和情感狀態(tài)來(lái)設(shè)計(jì)界面和提供幫助。

例如：在用戶(hù)遇到困難或者錯(cuò)誤時(shí)，表達(dá)理解和支持，提供鼓勵(lì)和安慰。

3. 個(gè)性化的幫助和支持

界面設(shè)計(jì)應(yīng)該提供個(gè)性化的幫助和支持，根據(jù)用戶(hù)的偏好和習(xí)慣來(lái)提供定制化的解決方案。

例如：根據(jù)用戶(hù)的歷史操作記錄和偏好，推薦相關(guān)的幫助文檔或者解決方案。

4. 及時(shí)的反饋和回應(yīng)

界面應(yīng)該及時(shí)地回應(yīng)用戶(hù)的需求和問(wèn)題，給予及時(shí)的反饋和解決方案。

例如：提供實(shí)時(shí)的在線(xiàn)支持和反饋渠道，讓用戶(hù)能夠隨時(shí)聯(lián)系到客戶(hù)服務(wù)團(tuán)隊(duì)。

5. 鼓勵(lì)和獎(jiǎng)勵(lì)用戶(hù)行為

界面設(shè)計(jì)應(yīng)該鼓勵(lì)和獎(jiǎng)勵(lì)用戶(hù)的積極行為，增強(qiáng)用戶(hù)的參與和忠誠(chéng)度。

例如：通過(guò)積分系統(tǒng)或者優(yōu)惠活動(dòng)來(lái)獎(jiǎng)勵(lì)用戶(hù)的購(gòu)買(mǎi)行為和參與度。

6. 提供愉快的體驗(yàn)

界面設(shè)計(jì)應(yīng)該提供愉快和愉悅的使用體驗(yàn)，讓用戶(hù)感到舒適和愉快。

例如：通過(guò)動(dòng)畫(huà)、音效等方式增強(qiáng)界面的趣味性和互動(dòng)性，讓用戶(hù)感到愉悅和享受。

7. 尊重用戶(hù)隱私和權(quán)利

界面設(shè)計(jì)應(yīng)該尊重用戶(hù)的隱私和權(quán)利，保護(hù)用戶(hù)的個(gè)人信息和數(shù)據(jù)安全。

例如：明確告知用戶(hù)數(shù)據(jù)的使用目的和范圍，遵守相關(guān)的隱私政策和法律法規(guī)。

人性化幫助原則在生活中有哪些體現(xiàn)呢？

例如：人行道上的盲道，看新聞時(shí)的手語(yǔ)講解介紹，都是比較人性化的一部分，還有賣(mài)的老年機(jī)等等。

總結(jié)一下

關(guān)于尼爾森十大設(shè)計(jì)原則包括可見(jiàn)性、反饋、控制性、一致性、容錯(cuò)、簡(jiǎn)潔性、靈活高效、幫助用戶(hù)識(shí)別和解決問(wèn)題、人性化幫助、用戶(hù)控制和自由。

以下為此原則優(yōu)點(diǎn)詳解：

1.提高用戶(hù)體驗(yàn)質(zhì)量： 這些原則旨在提高用戶(hù)對(duì)產(chǎn)品的整體感受和滿(mǎn)意度，使用戶(hù)更愿意使用并持續(xù)與產(chǎn)品互動(dòng)。

2.降低學(xué)習(xí)成本： 設(shè)計(jì)原則的一致性和可見(jiàn)性幫助用戶(hù)更快地熟悉界面，減少了學(xué)習(xí)新功能的時(shí)間和認(rèn)知負(fù)擔(dān)。

3.增強(qiáng)用戶(hù)參與度： 提供了用戶(hù)控制和自由的原則，使用戶(hù)感到更加投入和自主，從而增強(qiáng)了其對(duì)產(chǎn)品的參與度。

4.提升用戶(hù)效率： 設(shè)計(jì)原則的靈活高效性使用戶(hù)能夠更快速地完成任務(wù)，提高了用戶(hù)的工作效率和操作效率。

5.減少用戶(hù)錯(cuò)誤： 容錯(cuò)性原則和幫助用戶(hù)識(shí)別和解決問(wèn)題的原則有助于減少用戶(hù)的錯(cuò)誤操作，提高了用戶(hù)的成功率。

6.簡(jiǎn)化用戶(hù)交互： 一致性、簡(jiǎn)潔性和靈活高效性設(shè)計(jì)原則簡(jiǎn)化了用戶(hù)與產(chǎn)品之間的交互，使用戶(hù)界面更加直觀(guān)和易于理解。

7.增強(qiáng)產(chǎn)品的競(jìng)爭(zhēng)力： 設(shè)計(jì)原則的綜合應(yīng)用使得產(chǎn)品更具有吸引力和競(jìng)爭(zhēng)力，有助于產(chǎn)品在市場(chǎng)中脫穎而出。

8.提高用戶(hù)忠誠(chéng)度： 人性化幫助和用戶(hù)控制和自由原則增強(qiáng)了用戶(hù)對(duì)產(chǎn)品的信任和忠誠(chéng)度，使用戶(hù)更愿意選擇并長(zhǎng)期使用產(chǎn)品。

9.節(jié)約資源成本： 通過(guò)降低用戶(hù)錯(cuò)誤和提高用戶(hù)效率，可以減少用戶(hù)的時(shí)間和精力成本，從而節(jié)約了資源成本。

10.適應(yīng)不同用戶(hù)群體： 這些設(shè)計(jì)原則的靈活性和人性化幫助原則使得產(chǎn)品能夠適應(yīng)不同用戶(hù)群體的需求和偏好，從而擴(kuò)大了產(chǎn)品的受眾范圍。

參考文獻(xiàn)：

https://www.nngroup.com/articles/ten-usability-heuristics/

https://medium.com/@nirbenita/the-10-design-heuristics-for-developers-1e70a9dc58a7

https://medium.com/@marialauraramirez/a-summary-of-nielsens-ux-principles-f482f32678f9

https://alonzowebster.medium.com/principles-of-ux-design-f7d5b193e19e

https://medium.com/@fireartstudio/common-ui-design-principles-d9889377f90b

https://medium.com/visual-side/10-usability-heuristics-for-user-interface-design-551dac8744e

編輯導(dǎo)語(yǔ)：我們?cè)诠ぷ髦薪?jīng)常會(huì)用到一些數(shù)據(jù)，數(shù)據(jù)可視化可以幫助我們更好的理清數(shù)據(jù)，動(dòng)效的設(shè)計(jì)也更加能體現(xiàn)多維展現(xiàn)數(shù)據(jù)；本文作者分享了關(guān)于交互動(dòng)效的數(shù)據(jù)可視化，我們一起來(lái)看一下。

數(shù)據(jù)可視化把相對(duì)復(fù)雜、抽象的數(shù)據(jù)通過(guò)可視化的手段表達(dá)出其內(nèi)里的信息和規(guī)律，促進(jìn)數(shù)據(jù)信息的傳播和應(yīng)用，更加直觀(guān)地傳達(dá)圖表信息；通過(guò)可視化，我們的大腦能夠更好地抓取和理解有效信息，增加信息的印象。

然而，如果數(shù)據(jù)可視化設(shè)計(jì)做的不合理，反而會(huì)帶來(lái)負(fù)面影響，影響信息的傳播，誤導(dǎo)用戶(hù)的認(rèn)知；所以在設(shè)計(jì)的時(shí)候需要我們多維展現(xiàn)數(shù)據(jù)，不僅僅局限于單一層面，這時(shí)候動(dòng)效設(shè)計(jì)就是很重要的一環(huán)了。

我們希望的數(shù)據(jù)可視化設(shè)計(jì)是可以讓數(shù)據(jù)通過(guò)視覺(jué)形式，使信息更容易被接受，讓數(shù)據(jù)內(nèi)容更容易被理解，讓數(shù)據(jù)信息更容易被記憶。

一、為什么需要交互動(dòng)效設(shè)計(jì)

在一個(gè)數(shù)據(jù)項(xiàng)目中，有許多的數(shù)據(jù)通常都是實(shí)時(shí)變化的，為了減少數(shù)據(jù)變化刷新時(shí)的突然性以及需要告知用戶(hù)數(shù)據(jù)更新，那么動(dòng)效設(shè)計(jì)就是必不可少的。

此外，數(shù)據(jù)可視化大屏服務(wù)的主要是B端用戶(hù)，我們?cè)谠O(shè)計(jì)過(guò)程中要做到：讓設(shè)計(jì)服務(wù)于數(shù)據(jù)內(nèi)容，給用戶(hù)以最為清晰明確迅捷的數(shù)據(jù)展示。

針對(duì)數(shù)據(jù)可視化大屏的特點(diǎn)，來(lái)具體談?wù)勎覀優(yōu)槭裁葱枰鰟?dòng)效設(shè)計(jì)：

1. 信息體量大

與B端產(chǎn)品一樣，可視化大屏的信息體量相對(duì)龐大，且更注重用戶(hù)在單位面積內(nèi)獲取信息的效率，因此我們需要在有限的大屏內(nèi)盡可能展示多的有效信息。

但是，如果我們僅僅是一味地往數(shù)字大屏里“塞”信息，沒(méi)有對(duì)信息結(jié)構(gòu)、展現(xiàn)方式做一個(gè)很好的規(guī)劃，往往龐大的數(shù)據(jù)量會(huì)造成信息堆砌，給用戶(hù)接受并處理信息帶來(lái)一定的干擾。

這時(shí)候，動(dòng)效就可以很好的解決這個(gè)問(wèn)題；利用動(dòng)效，構(gòu)建出數(shù)據(jù)大屏的層次，將數(shù)據(jù)存放在不同的層級(jí)頁(yè)面內(nèi)，為用戶(hù)帶來(lái)更好的數(shù)據(jù)信息服務(wù)體驗(yàn)。

2. 專(zhuān)業(yè)操作性強(qiáng)

從目標(biāo)用戶(hù)來(lái)看，可視化大屏主要面向的是具有一定專(zhuān)業(yè)知識(shí)的用戶(hù)，因此產(chǎn)品需要做到專(zhuān)業(yè)性高、邏輯嚴(yán)謹(jǐn)、規(guī)范性強(qiáng)，用戶(hù)在使用時(shí)按照已有的一套規(guī)范流程進(jìn)行操作，大大提高工作效率。

但專(zhuān)業(yè)的操作流程，往往會(huì)帶來(lái)操作鏈路過(guò)長(zhǎng)的問(wèn)題；因此我們需要進(jìn)行動(dòng)效設(shè)計(jì)，一個(gè)好的動(dòng)效可以引導(dǎo)用戶(hù)更快、更簡(jiǎn)的熟悉流程、上手操作、完成任務(wù)。

3. 專(zhuān)業(yè)概念多而復(fù)雜

可視化大屏往往需要解決一些專(zhuān)業(yè)性的問(wèn)題，同時(shí)傳達(dá)出來(lái)的概念多而復(fù)雜，如果僅僅靠文字、數(shù)據(jù)來(lái)進(jìn)行展現(xiàn)，往往會(huì)增加用戶(hù)的認(rèn)知成本；同時(shí)，可視化大屏在幫助業(yè)務(wù)人員理解以及幫助領(lǐng)導(dǎo)做出決策中起到了很大的作用，我們?nèi)绾螌?fù)雜的專(zhuān)業(yè)概念快速傳達(dá)呢？

這時(shí)候“動(dòng)效”就產(chǎn)生了很大的作用——大數(shù)據(jù)時(shí)代，文字和數(shù)據(jù)實(shí)在會(huì)讓人感到疲憊，但將其轉(zhuǎn)化為圖片甚至是動(dòng)畫(huà)，通過(guò)概念物化可以幫助用戶(hù)更快的理解、更好的記憶。

二、做什么樣的交互動(dòng)效

根據(jù)可視化大屏的這三個(gè)特點(diǎn)，具體來(lái)說(shuō)說(shuō)我們可以制作怎樣的動(dòng)效讓可視化大屏動(dòng)起來(lái)：

（以下案例均來(lái)源于EasyV數(shù)據(jù)可視化）

1. 信息排布

信息排布可以解決好信息體量大的問(wèn)題，在有效的面積內(nèi)盡可能的展示更多的信息，這就需要設(shè)計(jì)師在信息展示上進(jìn)行布局優(yōu)化。

當(dāng)出現(xiàn)同一類(lèi)指標(biāo)需要應(yīng)用于不同的場(chǎng)景時(shí)，可以利用交互按鈕進(jìn)行指標(biāo)主體切換，將不同的場(chǎng)景數(shù)據(jù)存放在同一位置中。

比如，同屬于票務(wù)銷(xiāo)售指標(biāo)的公園門(mén)票與觀(guān)光車(chē)票，可以通過(guò)交互按鈕進(jìn)行主體切換，將不同數(shù)據(jù)的兩張圖表存放在同一區(qū)域塊內(nèi)；既解決了空間存放問(wèn)題，又讓用戶(hù)更好的理解數(shù)據(jù)主體，提升了用戶(hù)的交互體驗(yàn)。

當(dāng)需要了解更詳細(xì)的文字、數(shù)據(jù)信息時(shí)，可以通過(guò)交互動(dòng)效進(jìn)行信息補(bǔ)充。

用戶(hù)在使用時(shí)可以通過(guò)總體信息概覽關(guān)注到整體數(shù)據(jù)的變化，并不需要時(shí)時(shí)刻刻知道每個(gè)區(qū)域具體的數(shù)據(jù)信息，但有時(shí)候需要關(guān)注到具體的業(yè)務(wù)時(shí)往往會(huì)需要知道更詳細(xì)的數(shù)據(jù)；比如，用戶(hù)在點(diǎn)擊新疆區(qū)域時(shí)可以從大屏中獲取到新疆區(qū)域的動(dòng)銷(xiāo)品種、新書(shū)品種、銷(xiāo)售碼洋的信息。

將全局信息與局部信息區(qū)分開(kāi)，通過(guò)動(dòng)效設(shè)計(jì)優(yōu)化信息的排布，可以幫助用戶(hù)獲得更好的交互體驗(yàn)。

在使用數(shù)據(jù)可視化大屏?xí)r，領(lǐng)導(dǎo)決策者會(huì)更關(guān)注全局?jǐn)?shù)據(jù)，具體業(yè)務(wù)負(fù)責(zé)人會(huì)更關(guān)注局部數(shù)據(jù)；比如，上圖模版中地球視角代表的就是全局?jǐn)?shù)據(jù)，指標(biāo)視角代表的就是局部數(shù)據(jù)，整個(gè)數(shù)據(jù)大屏中的數(shù)據(jù)被明確區(qū)分開(kāi)，便于決策者與業(yè)務(wù)人員更好的使用并理解數(shù)據(jù)。

2. 引導(dǎo)交互

動(dòng)效設(shè)計(jì)可以引導(dǎo)用戶(hù)進(jìn)行交互，讓用戶(hù)每進(jìn)行一次操作就知道接下來(lái)該做什么或立刻明晰自己的操作得到了什么。

利用動(dòng)效進(jìn)行交互引導(dǎo)，即使大屏操作鏈路過(guò)長(zhǎng)，也可以讓用戶(hù)快速上手操作，減少流程學(xué)習(xí)時(shí)間。

比如，用戶(hù)的鼠標(biāo)滑過(guò)，字段會(huì)高亮響應(yīng)或者圖表塊會(huì)突出顯示，提示用戶(hù)此處可點(diǎn)擊，從而吸引用戶(hù)點(diǎn)擊查看下一層級(jí)數(shù)據(jù)。

進(jìn)入下一場(chǎng)景后，又會(huì)有對(duì)應(yīng)的區(qū)域提示用戶(hù)返回全局或查看其他場(chǎng)景；當(dāng)做到層層有響應(yīng)，就能減少用戶(hù)在每一步操作上的困惑時(shí)間，幫助用戶(hù)快速上手操作流程，并且大大提升工作效率。

3. 概念物化

將抽象的概念利用動(dòng)效具象化，將會(huì)大大降低用戶(hù)的學(xué)習(xí)成本，利用動(dòng)效講好一個(gè)故事，無(wú)疑是為可視化大屏景上添花的。

比如，將整個(gè)流程通過(guò)動(dòng)效制作成模型展示出來(lái)，用戶(hù)便能直接清晰明了的找到某個(gè)環(huán)節(jié)的數(shù)據(jù)；如今的數(shù)據(jù)可視化不再是一味的圖表堆砌，更多的設(shè)計(jì)師開(kāi)始關(guān)注3D建模、動(dòng)效交互等等，將更逼真的場(chǎng)景搬上大屏，給用戶(hù)身臨其境的真實(shí)感。

在數(shù)據(jù)可視化大屏中，優(yōu)秀的動(dòng)效設(shè)計(jì)不僅僅是炫酷的場(chǎng)景、令人贊嘆的動(dòng)畫(huà)，更多的是要關(guān)注到用戶(hù)的體驗(yàn)感。

說(shuō)到底，制作動(dòng)效還是為了更好的服務(wù)使用者，提供更好的交互體驗(yàn)，有時(shí)候一個(gè)微小的動(dòng)效設(shè)計(jì)就能帶來(lái)用戶(hù)體驗(yàn)的大幅提升。

本文由 @可愛(ài)的數(shù)據(jù)控

 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載

原文鏈接：https://www.woshipm.com/pd/4217597.html

題圖來(lái)自u(píng)nsplash，基于 CC0 協(xié)議

蘭亭妙微（藍(lán)藍(lán)設(shè)計(jì)）bouu.cn 是一家專(zhuān)注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)、圖標(biāo)定制、用戶(hù)體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)、UI咨詢(xún)、高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì)，以及相關(guān)的軟件開(kāi)發(fā)服務(wù)，咨詢(xún)電話(huà)：01063334945。我們建立了一個(gè)微信群，每天分享國(guó)內(nèi)外優(yōu)秀的設(shè)計(jì)，有興趣請(qǐng)加入一起學(xué)習(xí)成長(zhǎng)，咨詢(xún)及進(jìn)群請(qǐng)加藍(lán)小助微信ben_lanlan。

關(guān)鍵詞：UI咨詢(xún)、UI設(shè)計(jì)服務(wù)公司、軟件界面設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、用戶(hù)體驗(yàn)公司、高端網(wǎng)站設(shè)計(jì)公司、銀行金融軟件UI界面設(shè)計(jì)、能源及監(jiān)控軟件UI界面設(shè)計(jì)、氣象行業(yè)UI界面設(shè)計(jì)、軌道交通界面設(shè)計(jì)、地理信息系統(tǒng)GIS UI界面設(shè)計(jì)、航天軍工軟件UI界面設(shè)計(jì)、醫(yī)療行業(yè)軟件UI界面設(shè)計(jì)、教育行業(yè)軟件UI界面設(shè)計(jì)、企業(yè)信息化UI界面設(shè)計(jì)、軟件qt開(kāi)發(fā)、軟件wpf開(kāi)發(fā)、軟件vue開(kāi)發(fā)