大廠實(shí)戰(zhàn)！B端任務(wù)處理系統(tǒng)的體驗(yàn)優(yōu)化流程總結(jié)

B 端任務(wù)處理系統(tǒng)通常是以企業(yè)中的復(fù)雜業(yè)務(wù)流程為基礎(chǔ)衍生出來的，其主要目的是讓用戶能快速準(zhǔn)確的完成任務(wù)，促成業(yè)務(wù)的達(dá)成。隨著 B 端產(chǎn)品的用戶體驗(yàn)也越來越受到重視，實(shí)際工作中我們的交互體驗(yàn)優(yōu)化項(xiàng)目也越來越多，今天就來分享一些在工作中總結(jié)出的設(shè)計(jì)策略和設(shè)計(jì)案例。

更多B端干貨：

一、B 端任務(wù)處理系統(tǒng)的體驗(yàn)優(yōu)化流程

體驗(yàn)優(yōu)化我們可以從 4 個(gè)步驟展開：確定設(shè)計(jì)目標(biāo)、體驗(yàn)走查及用戶調(diào)研、設(shè)計(jì)策略及設(shè)計(jì)方案、設(shè)計(jì)結(jié)果驗(yàn)證。

1. 確定設(shè)計(jì)目標(biāo)

用戶使用任務(wù)處理系統(tǒng)的目的是快速準(zhǔn)確的完成特定的工作任務(wù)。因此，B 端任務(wù)處理系統(tǒng)體驗(yàn)提升的具體目標(biāo)一般但不限于以下 3 種：

1. 提升用戶的操作效率：通過各種設(shè)計(jì)手段和設(shè)計(jì)方案幫助用戶更加高效的完成任務(wù)；
2. 降低用戶操作失誤率/錯(cuò)誤率：在保證效率的同時(shí)也保證用戶任務(wù)的準(zhǔn)確性；
3. 提升產(chǎn)品的可持續(xù)性：隨著業(yè)務(wù)需求的不斷變化，系統(tǒng)往往會(huì)頻繁迭代，在設(shè)計(jì)時(shí)需要考慮產(chǎn)品的拓展性，避免交互形式、頁(yè)面樣式頻繁的改變，造成用戶學(xué)習(xí)成本的增加；

在不同的項(xiàng)目中設(shè)計(jì)目標(biāo)可能不同，設(shè)計(jì)師需要在項(xiàng)目的前期階段同產(chǎn)品、業(yè)務(wù)等多方人員達(dá)成共識(shí)，有助于設(shè)計(jì)項(xiàng)目始終朝著目標(biāo)的方向推進(jìn)。

2. 體驗(yàn)走查及用戶調(diào)研

體驗(yàn)走查可以讓設(shè)計(jì)師帶有同理心的試用現(xiàn)有系統(tǒng)，有助于了解產(chǎn)品的現(xiàn)有功能、了解頁(yè)面操作流程，對(duì)現(xiàn)有的交互方式建立基礎(chǔ)的感知和認(rèn)知，但缺點(diǎn)是設(shè)計(jì)師并不是實(shí)際的用戶，所以體驗(yàn)走查的結(jié)果可能帶有一定的主觀性。用戶調(diào)研則是客觀的了解用戶、了解用戶習(xí)慣、用戶對(duì)系統(tǒng)的認(rèn)知等，可以幫助設(shè)計(jì)師建立客觀的認(rèn)知。所以，我們需要將兩者結(jié)合起來得出更加科學(xué)、客觀的結(jié)論。我們?cè)诠ぷ髦凶畛Ｓ玫捏w驗(yàn)走查和用戶調(diào)研方法：

1. 任務(wù)模擬/體驗(yàn)走查：設(shè)計(jì)師模擬用戶的實(shí)際操作，評(píng)估系統(tǒng)的可用性、易用性和整體體驗(yàn)，洞察用戶的痛點(diǎn)，產(chǎn)出任務(wù)模擬體驗(yàn)結(jié)論及有針對(duì)性的設(shè)計(jì)建議。任務(wù)模擬體驗(yàn)結(jié)論可以圍繞功能層、交互層、信息層三個(gè)方面進(jìn)行總結(jié)，功能層可以探索對(duì)用戶有幫助但系統(tǒng)不具備的功能，交互層可針對(duì)操作流程、操作步驟、視線流變化等展開問題洞察，信息層可以關(guān)注用戶在使用時(shí)信息閱讀效率、關(guān)鍵信息獲取效率、信息層級(jí)、信息的可讀性等。

2. 用戶觀察及問卷調(diào)研：在實(shí)際場(chǎng)景中觀察用戶處理任務(wù)的流程，挖掘用戶的真實(shí)痛點(diǎn)及潛在痛點(diǎn)，產(chǎn)出調(diào)研報(bào)告。用戶觀察需要對(duì)用戶進(jìn)行篩選，減少用戶的個(gè)體差異產(chǎn)生的壁壘。問卷調(diào)研和用戶觀察是相輔相成、相互印證的：第一種方式是先開展問卷調(diào)研可以發(fā)現(xiàn)用戶問題，隨后再篩選出存在問題的用戶并展開觀察，以此對(duì)問題進(jìn)行溯源；第二種方式是先進(jìn)行用戶觀察發(fā)現(xiàn)了用戶痛點(diǎn)，隨后再進(jìn)行問卷調(diào)研可以在設(shè)置問卷問題時(shí)更有針對(duì)性，對(duì)痛點(diǎn)進(jìn)行普遍性的驗(yàn)證。

3. 用戶反饋收集：對(duì)于 B 端的用戶一般會(huì)通過用戶群聊、系統(tǒng)中的意見反饋功能等方式搭建用戶反饋渠道，我們?cè)谧鲇脩粽{(diào)研時(shí)也可以從中篩選有價(jià)值的用戶意見，必要時(shí)進(jìn)行線上線下回訪，以洞察用戶的痛點(diǎn)和需求。

3. 設(shè)計(jì)策略及設(shè)計(jì)方案

基于設(shè)計(jì)目標(biāo)、體驗(yàn)走查及用戶調(diào)研的結(jié)論我們可以制定出設(shè)計(jì)策略，并在策略的指導(dǎo)下產(chǎn)出設(shè)計(jì)方案。這一步驟就需要根據(jù)每個(gè)項(xiàng)目的特點(diǎn)進(jìn)行設(shè)計(jì)，需要以業(yè)務(wù)為基礎(chǔ)，以目標(biāo)為抓手，融入交互設(shè)計(jì)通用的原則和方法。針對(duì) B 端任務(wù)處理系統(tǒng)總結(jié)了以下五點(diǎn)設(shè)計(jì)策略，供大家在項(xiàng)目中參考：

1. 提供批量處理功能，提高用戶任務(wù)操作效率：B 端任務(wù)處理系統(tǒng)中效率是首要的設(shè)計(jì)原則，批量處理功能本身就是一種高效的操作方式，可以大大提高用戶的效率。在設(shè)計(jì)批量處理功能時(shí)設(shè)計(jì)師應(yīng)當(dāng)探索用戶批量操作的行為規(guī)律，并體現(xiàn)在設(shè)計(jì)上，這樣才能讓功能滿足用戶習(xí)慣和需求。

2. 運(yùn)用系統(tǒng)記憶能力，降低用戶重復(fù)操作成本：B 端系統(tǒng)的用戶往往跟角色、職能、崗位等綁定，同一角色的用戶常用的功能界面是基本相同的，每天處理的任務(wù)也極大可能是重復(fù)的。此時(shí)我們可以考慮運(yùn)用系統(tǒng)較為擅長(zhǎng)的記憶能力和學(xué)習(xí)能力，主動(dòng)的記憶用戶的操作習(xí)慣，當(dāng)用戶再次操作時(shí)，系統(tǒng)可以自動(dòng)幫助用戶完成一部分任務(wù)，進(jìn)而減少用戶的工作量。

3. 優(yōu)化信息展示設(shè)計(jì)，提升用戶信息獲取效率：B 端系統(tǒng)的用戶在進(jìn)行任務(wù)決策時(shí)往往會(huì)有重點(diǎn)關(guān)注的信息，因此我們可以在設(shè)計(jì)過程中對(duì)用戶感知的信息重要程度進(jìn)行排序，對(duì)重要程度較高的信息突出展示，提高用戶的信息閱讀和獲取效率。

4. 改善用戶行為動(dòng)線，打造用戶操作的沉浸感：行為動(dòng)線可以分為線上行為動(dòng)線和線下行為動(dòng)線。評(píng)估線上行為動(dòng)線是否合理可以通過行動(dòng)流復(fù)現(xiàn)的方式，即在原來的操作頁(yè)面中按順序標(biāo)注出用戶需要操作或?yàn)g覽的位置，看整個(gè)動(dòng)線是否是順暢的，用戶是否需要頻繁跳轉(zhuǎn)頁(yè)面，頁(yè)面中用戶視線是否頻繁跳躍等。線下行為動(dòng)線可以用戶繪制用戶旅程圖的方式，判斷用戶是否有冗余的操作步驟，是否可以通過線上化簡(jiǎn)化用戶操作等。行為動(dòng)線的流暢可以提升用戶操作的沉浸感，B 端系統(tǒng)中沉浸感也較為重要，其有助于用戶在處理任務(wù)時(shí)集中注意力在任務(wù)本身上，不會(huì)經(jīng)常被打斷。

5. 歸納頁(yè)面控件組件，保證系統(tǒng)交互的一致性：一致性是設(shè)計(jì)師不能夠忽略的內(nèi)容，同一個(gè)產(chǎn)品中類似的操作采用相同的交互形式，以減少用戶的學(xué)習(xí)成本，上線新功能的時(shí)候用戶也能快速的上手，提升用戶在使用產(chǎn)品過程中的操作流暢感。一致性可以從頁(yè)面的控件、頁(yè)面組件、頁(yè)面布局、頁(yè)面視覺元素等方面考量。

4. 設(shè)計(jì)結(jié)果驗(yàn)證

設(shè)計(jì)結(jié)果驗(yàn)證可以拆成兩個(gè)方面進(jìn)行：

1. 上線前通過可用性測(cè)試對(duì)設(shè)計(jì)方案進(jìn)行前期的驗(yàn)證，讓用戶實(shí)際操作動(dòng)態(tài)的 demo 原型與現(xiàn)有的界面進(jìn)行對(duì)比，用戶可以即時(shí)的反饋出對(duì)新方案的感知，有助于將方案調(diào)優(yōu)
2. 上線后通過頁(yè)面埋點(diǎn)數(shù)據(jù)的回收進(jìn)行設(shè)計(jì)結(jié)果的客觀性驗(yàn)證，具體分析用戶的哪些行為指標(biāo)需要以前期制定的設(shè)計(jì)目標(biāo)為依據(jù)，例如目標(biāo)是提升操作效率，后期就可以分析基礎(chǔ)的 pv、uv 以及用戶在單個(gè)流程中的操作時(shí)長(zhǎng)等來判斷設(shè)計(jì)方案是否對(duì)操作效率有提升，進(jìn)而客觀的驗(yàn)證設(shè)計(jì)價(jià)值，當(dāng)然最好是原有的頁(yè)面中也有相應(yīng)的埋點(diǎn)能支撐我們進(jìn)行對(duì)比分析。

二、B 端任務(wù)處理系統(tǒng)的體驗(yàn)優(yōu)化實(shí)踐

本文以物流行業(yè)的站長(zhǎng)工作臺(tái)任務(wù)中心交互體驗(yàn)優(yōu)化項(xiàng)目為例，論述上文中的理論是如何體現(xiàn)在實(shí)際項(xiàng)目中的。站長(zhǎng)工作臺(tái)的用戶是物流末端攬派站點(diǎn)的站長(zhǎng)，主要負(fù)責(zé)站點(diǎn)的運(yùn)營(yíng)、管理等工作，站長(zhǎng)工作臺(tái)任務(wù)中心是站長(zhǎng)每日待處理的任務(wù)模塊，集成了站長(zhǎng)當(dāng)日要處理完的全部任務(wù)，其中包括攬派任務(wù)下發(fā)、快遞員實(shí)操作業(yè)審核等等。

在項(xiàng)目初期就明確了本次的設(shè)計(jì)目標(biāo)是提升用戶的操作效率，后續(xù)我們基于這一目標(biāo)開展了體驗(yàn)走查和用戶調(diào)研的工作，體驗(yàn)走查和用戶調(diào)研的結(jié)論我們用以下模板進(jìn)行了總結(jié)，大家在實(shí)際工作中也可以參考。

接下來將重點(diǎn)描述 1.3 中提煉的 5 點(diǎn)設(shè)計(jì)策略在設(shè)計(jì)方案時(shí)是如何體現(xiàn)的。

1. 提供批量處理功能，提高用戶任務(wù)操作效率

站長(zhǎng)工作臺(tái)任務(wù)中心—攬派任務(wù)分配，是站長(zhǎng)將待攬收或待派送的快遞運(yùn)單分配給站內(nèi)的某個(gè)快遞員去執(zhí)行。顯而易見，如果讓站長(zhǎng)逐個(gè)運(yùn)單下發(fā)的話效率非常低，因此需要支持批量選擇運(yùn)單后分配。與此同時(shí)，洞察出用戶在批量操作時(shí)的行為規(guī)律：將相同路區(qū)或相同地址的運(yùn)單分給同一個(gè)快遞員。因此在設(shè)計(jì)時(shí)將相同路區(qū)/相同地址的運(yùn)單做聚合展示，去掉了用戶主動(dòng)篩選路區(qū)的動(dòng)作。

2. 運(yùn)用系統(tǒng)記憶能力，降低用戶重復(fù)操作成本

站長(zhǎng)由于其具備一定的角色權(quán)限限制，并有明確的職責(zé)劃分，因此每次進(jìn)入同一頁(yè)面，其篩選或填寫的內(nèi)容基本是一致的，原來的系統(tǒng)中用戶每次進(jìn)入頁(yè)面都需要手動(dòng)填寫/篩選相同的內(nèi)容。在體驗(yàn)優(yōu)化項(xiàng)目中我們運(yùn)用了系統(tǒng)的記憶能力，將用戶頻繁填寫/篩選的內(nèi)容在用戶進(jìn)入界面是就自動(dòng)填寫完成/直接給出查詢結(jié)果，這樣用戶可以無需操作便能瀏覽自己需要的信息。B 端系統(tǒng)的用戶往往都具備這一特征，因此可以在實(shí)際項(xiàng)目中巧妙運(yùn)用這項(xiàng)設(shè)計(jì)策略。

3. 優(yōu)化信息展示設(shè)計(jì)，提升用戶信息獲取效率

再次以 2.1 中的場(chǎng)景為例，站長(zhǎng)在攬派任務(wù)分配時(shí)進(jìn)行決策的主要依據(jù)是客戶的地址信息，地址又包含省市區(qū)縣街道等地址信息，由于站點(diǎn)的位置是固定的，所以用戶一般只看最末級(jí)的地址信息。這樣就可以將信息進(jìn)行拆解，重點(diǎn)展示用戶最關(guān)注的末級(jí)地址信息，提升用戶信息獲取效率。實(shí)際項(xiàng)目中可以對(duì)信息的重要程度進(jìn)行排序并給予合適的展示方式。

4. 改善用戶行為動(dòng)線，打造用戶操作的沉浸感

提升沉浸感可采用但不局限于以下幾個(gè)方法：

1. 優(yōu)化用戶動(dòng)線：讓用戶在盡可能少的頁(yè)面中完成任務(wù)，并且在同樣的任務(wù)中減少視線或操作的跨越
2. 用戶引導(dǎo)：有較為友好的任務(wù)引導(dǎo)從而減少用戶經(jīng)常被錯(cuò)誤提醒打斷
3. 信息降噪：用戶正在執(zhí)行某項(xiàng)任務(wù)的時(shí)候盡可能少的跳出其他的通知提醒，減少對(duì)用戶的干擾。
4. 任務(wù)的無縫銜接：當(dāng)用戶需要處理多個(gè)任務(wù)的時(shí)，支持用戶在處理完一項(xiàng)任務(wù)后能快速的跳轉(zhuǎn)到下一個(gè)任務(wù)的處理流程中。

案例一：行為動(dòng)線復(fù)現(xiàn)后發(fā)現(xiàn)痛點(diǎn)并進(jìn)行優(yōu)化。站長(zhǎng)的返調(diào)度任務(wù)頁(yè)面，設(shè)計(jì)師通過體驗(yàn)走查就發(fā)現(xiàn)用戶的行動(dòng)流在頁(yè)面中比較混亂，后續(xù)在設(shè)計(jì)中基于用戶的行動(dòng)線做了交互體驗(yàn)的優(yōu)化，保證用戶操作時(shí)不會(huì)頻繁的左右跳躍操作，同時(shí)將操作區(qū)域集中在一側(cè)。

案例二：審核快遞員上傳的運(yùn)單照片。設(shè)計(jì)師發(fā)現(xiàn)用戶現(xiàn)有看圖片的方式是點(diǎn)擊審核按鈕出現(xiàn)彈窗，彈窗中展示照片，再選擇審核通過還是駁回，如此循環(huán)。用戶沉浸感不強(qiáng)，打斷感會(huì)比較強(qiáng)，因此在設(shè)計(jì)方案的過程中通過頁(yè)面布局優(yōu)化了用戶整個(gè)的任務(wù)處理流程，用戶無需再頻繁的進(jìn)入彈窗、退出彈窗，在一個(gè)頁(yè)面中就能完成全部操作。除此之外，用戶處理完成一個(gè)運(yùn)單之后可以自動(dòng)跳轉(zhuǎn)到下一單讓用戶審核，用戶可以沉浸式的從第一個(gè)任務(wù)處理至最后一個(gè)任務(wù)。

5. 歸納頁(yè)面控件組件，保證系統(tǒng)交互的一致性

在站長(zhǎng)工作臺(tái)任務(wù)中心優(yōu)化項(xiàng)目中，對(duì)交互頁(yè)面的整體布局，控件的交互形式都做了統(tǒng)一，例如搜索框均為自動(dòng)實(shí)時(shí)搜索，不需要用戶額外的點(diǎn)擊；基于頁(yè)面的任務(wù)處理屬性將頁(yè)面布局規(guī)范為上中下和左右下兩種大的結(jié)構(gòu)，用戶的操作和視線均是從上至下、從左至右的依次操作。便于后續(xù)新增任務(wù)時(shí)頁(yè)面的框架是一致的。大家在項(xiàng)目中可以以實(shí)際情況為主，提煉不同頁(yè)面之間一致的控件、組件等并形成規(guī)范文檔，便于可持續(xù)性復(fù)用。

三、總結(jié)

B 端系統(tǒng)的用戶體驗(yàn)也是非常重要的，好的體驗(yàn)可以幫助企業(yè)中的用戶提高工作效率、減少工作中出現(xiàn)的失誤/錯(cuò)誤，進(jìn)而可以帶來更好的達(dá)成業(yè)務(wù)，助力企業(yè)的發(fā)展。本文系統(tǒng)的論述了 B 端任務(wù)處理系統(tǒng)的體驗(yàn)優(yōu)化流程：確定設(shè)計(jì)目標(biāo)——體驗(yàn)走查及用戶調(diào)研——設(shè)計(jì)策略及設(shè)計(jì)方案——設(shè)計(jì)結(jié)果驗(yàn)證，同時(shí)描述了在每一個(gè)步驟中設(shè)計(jì)師可以做的工作和一些實(shí)用性的方法。更重要的是，本文中總結(jié)了B端任務(wù)處理系統(tǒng)體驗(yàn)優(yōu)化的五點(diǎn)設(shè)計(jì)策略，并將每個(gè)策略體現(xiàn)在設(shè)計(jì)案例中供大家參考。

歡迎關(guān)注「JellyDesign」的小程序：