引言

最近有設(shè)計(jì)、產(chǎn)品相關(guān)小伙伴和我探討 B 端產(chǎn)品的易學(xué)性設(shè)計(jì)。

有些說(shuō)：把產(chǎn)品的幫助手冊(cè)寫(xiě)詳細(xì)就好了，就像百寶箱，用戶想找什么都可以找到。（一看，將近幾萬(wàn)字）

有些說(shuō)：只要他們不理解，我們就加上提示文字，讓他們自己看，萬(wàn)無(wú)一失。（一看，至少百來(lái)字的解釋?zhuān)?/p>

有些說(shuō)：直接放個(gè)客服電話，用戶不懂打電話問(wèn)就好，我們 24 小時(shí)在線呢。（不妙，客服基本忙暈）

有些說(shuō)：給購(gòu)買(mǎi)產(chǎn)品的用戶一場(chǎng)生動(dòng)的使用培訓(xùn)就好了，還能收個(gè)費(fèi)。（一聽(tīng)，好像挺貼心的嘛）

還有很多「妙招」，我就不一一分享了。果然，我們?cè)O(shè)計(jì)、產(chǎn)品的小伙伴還是腦洞很大的。但是，B 端的易學(xué)性設(shè)計(jì)真的是這么做的嗎？還有沒(méi)有其他方法呢？

什么是易學(xué)性

在《GB/T 29836-2013 系統(tǒng)與軟件易用性》中，將軟件易用性繼續(xù)細(xì)化為易理解性、易學(xué)性、易操作性以及吸引性四個(gè)子特性。易學(xué)性指的是產(chǎn)品是否易于學(xué)習(xí)和理解，特別是用戶首次完成界面操作的難度。

B 端產(chǎn)品并不是為初級(jí)用戶或者高級(jí)用戶中的某一類(lèi)用戶使用的，而是會(huì)涉及到初級(jí)、中級(jí)、高級(jí)等各層級(jí)的用戶，要讓他們都方便的使用，快速上手。因此，我們需要思考怎么設(shè)計(jì)才能盡可能讓接觸 B 端產(chǎn)品的用戶都覺(jué)得好用、簡(jiǎn)單，設(shè)置較低的準(zhǔn)入門(mén)檻，還是提供符合心智模型的習(xí)慣設(shè)計(jì)。接下來(lái)我們將進(jìn)行探討。

易學(xué)性在 B 端的重要性

對(duì)于需要 POC 或者 SaaS 化運(yùn)作的 B 端產(chǎn)品來(lái)說(shuō)，易學(xué)性非常重要。如果在 POC 階段，或者用戶試用階段，就讓用戶覺(jué)得學(xué)習(xí)門(mén)檻非常高，第一次操作就遇到路徑不清晰，不知從哪兒下手的情況，那么這些用戶基本上已經(jīng)流失了。

當(dāng)用戶反復(fù)使用產(chǎn)品的時(shí)候，沒(méi)有發(fā)現(xiàn)越用越順，反而用完就忘記，需要重新學(xué)習(xí)，那么用戶會(huì)轉(zhuǎn)頭去尋找更合適的解決方案。

近期低碼平臺(tái)很火，可以看到那些口碑還不錯(cuò)的低碼平臺(tái)，都是用戶上手非常容易的平臺(tái)，拖拖拽拽組件，綁定一下數(shù)據(jù)，一個(gè)簡(jiǎn)單的表單就出來(lái)了。而那些從技術(shù)視角出發(fā)，搭建邏輯采用了技術(shù)邏輯的代碼，對(duì)于大部分用戶來(lái)說(shuō)，門(mén)檻還是略高。

易學(xué)性可以激活用戶（試用到付費(fèi)）、可以加深用戶粘性（初次購(gòu)買(mǎi)到復(fù)購(gòu)）、推薦給有同樣需求的用戶（分享與推薦）。產(chǎn)品給用戶較高的易學(xué)性可以讓用戶感受到自信，會(huì)促使用戶更加愿意使用該產(chǎn)品。

一句話：易學(xué)性不足的 B 端產(chǎn)品，基本不會(huì)有人第二次訪問(wèn)了。

B 端用戶要的易學(xué)性是什么

對(duì)于 B 端用戶來(lái)說(shuō)，B 端產(chǎn)品易學(xué)性就是他們?nèi)菀讓W(xué)習(xí)、上手與使用。那如何達(dá)到用戶容易學(xué)習(xí)、上手與使用呢？我總結(jié)了以下幾點(diǎn)，我們一起來(lái)看看吧~

1. 信息容易理解

信息容易理解是指界面術(shù)語(yǔ)盡量保證可以被新手、高級(jí)者等不同層次的用戶均可理解，但有些場(chǎng)景下確實(shí)很難做到，例如金融行業(yè)有特定的相關(guān)術(shù)語(yǔ)，F(xiàn)ISP 投管產(chǎn)品、空頭保證金比例、回購(gòu)利率、實(shí)際利率，已經(jīng)沒(méi)有辦法再簡(jiǎn)化，簡(jiǎn)化后反而出問(wèn)題了。

這種情況下，我們需要對(duì)行業(yè)使用者有所了解。例如，明確初次接觸該產(chǎn)品的用戶一般都達(dá)到了什么水平，由于此類(lèi) B 端產(chǎn)品都是在特定領(lǐng)域使用的，使用者基本都已經(jīng)獲取了相關(guān)基礎(chǔ)知識(shí)，那么有些術(shù)語(yǔ)已無(wú)需解釋?zhuān)行┬g(shù)語(yǔ)初學(xué)者是沒(méi)有接觸過(guò)的，會(huì)通過(guò)使用該產(chǎn)品而獲得，這些術(shù)語(yǔ)就需要被顯性化解釋。

想要信息容易被理解，有如下方法（但不僅限于以下）：

表述簡(jiǎn)化

如下為某項(xiàng)目管理平臺(tái)，我們可以在某個(gè)任務(wù)下看到該任務(wù)被操作的日志，但原來(lái)的操作任務(wù)日志表述太繁瑣，不聚焦行為本身，不利于用戶閱讀與理解。因此我們優(yōu)化了表述，讓用戶更容易學(xué)習(xí)與理解。

文字提示

如下為某項(xiàng)目管理平臺(tái)，用戶經(jīng)常對(duì)“是否需要設(shè)計(jì)”的進(jìn)一步情況不明確，因此設(shè)計(jì)師進(jìn)行了文字提示設(shè)計(jì)，來(lái)協(xié)助用戶理解與引導(dǎo)用戶操作。

描述清晰

如下為某項(xiàng)目管理平臺(tái)，如果需求創(chuàng)建失敗，報(bào)錯(cuò)信息會(huì)對(duì)信息進(jìn)行明確清晰的描述，讓用戶可以迅速定位錯(cuò)誤原因。

2. 引導(dǎo)清晰合理

引導(dǎo)清晰合理是指在用戶初次使用產(chǎn)品或產(chǎn)品有新功能上線時(shí)，通過(guò)新手引導(dǎo)讓用戶快速了解和使用產(chǎn)品，幫助用戶簡(jiǎn)單容易的學(xué)習(xí)。B 端產(chǎn)品邏輯復(fù)雜、功能繁多，若是能提供清晰的引導(dǎo)，對(duì)于用戶來(lái)說(shuō)真的很貼心。并且引導(dǎo)方式多樣，可以是視頻、可以是文字、可以是語(yǔ)音。

想要引導(dǎo)清晰合理，有如下方法（但不僅限于以下）：

新手引導(dǎo)

如下為某項(xiàng)目管理平臺(tái)，核心的使用者是開(kāi)發(fā)工程師，因此我們加入了新手指引設(shè)計(jì)，幫助初次登錄使用效能的用戶快速知道來(lái)這個(gè)平臺(tái)要做哪些事情、步驟怎么樣的。采用漸進(jìn)步驟式呈現(xiàn)，防止用戶因信息負(fù)載而出現(xiàn)認(rèn)知超負(fù)荷。

視頻引導(dǎo)

如下為某項(xiàng)目管理平臺(tái)，在該產(chǎn)品中，由于加入了設(shè)計(jì)師這一新的角色，而設(shè)計(jì)師以前沒(méi)有使用該平臺(tái)經(jīng)驗(yàn)的，我們制作了視頻，清晰的告知設(shè)計(jì)師可以如何快速上手相關(guān)功能，降低他們的使用緊張感。當(dāng)人們要開(kāi)始使用一個(gè)從來(lái)不曾接觸過(guò)的產(chǎn)品時(shí)，總會(huì)沒(méi)那么自信，害怕自己不會(huì)。視頻引導(dǎo)可以有效減輕心理負(fù)擔(dān)。

導(dǎo)航清晰

如下為某項(xiàng)目管理平臺(tái)，我們對(duì)產(chǎn)品導(dǎo)航菜單以類(lèi)別方式進(jìn)行了梳理，例如項(xiàng)目管理菜單下匯集了項(xiàng)目管理有關(guān)的菜單（需求、任務(wù)、迭代等），保證開(kāi)發(fā)工程師直接可以找到，明確在該范圍操作就可以完成日常工作。

3. 排版整齊合理

排版整齊合理主要是指 B 端產(chǎn)品界面設(shè)計(jì)需要有層次、重點(diǎn)突出，這樣對(duì)于用戶來(lái)說(shuō)，能快速發(fā)現(xiàn)重點(diǎn)，引導(dǎo)用戶操作，保證用戶高效完成任務(wù)。假如所有信息都是平鋪的，對(duì)于用戶來(lái)說(shuō)會(huì)直接迷失在界面上，無(wú)從下手。

想要排版整齊合理，有如下方法（但不僅限于以下）：

重點(diǎn)突出

如下為某項(xiàng)目管理平臺(tái)，我們將創(chuàng)建需求時(shí)的必填信息做了重點(diǎn)突出（左側(cè)面板字段），包括必填項(xiàng)圖標(biāo)設(shè)計(jì)、字段放在主視覺(jué)區(qū)域、字段文字加粗加大。其余不重要的信息（右側(cè)面板字段），做了弱化處理。

信息有層次

在某項(xiàng)目管理平臺(tái)儀表盤(pán)頁(yè)面，我們會(huì)分析數(shù)據(jù)的對(duì)于用戶來(lái)說(shuō)的層次關(guān)系，對(duì)于重要的數(shù)據(jù)，我們會(huì)前置，放在左上角；低頻需求的信息，放在了非首屏，偏下方位置。

信息分類(lèi)

如下為某項(xiàng)目管理平臺(tái)，我們對(duì)需求的詳情信息進(jìn)行了分類(lèi)歸納設(shè)計(jì)（字段做了替代處理），降低用戶的理解與學(xué)習(xí)成本。

4. 反饋合理友好

反饋合理友好是指用戶在輸入過(guò)程中系統(tǒng)能及時(shí)校驗(yàn)并反饋提示。例如應(yīng)對(duì)系統(tǒng)及頁(yè)面元素增減、頁(yè)面間變化進(jìn)行提示；應(yīng)對(duì)用戶的任務(wù)進(jìn)度進(jìn)行提示；用戶操作錯(cuò)誤及時(shí)反饋與糾正。這可以減輕用戶的記憶負(fù)擔(dān)，更快上手 B 端產(chǎn)品，能做的系統(tǒng)都幫用戶想到了。

想要反饋合理友好，有如下方法（但不僅限于以下）：

原因反饋

如下為某項(xiàng)目管理平臺(tái)，用戶創(chuàng)建了一個(gè)需求后，若想建立相關(guān)任務(wù)，則需要對(duì)迭代字段進(jìn)行填充內(nèi)容。因此，我們對(duì)“創(chuàng)建任務(wù)”進(jìn)行了進(jìn)一步的設(shè)計(jì)，當(dāng)用戶點(diǎn)擊創(chuàng)建任務(wù)，則會(huì)提示其先建立迭代，并告知為什么。當(dāng)用戶知其然并知其所以然，會(huì)讓用戶的印象更深刻，學(xué)習(xí)成本降低。

進(jìn)度提示

如下為某項(xiàng)目管理平臺(tái)，只有創(chuàng)建了項(xiàng)目或者加入了項(xiàng)目才可以對(duì)內(nèi)部的功能進(jìn)行使用，無(wú)項(xiàng)目就無(wú)使用權(quán)。當(dāng)用戶申請(qǐng)加入項(xiàng)目時(shí)，會(huì)想要知道流程到了哪一步，因此我們?cè)O(shè)計(jì)了相應(yīng)的進(jìn)度反饋看板給到用戶。

5. 符合用戶心智

符合用戶心智是指我們?cè)谠O(shè)計(jì) B 端產(chǎn)品界面時(shí)，盡量保留用戶習(xí)慣，不要為了創(chuàng)新而導(dǎo)致用戶使用產(chǎn)品時(shí)一臉懵?tīng)顟B(tài)。之前團(tuán)隊(duì)有一些交互設(shè)計(jì)師，總喜歡使用一些交互效果復(fù)雜的設(shè)計(jì)，導(dǎo)致在原型評(píng)審階段就沒(méi)通過(guò)，客戶覺(jué)得過(guò)于花哨，不僅增加了學(xué)習(xí)成本，不容易學(xué)習(xí)，同時(shí)影響了用戶的任務(wù)效率。

想要符合用戶心智，有如下方法（但不僅限于以下）：

環(huán)境貼切

從現(xiàn)實(shí)生活中去尋找界面設(shè)計(jì)上對(duì)標(biāo)的具體物體，可以顯著降低用戶操作界面的認(rèn)知成本和學(xué)習(xí)困難。在繪制 icon 的時(shí)候，建議參考現(xiàn)實(shí)中的形態(tài)，從而使用戶能夠快速地理解。如下為某項(xiàng)目管理平臺(tái)，平臺(tái)需要使用圖標(biāo)的地方非常多，我們采用了環(huán)境貼切的設(shè)計(jì)模式來(lái)設(shè)計(jì)。

一致性

一致性是體驗(yàn)設(shè)計(jì)中最重要的原則之一，對(duì)于用戶而言，體驗(yàn)一致性的提高可以降低用戶的操作時(shí)長(zhǎng)及錯(cuò)誤率，降低學(xué)習(xí)成本，提升用戶的滿意度。如下為某項(xiàng)目管理平臺(tái)，我們?cè)诮Y(jié)構(gòu)、字體、色彩、操作等方面都考慮到了一致性。如下是輸出的色彩一致性案例。

依據(jù)日常

我們通常在畫(huà)時(shí)間軸的時(shí)候，會(huì)把歷史畫(huà)在左邊，未來(lái)畫(huà)在右邊。對(duì)于 B 端界面的「返回」操作來(lái)說(shuō)，當(dāng)下頁(yè)面是現(xiàn)在，要返回去的頁(yè)面是歷史，因此把返回按鈕置于頁(yè)面頂部的左側(cè)，并且箭頭朝左，符合用戶認(rèn)知。如下為某項(xiàng)目管理平臺(tái)，我們就采用了此種設(shè)計(jì)方式。

總結(jié)

易學(xué)性對(duì)于邏輯復(fù)雜、功能與流程巨多的 B 端產(chǎn)品來(lái)說(shuō)非常重要，沒(méi)有易學(xué)性，就沒(méi)有后續(xù)的一切了。就好比閱讀一本書(shū)，如果不能讓讀者初次閱讀的時(shí)候覺(jué)得淺顯易懂，讀者怎么會(huì)有繼續(xù)閱讀下去的欲望與動(dòng)力呢？

但項(xiàng)目時(shí)間總是緊張的，如果在研發(fā)時(shí)間有限的情況下，我們可以針對(duì)核心流程進(jìn)行易學(xué)性提升。針對(duì)用戶使用頻次高的模塊，進(jìn)行易學(xué)性規(guī)劃設(shè)計(jì)與評(píng)測(cè)。

歡迎關(guān)注作者微信公眾號(hào)：「知果日記」