UI/UX設(shè)計(jì)師如何處理任務(wù)及優(yōu)化流程

2022-7-6    seo達(dá)人


任務(wù)處理是體驗(yàn)設(shè)計(jì)師的一項(xiàng)基本功,任務(wù)處理的原則是提高任務(wù)完成的效率,同時(shí)滿足用戶體驗(yàn)的要求。任務(wù)通常指的是有目的性的工作與行為,例如領(lǐng)導(dǎo)給你一個(gè)買煙的任務(wù),媽媽給你一個(gè)去菜場買西紅柿的任務(wù),這些都是任務(wù),并且都有一個(gè)目的。

而行為則是在完成任務(wù)的過程中,我們需要做的事情,例如你要買煙,那么你首先要坐電梯下樓,步行到煙酒店,向老板詢問要購買的香煙,付款等一系列行為。為了完成任務(wù),用戶可能有不同的行為,你可以選擇坐電梯,但是當(dāng)電梯人很多的時(shí)候,走樓梯也許是更好的選擇,但目標(biāo)依然不變。

任務(wù)與行為都是可以被設(shè)計(jì)的,通過設(shè)計(jì)的手段我們可以提高任務(wù)的完成效率,提高用戶行為準(zhǔn)確性。如何對任務(wù)和行為進(jìn)行設(shè)計(jì)也就是今天我們要探討的內(nèi)容。

 

一、任務(wù)流程設(shè)計(jì)

在數(shù)字產(chǎn)品中,有非常多的任務(wù)等待用戶去完成,有的是用戶發(fā)起,有的是產(chǎn)品業(yè)務(wù)引導(dǎo)用戶去完成,例如修改個(gè)人頭像、添加收貨地址等等。任務(wù)聽起來比較抽象,很多設(shè)計(jì)師不知道怎么去安排任務(wù)和處理任務(wù)的節(jié)點(diǎn),那么我們來看一下如何完成這樣的任務(wù)流程的設(shè)計(jì)。

1、分析任務(wù)

假如我們現(xiàn)在需要進(jìn)行一個(gè)家電報(bào)修任務(wù)流程的設(shè)計(jì),那么我們要來分析一下這個(gè)任務(wù)中需要明確的2個(gè)要素:

a) 背景和目標(biāo)

用戶可以通過報(bào)修流程自主完成家電報(bào)修,預(yù)約維修員上門維修。

b) 目標(biāo)用戶是誰

購買過相關(guān)產(chǎn)品的用戶

2、如何劃分任務(wù)節(jié)點(diǎn)

a) 分析用戶行為與觸點(diǎn)

要對家電進(jìn)行報(bào)修,那首先要先確定報(bào)修的是什么家電,其次需要對家電類型進(jìn)行選擇、輸入,然后填寫相關(guān)的維修信息,例如發(fā)生了什么故障,維修地址在哪里,預(yù)約上門時(shí)間,填寫備注,相關(guān)服務(wù)的說明。最后提交訂單并查看服務(wù)受理的進(jìn)度。

那么到底這些任務(wù)需要?jiǎng)澐殖蓭讉€(gè)界面呢?每個(gè)界面放多少內(nèi)容,很多設(shè)計(jì)師在這一步就會(huì)比較糾結(jié),那么我們就可以把用戶行為和觸點(diǎn)來進(jìn)行一些假設(shè),先將這些行為做成卡片。初學(xué)者可以先用這個(gè)辦法來進(jìn)行梳理,掌握熟練之后自然而然的可以直接進(jìn)行快速的劃分界面。

圖片

然后我們將卡片填充到界面容器中,思考當(dāng)前容器中的信息內(nèi)容是否會(huì)溢出,行為與任務(wù)節(jié)點(diǎn)是否契合,并對用戶行為進(jìn)行分類,例如填寫選擇報(bào)修家電、填寫故障的原因、填寫維修地址、預(yù)約時(shí)間、填寫備注屬于強(qiáng)關(guān)聯(lián)的行為,而查看服務(wù)受理進(jìn)度則屬于下一個(gè)任務(wù)節(jié)點(diǎn)的用戶行為,并不能直接在一個(gè)界面中填充。于是從這一步來看,任務(wù)流程節(jié)點(diǎn)可以劃分出2個(gè):1.填寫報(bào)修信息 2.查看報(bào)修進(jìn)度

圖片

然后我們繼續(xù)思考, 填寫報(bào)修信息界面的用戶場景是否較為復(fù)雜,是否需要拆分,交互設(shè)計(jì)的原則并不是路徑越短效率越高的,如果單個(gè)任務(wù)節(jié)點(diǎn)需要用戶操作的內(nèi)容過于復(fù)雜,也會(huì)降低效率與體驗(yàn)。所以在填寫報(bào)修信息這個(gè)節(jié)點(diǎn)中,我們可以發(fā)現(xiàn)用戶在選擇報(bào)修電器的時(shí)候可能會(huì)有比較復(fù)雜的場景:

① 系統(tǒng)自動(dòng)調(diào)出訂單里的家電型號(hào)供用戶選擇

② 自己添加家電,但用戶可能不知道自己的要報(bào)修的家電是什么型號(hào)

有小伙伴想問,既然能夠自動(dòng)調(diào)出為什么還要手動(dòng)添加呢?因?yàn)檫@里還存在一個(gè)場景那就是你家的電器是別人給你買的,比如我給我媽家買了一個(gè)凈水器,凈水器壞了我媽想自己通過小程序報(bào)修,這個(gè)時(shí)候系統(tǒng)是無法讀取到這臺(tái)凈水器的訂單記錄的。

然后選擇家電時(shí),可能會(huì)涉及到多個(gè)家電的選擇,比如你買了某個(gè)品牌的多個(gè)產(chǎn)品,那需要從多個(gè)產(chǎn)品中選擇需要報(bào)修的那個(gè)。綜上所述,可能將選擇報(bào)修電器這步行為單獨(dú)做一個(gè)任務(wù)節(jié)點(diǎn)會(huì)更好,雖然節(jié)點(diǎn)多了一個(gè),但是場景更聚焦,任務(wù)看起來也不會(huì)那么復(fù)雜。

圖片

在填寫報(bào)修信息的時(shí)候依然也可以修改需要報(bào)修的家電,而不需要再返回上一個(gè)節(jié)點(diǎn)。

b) 窮舉場景,劃分核心與支線

當(dāng)我們劃分好任務(wù)節(jié)點(diǎn)后,剩下的場景窮舉也就比較簡單了。核心的任務(wù)和用戶行為我們已經(jīng)梳理完畢,剩余的支線場景我們再去補(bǔ)全即可。例如提交訂單后無人聯(lián)系,那么可以提供一個(gè)催單的功能,如果服務(wù)不滿意可以進(jìn)行投訴,對服務(wù)過程中的收費(fèi)項(xiàng)目進(jìn)行一個(gè)說明等等。

c) 用戶行為與布局

這也是我們繪制原型和線框需要考慮的,我們需要用什么控件來引導(dǎo)和組織用戶的行為,幫助用戶完成這次的任務(wù)。那么我們一步步來看。

第一個(gè)任務(wù)節(jié)點(diǎn)是選擇電器+手動(dòng)添加,所以我們需要一個(gè)能夠進(jìn)行單選(訂單列表)的box以及一個(gè)手動(dòng)添加的按鈕。同時(shí)需要將手動(dòng)添加后的界面也思考一下,如何讓用戶快速的進(jìn)行電器的篩選和添加。這里可以用一個(gè)縱向?qū)Ш剑愃粕唐返姆诸?,同時(shí)加上搜索。

圖片

這里就要注意了,先給用戶添加按鈕還是先讓用戶去選擇。大部分的場景還是用戶自己進(jìn)行自購的,所以一般訂單都可以直接根據(jù)下單的手機(jī)號(hào)直接讀取到,只要登錄應(yīng)用之后。但不要忘了,如果當(dāng)前購買的產(chǎn)品太多,那么添加按鈕會(huì)被頂?shù)较路剑脩艨赡軙?huì)看不到。所以固定在頂部是更好的選擇,這里不需要糾結(jié)誰的使用場景更多誰放前面的問題。

第二個(gè)任務(wù)節(jié)點(diǎn)在輸入報(bào)修信息的時(shí)候可以自動(dòng)帶入一部分信息,例如下單地址、產(chǎn)品型號(hào)等,同時(shí)也要支持地址和型號(hào)的修改。我們來看一下布局是怎么做的。

 

圖片

在第三個(gè)任務(wù)節(jié)點(diǎn)查看報(bào)修進(jìn)度的時(shí)候,比較關(guān)鍵的信息是報(bào)修的地址、報(bào)修電器以及單號(hào),其次是報(bào)修的進(jìn)度,當(dāng)報(bào)修進(jìn)度到達(dá)排工時(shí),可以給用戶工作人員相關(guān)的信息。在提交報(bào)修單后,也需要提供用戶進(jìn)行客服咨詢的功能服務(wù)。最后是對本次服務(wù)其他支線需求,例如催單、投訴 等。

 

二、如何解決任務(wù)流程中的效率問題

1、任務(wù)設(shè)定不清晰,復(fù)雜且無序

我們先來看下方的界面案例

我們在設(shè)置任務(wù)流程時(shí),首先要明確什么是核心任務(wù),什么是次要/支線任務(wù)。在這個(gè)界面中除了底部的核心按鈕“生成”以外,還有其他的任務(wù),例如領(lǐng)取、修改、附加險(xiǎn)、添加主案、收藏方案、收件人信息填寫等。這里就會(huì)讓用戶開始迷茫了,如果我要最終完成“生成保險(xiǎn)計(jì)劃”,我該需要怎么操作?其他的按鈕我該如何去點(diǎn)擊,有什么順序,有什么是必填或非必填的嗎?

圖片

顯然,在一個(gè)需要有嚴(yán)謹(jǐn)邏輯步驟的任務(wù)流中,不適合將所有的任務(wù)按鈕都布局在一個(gè)界面中。這和一些電商的詳情是有區(qū)別,有人會(huì)說那類似電商的詳情不是也有很多這樣的按鈕嘛,除了加入購物車和購買以外,還有領(lǐng)券、查看評(píng)價(jià)、去店鋪主頁逛等按鈕,為什么它可以這樣,而這個(gè)界面中就不行呢?

① 這個(gè)界面的任務(wù)都需要用戶進(jìn)行填寫、設(shè)置,需要花費(fèi)較大的認(rèn)知成本。

② 電商詳情的按鈕不是根據(jù)順序和流程設(shè)置的,而是根據(jù)用戶的場景和需求,按鈕放那邊你可以完全不看也不影響你最終的下單。但是這個(gè)界面中明顯不行,用戶在識(shí)別這個(gè)界面中的按鈕和信息的同時(shí)會(huì)思考,我如果要完成最終的“計(jì)劃生成”,這些按鈕我是不是都需要進(jìn)行點(diǎn)擊,或者是否要按照順序點(diǎn)擊。

所以類似這樣的界面我們需要進(jìn)行線性化,讓用戶知道哪些任務(wù)需要先完成,把任務(wù)節(jié)點(diǎn)劃分清晰,這樣用戶的效率也會(huì)提高。

2、線性任務(wù)的容錯(cuò)率

那講到線性任務(wù)不得不提到它的容錯(cuò)率。線性任務(wù)經(jīng)常遇到的幾個(gè)問題就是

① 讓用戶經(jīng)常返回操作修改,降低效率

② 步驟太多用戶失去耐心

③ 任務(wù)結(jié)束進(jìn)入死胡同沒有閉環(huán)。

第一種,用戶可能頻繁需要返回,例如在多層級(jí)分類篩選的流程中或者超長步驟的表單填寫。這種情況下用戶如果對之前的信息要修改,那么就會(huì)出現(xiàn)問題。

圖片

我們通過合并觸點(diǎn)或行為的形式,將可以在一個(gè)界面中完成的任務(wù)進(jìn)行組合或提供一個(gè)公共頁。

但是不管使用哪種方式,依然要分清楚當(dāng)前任務(wù)節(jié)點(diǎn)的獨(dú)立性,如果有行為、場景沖突的情況下是不能合并的,例如需要校驗(yàn)或者必須填寫某些信息后才可進(jìn)行下一步任務(wù)的情況下是不可以合并的,也不能使用公共頁來解決問題。

還有一種類似公共頁的形式,像閑魚的二手電子產(chǎn)品回收,需要填寫相關(guān)產(chǎn)品信息。這里其實(shí)也可以看作是一個(gè)公共頁,只是相比傳統(tǒng)的公共頁形式這里需要填寫單個(gè)選項(xiàng)少,并且可以直接在公共頁中選擇,這種形式雖然很像,但是和傳統(tǒng)不同的是,他在最初階段無法看到一共需要填寫哪些信息,只有選擇完一項(xiàng)才會(huì)出現(xiàn)下一項(xiàng)。這里我們也可以猜想一下,為什么一開始不直接把所有選項(xiàng)放出來讓用戶去修改呢?因?yàn)檫@里的選項(xiàng)也并非是有前后邏輯關(guān)系的。

圖片

兩個(gè)原因:

① 由易入難用戶更容易接受,初始階段給予大量選項(xiàng)用戶很容易放棄。

② 節(jié)省了n步選擇的操作。前者選擇完一項(xiàng)自動(dòng)會(huì)展開第二項(xiàng),后者則需要點(diǎn)擊-選擇-點(diǎn)擊,每一個(gè)步驟多了一次點(diǎn)擊。

所以完全線性的任務(wù)流程條件是比較苛刻的,也并不是所有線性流程都不好,要學(xué)會(huì)甄別。

3、任務(wù)的閉環(huán)

第二個(gè)情況先不去解釋,咱們直接看第三個(gè)問題,也是一般交互設(shè)計(jì)容易犯的一個(gè)問題。那就是閉環(huán)。為什么要閉環(huán),比如你想跟你的女神表白,當(dāng)你請女神吃了飯看了電影之后,卻忘了說我中意你,這是多么的可惜。這是一種情況,還有一種情況就是你表白了,她同意了,你的目標(biāo)達(dá)成了,但是最后讓你的女神自己打車回家,讓人有點(diǎn)失望。

所以表白要徹底,好人也要做到底。閉環(huán)最關(guān)鍵的找到最初的設(shè)計(jì)目標(biāo)。例如上一篇文章我們提到的新人限時(shí)免費(fèi)讀書的需求,在最后時(shí)間截止或者用戶領(lǐng)完5本書后,需要再給用戶進(jìn)行vip購買和權(quán)益提示,不能直接消失。

還有如果咱們有活動(dòng)進(jìn)行優(yōu)惠券發(fā)放的場景,也要注意引導(dǎo)用戶使用優(yōu)惠券或者在可以使用的場景繼續(xù)逛,而不是讓用戶領(lǐng)取完優(yōu)惠券后直接結(jié)束任務(wù)。

在上文中,我們提到的報(bào)修流程,當(dāng)提交完信息后會(huì)需要一個(gè)狀態(tài)頁,例如預(yù)約成功,然后讓用戶查看預(yù)約的階段,很多設(shè)計(jì)師在這步可能會(huì)分開設(shè)計(jì),先給一個(gè)狀態(tài)頁,再在這個(gè)狀態(tài)也讓用戶點(diǎn)擊查看進(jìn)度。其實(shí)沒必要直接做在一個(gè)界面中即可。

閉環(huán)還要注意消除用戶的不安全感,例如像餓了么下單后的狀態(tài)一樣,直接去掉返回鍵,告訴用戶你完成了,也沒有返回的必要了,你這時(shí)候可以去領(lǐng)取金豆兌換商品或者查看訂單狀態(tài)也可以完成訂單返回首頁。給用戶的行為安排的明明白白。

圖片

4、任務(wù)的逆向邏輯

正向邏輯大家都會(huì)做,但是往往會(huì)忽略一些逆向流程。例如搜索的逆向流程,如果我們進(jìn)行多次搜索后再進(jìn)行返回,是進(jìn)入到上一個(gè)關(guān)鍵詞的結(jié)果頁還是回到默認(rèn)狀態(tài)。應(yīng)該是要回到默認(rèn)狀態(tài)頁,也就是點(diǎn)擊搜索框后進(jìn)入的初始狀態(tài)。

另外,逆向流程要注意的是返回上一步后,當(dāng)前步驟是否需要提供保留提示,例如需要用戶大量編輯和填寫的表單,點(diǎn)擊返回后需要給出彈窗提示。

圖片

 

三、總結(jié)

任務(wù)流程設(shè)計(jì)并不難,關(guān)注好用戶的核心場景,主線流程一定要清晰,不要被支線流程干擾。在原型設(shè)計(jì)上也要注意信噪比,突出重要的信息與行為引導(dǎo)點(diǎn)。步驟多并不意味著效率低,步驟少也不代表效率高,在成熟期的產(chǎn)品中也要做好a/b測試來多多分析。設(shè)計(jì)如何落地,如何確定方案,很多時(shí)候不是理性的,也沒有任何標(biāo)準(zhǔn),每個(gè)人的意見都帶有一定的主觀性,設(shè)計(jì)師也在很容易在其中迷失,掌握好客觀的驗(yàn)證方法,可以提高工作的效率。

 

原文地址:應(yīng)謀鬼計(jì)(公眾號(hào))

作者: 應(yīng)駿

轉(zhuǎn)載請注明:學(xué)UI網(wǎng)》UI/UX設(shè)計(jì)師如何處理任務(wù)及優(yōu)化流程

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請掃碼藍(lán)小助,報(bào)下信息,藍(lán)小助會(huì)請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)、

UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



分享本文至:

日歷

鏈接

個(gè)人資料

存檔