編輯導(dǎo)語(yǔ)：本篇文章分享了在B端產(chǎn)品中降低「認(rèn)知負(fù)荷」的方法，從B端產(chǎn)品認(rèn)知負(fù)荷來(lái)源、降低認(rèn)知負(fù)荷的方法、化繁為簡(jiǎn)等方面展開，分享了6個(gè)降低用戶認(rèn)知負(fù)荷的方法，干貨滿滿，一起來(lái)看。

認(rèn)知負(fù)荷理論，假設(shè)人類的認(rèn)知結(jié)構(gòu)由工作記憶和長(zhǎng)時(shí)記憶組成。其中工作記憶也可稱為短時(shí)記憶，它的容量有限，一次只能存儲(chǔ)5—9條基本信息或信息塊。當(dāng)要求處理信息時(shí)，工作記憶一次只能處理兩到三條信息，因?yàn)榇鎯?chǔ)在其中的元素之間的交互也需要工作記憶空間，這就減少了能同時(shí)處理的信息數(shù)。

簡(jiǎn)單來(lái)說(shuō)，用戶大腦處理任務(wù)的能力是有限的。用戶在理解頁(yè)面信息時(shí)，需要識(shí)別、思考、記憶，這些都屬于認(rèn)知負(fù)荷。

我們?cè)谠O(shè)計(jì)中，需要努力減少用戶的“認(rèn)知負(fù)荷”，讓用戶可以更輕松地完成復(fù)雜工作。尤其是對(duì)于更加強(qiáng)調(diào)效率的B端產(chǎn)品，這就更加重要了。

本文就來(lái)總結(jié)6個(gè)降低用戶認(rèn)知負(fù)荷的方法：

1. 一致性
2. 符合用戶心智模型
3. 化繁為簡(jiǎn)
4. 讓界面更加有序
5. 刪除不必要的設(shè)計(jì)元素
6. 引入“減負(fù)”功能設(shè)計(jì)

一、B端產(chǎn)品認(rèn)知負(fù)荷來(lái)源

認(rèn)知負(fù)荷包含2個(gè)過(guò)程，信息識(shí)別和信息處理。信息識(shí)別就是用戶看到并選擇內(nèi)容的過(guò)程，設(shè)計(jì)師需要幫助用戶方便、快速找到想要的信息。信息處理則是對(duì)信息的思考和理解的過(guò)程，用戶明白信息是什么，知道該如何操作。

1. 信息量大，選擇多

B端的產(chǎn)品主要是Web瀏覽器形式。屏幕越大，單屏承載的信息量就越多，帶來(lái)的認(rèn)知負(fù)荷就越大。例如信息量較大的表單，信息繁雜的詳情頁(yè)，這些都是認(rèn)知負(fù)荷的重要來(lái)源，信息需要有效的精簡(jiǎn)、組織，減少用戶認(rèn)知負(fù)荷。

2. 業(yè)務(wù)復(fù)雜

B端產(chǎn)品復(fù)雜，即使是專家用戶，也會(huì)碰到各種問(wèn)題。特別是使用新產(chǎn)品時(shí)，會(huì)有一個(gè)識(shí)別和適應(yīng)的過(guò)程。而且B端產(chǎn)品業(yè)務(wù)通常不是獨(dú)立的，而是相互依賴的。用戶完成一個(gè)業(yè)務(wù)，可能需要在多個(gè)頁(yè)面間來(lái)回切換，造成更多的認(rèn)知負(fù)擔(dān)。

3. 界面混亂

頁(yè)面信息量大，如果缺乏必要的組織，內(nèi)容混亂，那對(duì)用戶可能就是“災(zāi)難”。例如關(guān)聯(lián)的信息被打散，用戶查找困難。元素層級(jí)不清晰，缺少主次關(guān)系等，都會(huì)增加用戶的認(rèn)知負(fù)荷。

二、降低認(rèn)知負(fù)荷的方法

1. 一致性

一致性是基礎(chǔ)性原則，也是非常重要的設(shè)計(jì)原則。產(chǎn)品設(shè)計(jì)時(shí)，不僅要考慮產(chǎn)品內(nèi)部的一致性，也要參考與同類產(chǎn)品，做出有效的設(shè)計(jì)方案。

內(nèi)部的一致性就不必多說(shuō)了。

現(xiàn)在很多的B端產(chǎn)品，前端開發(fā)設(shè)計(jì)都會(huì)借鑒AntDesign、Element 等設(shè)計(jì)組件。雖然在一定程度上，會(huì)抹殺設(shè)計(jì)的創(chuàng)造性，但是用戶的認(rèn)知是趨同的?？偟膩?lái)看，這些組件庫(kù)，其實(shí)已經(jīng)逐漸成為了設(shè)計(jì)行業(yè)的標(biāo)準(zhǔn)。對(duì)產(chǎn)品的開發(fā)效率、用戶的認(rèn)知體驗(yàn)都有很好幫助。

2. 符合用戶心智模型

用戶心智模型就是用戶對(duì)事物的已有認(rèn)知。設(shè)計(jì)模型越接近心智模型，用戶認(rèn)知負(fù)荷越低。

B端產(chǎn)品從系統(tǒng)框架到組件元素越來(lái)越“像”，都是為了保證界面設(shè)計(jì)符合已有的用戶心智模型，減少用戶重新學(xué)習(xí)、認(rèn)知的成本。

例如用戶看到輸入框，就知道可以填寫信息；看到帶了“▼”的輸入框，就知道可以下拉選擇。單純地追求個(gè)性化，反而容易打破用戶心智，帶給用戶新的認(rèn)知負(fù)荷。

三、化繁為簡(jiǎn)

1. 內(nèi)容優(yōu)化

我們?cè)谧鲈O(shè)計(jì)時(shí)，遇到大量信息的場(chǎng)景，可以跟產(chǎn)品經(jīng)理多溝通，深度參與到業(yè)務(wù)中，嘗試從業(yè)務(wù)層面做出信息精簡(jiǎn)，只保留對(duì)用戶有價(jià)值的信息，刪除不必要的信息。

2. 用戶自主定制

用戶對(duì)內(nèi)容具有最高的話語(yǔ)權(quán)，對(duì)于非業(yè)務(wù)性的功能，可以將控制權(quán)交給用戶，從而減少不需要的信息帶來(lái)的認(rèn)知負(fù)荷。

例如首頁(yè)中的監(jiān)控指標(biāo)、布局的定制化，表格信息列的自定義，可以更好地保證信息的有效性，而不是一堆沒有價(jià)值的數(shù)據(jù)。

3. 視覺隱藏

當(dāng)內(nèi)容無(wú)法精簡(jiǎn)時(shí)，可以根據(jù)內(nèi)容對(duì)用戶價(jià)值，以及用戶的操作頻率，確定核心內(nèi)容優(yōu)先展示。將部分內(nèi)容隱藏，從而減少用戶可見的信息量。

例如列表操作列超過(guò)3個(gè)時(shí)，一般會(huì)用“更多”將功能選項(xiàng)收起或者歸類處理。面向初學(xué)者的功能教學(xué)內(nèi)容可以收起隱藏。

4. 漸進(jìn)式處理

如果復(fù)雜內(nèi)容無(wú)法精簡(jiǎn)，還可以化整為零，將信息分步驟、分類展示給用戶。例如常見的步驟條、Tab頁(yè)面，都是優(yōu)化認(rèn)知負(fù)荷的方式。目的就是讓用戶不要一次處理大量的信息數(shù)據(jù)，從而降低用戶的認(rèn)知負(fù)荷。

四、讓界面更加有序

1. 布局的層次

我們都知道用戶在PC端的視覺動(dòng)線是有規(guī)律的，最常見包括 F 模式、Z 模式和分層蛋糕模式等。頁(yè)面中信息排列或者布局方式需要遵循這樣的規(guī)律，將重要、高頻內(nèi)容優(yōu)先突出展示，否則用戶就需要耗費(fèi)更多精力去頁(yè)面中查找目標(biāo)項(xiàng)。

2. 視覺的層次

B端產(chǎn)品界面設(shè)計(jì)不需要繁雜的視覺元素，視覺設(shè)計(jì)主要是為了輔助內(nèi)容傳遞。通過(guò)色彩對(duì)比，建立空間邊界和視覺層次。

例如卡片式設(shè)計(jì)，常用于包含大量信息的首頁(yè)中。讓用戶看到的不再是堆疊、難以區(qū)分層次的信息，更好地輔助信息有序傳達(dá)。按鈕的主次區(qū)分，讓用戶可以在多個(gè)相似信息中，快速識(shí)別關(guān)鍵關(guān)鍵信息。

五、刪除不必要的設(shè)計(jì)元素

設(shè)計(jì)師喜歡創(chuàng)新，但是在B端產(chǎn)品中，奉行“效率至上”，應(yīng)該盡可能地減少不必要的元素，減少頁(yè)面信息量。

例如，越來(lái)越多的導(dǎo)航和按鈕都采用純文本的形式，較少使用圖文結(jié)合的形式了。純圖標(biāo)，尤其是不常見的圖標(biāo)，用戶很理解其的含義，反而會(huì)造成認(rèn)知負(fù)擔(dān)。

六、引入“減負(fù)”功能設(shè)計(jì)

除了設(shè)計(jì)側(cè)的方法思考，設(shè)計(jì)師還可以從競(jìng)品和場(chǎng)景出發(fā)，為產(chǎn)品提供一些合理的功能建議。常見的認(rèn)知“減負(fù)”功能主要有以下3種：

1. 自動(dòng)化

借助技術(shù)能力實(shí)現(xiàn)業(yè)務(wù)的自動(dòng)化配置，減少用戶對(duì)信息的理解。例如現(xiàn)在的家用路由器都有自動(dòng)配置功能，普通用戶只需要將網(wǎng)線接好，系統(tǒng)會(huì)自動(dòng)完成網(wǎng)絡(luò)的初始化配置。

2. 模板化

我們?cè)谑褂肳PS處理各種文檔時(shí)，軟件提供了很多的設(shè)計(jì)模板，幫助用戶“一鍵美化”文檔。模板功能廣泛應(yīng)用于圖像處理、視頻剪輯中，讓用戶告別了專業(yè)又復(fù)雜的參數(shù)調(diào)整，大大降低了用戶的行為門檻。

3. 可視化

用戶對(duì)信息認(rèn)知是分層的。視頻、圖形化的表現(xiàn)方式，信息傳達(dá)效率更高，也更容易理解。為了降低用戶的認(rèn)知成本，除了給B端用戶展示各種詳情表格數(shù)據(jù)，還可以引入可視化的表現(xiàn)手法，讓信息能夠一目了然，減少用戶閱讀理解的認(rèn)知負(fù)荷。

以上就是我對(duì)“認(rèn)知負(fù)荷”的理解，希望對(duì)大家有所幫助~

#專欄作家#

子牧先生。公眾號(hào)：子牧UXD（HelloDesign），人人都是產(chǎn)品經(jīng)理專欄作家。產(chǎn)品體驗(yàn)設(shè)計(jì)師。8年互聯(lián)網(wǎng)行業(yè)經(jīng)驗(yàn)，擅長(zhǎng)體驗(yàn)設(shè)計(jì)思維、設(shè)計(jì)方法論、交互設(shè)計(jì)研究。

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

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