交互思考:怎么設(shè)計任務(wù)流程

2024-6-21    資深UI設(shè)計者

交互思考:怎么設(shè)計任務(wù)流程

 
 
 

任務(wù),到底是怎么來的?是原本就存在的?還是人為設(shè)計而來的?


游戲中npc會交給你一個任務(wù),完成任務(wù)獲得獎勵。每一個任務(wù)都會有一個目標(biāo),比如你要幫助農(nóng)夫艾爾趕跑正在破壞農(nóng)田的地精,你的任務(wù)就是殺死100只地精,這是農(nóng)夫給你的任務(wù)。你現(xiàn)在有點內(nèi)急,你想去廁所解決這個燃眉之急,所以你的目標(biāo)是去解決內(nèi)急這個問題,任務(wù)是找到廁所,進(jìn)入包廂,進(jìn)行“作業(yè)”。你會覺得前者是農(nóng)夫設(shè)計好的任務(wù)讓你來完成,而后者是自發(fā)的,是自己安排的任務(wù)?

 

不對,其實后者也是經(jīng)營者安排好的任務(wù)。當(dāng)用戶有需要的時候才會進(jìn)入這個任務(wù)。

 

再舉個例子,在家里吃飯、喝水、洗衣服,其實每一個都是任務(wù),設(shè)計師會根據(jù)用戶需求去設(shè)計“任務(wù)”流程,比如你在衛(wèi)生間洗完澡,你的臟衣服放在哪里,如果你要洗衣服需要把衣服從衛(wèi)生間拿到哪里去洗,中間要經(jīng)過哪些空間,洗完的時候衣服晾曬在哪里,晾曬完后又要收入到哪里,比如我現(xiàn)在的工作間外就是一個陽臺,陽臺上放著洗衣機(jī),每當(dāng)我開始碼字的時候,就會有人用洗衣機(jī)洗衣服…...但是這個對于任務(wù)的執(zhí)行者而言是最好的方案,洗衣機(jī)沒有其他可放置的空間。

 

再說個例子,還是上廁所的,有點俗大家不要見怪。你們是否有想過,為什么廁所里的洗手池不放在小隔間里面?如果根據(jù)就近原則,上完廁所直接洗手不應(yīng)該更快嗎?顯然,場景不是這么單一的,大家來廁所不僅僅是為了上號,可能只是洗個手、抽個煙、補個妝,如果隔間里放洗手池,那對于這部分人而言只能等別人上完號才能洗手了?顯然是不行的,如果不考慮成本和空間的話,里外都放一個會更好嗎?顯然也不行,對于經(jīng)營者而言,還要考慮效率、利用率等

 

以上兩則是多人空間中的任務(wù)設(shè)計,任務(wù)是人為設(shè)計的,根據(jù)不同的目標(biāo),任務(wù)的效率、體驗都會有一定變化。

 

那么任務(wù)該怎么設(shè)計才能讓效率和體驗都更好呢?效率并不意味著步驟少,比如現(xiàn)在有一個把大象放進(jìn)冰箱的任務(wù),大家都知道只需要三步就可以把它放進(jìn)去,但是如果塞不進(jìn)怎么辦呢?那是不是要切塊或者切塊后放到兩個冰箱。

 

所以當(dāng)我們在設(shè)計任務(wù)的時候首先需要設(shè)定任務(wù)的關(guān)鍵節(jié)點,比如開門-塞象-關(guān)門,然后每個節(jié)點會出現(xiàn)更多的子節(jié)點,比如門鎖上了需要先解鎖,大象塞不進(jìn)要先切塊等等。

 

 

 

同理我們用一個買電影票的任務(wù)流程來解釋一下,用戶的目標(biāo)是想在線上預(yù)定電影票去線下看電影,所以他在線上需要購買一張票。那么為了讓用戶能夠成功買到票,我們針對這個目標(biāo)來設(shè)定幾個關(guān)鍵的節(jié)點:1.選擇電影 2.選擇日期 3.選擇影院 4.選擇時間 5.選擇座位6.確認(rèn)訂單 7.支付。

 

有同學(xué)一定想問,這些關(guān)鍵節(jié)點是怎么列出來的?為什么一定是這樣的順序呢?首先關(guān)鍵節(jié)點在一開始列的時候順序可以是打亂的,所以第一步需要大家頭腦風(fēng)暴,先列出關(guān)鍵節(jié)點,關(guān)鍵節(jié)點也可以理解為用戶的關(guān)鍵行為,行為的顆粒度可以大一點。

 

之后再根據(jù)用戶場景進(jìn)行排序。比如可能我們在列的時候會先列出選擇影院再列選擇時間,當(dāng)我們分析過用戶場景和真實需求后,選擇日期就會排在影院之前。也有同學(xué)會說,我一般是先選擇電影院再考慮看什么電影的,確實,但這種場景一定是少數(shù),比如你在外地出差,你突然想看電影,你會先找附近有什么電影院,但是用戶大多數(shù)情況都是先想好要看什么電影,再考慮什么時候看,去哪里看。

 

那又有同學(xué)要說了,選擇日期和選擇電影院很難說誰先誰后,那怎么判斷呢?我們可以給這些關(guān)鍵行為一個具像化呈現(xiàn):

 

 

 

 

這樣就能很清楚判斷誰先誰后了,選擇影院需要有一個影院列表,選擇日期需要有日期的控制器,可以用tab、雙聯(lián)picker、展開式布局,所以通過分析影院的類型,用戶需要進(jìn)行篩選和瀏覽,這樣屬性的內(nèi)容就要放在界面的下方,同時日期單獨處理成一個界面也顯得效率很低,所以日期在前影院在后是比較合理的,而日期選擇的方式也是考慮用戶看電影不像買飛機(jī)或酒店票需要非常大的時間跨度,所以一周內(nèi)的tab時間選擇就可以了。

 

到目前為止,我們只是對關(guān)鍵行為節(jié)點進(jìn)行了梳理,還沒有呈現(xiàn)到界面上去,所以根據(jù)這些關(guān)鍵行為我們再進(jìn)行頁面維度的填充。

 

1.選擇電影,怎么選擇

 

這里又要區(qū)分場景了

 

場景1:我知道自己要看哪本電影,也知道電影的基本內(nèi)容,只要讓我找到那本電影在哪里就可以了。

場景2:我不知道要看什么電影,最近電影荒。滿足場景1的需求我們需要一個所有電影的列表,滿足場景2的需求我們需要一個電影詳情介紹,并且電影詳情介紹也會部分存在于場景1中。

 

 

 

 

列表和詳情,顯然不能做在一個界面中,那么這里就可以拆成兩個界面了。

 

2.選擇日期和影院,剛才解釋過了,那么就放在一個界面中。

 

3.選擇時間,每個影院的排片時間不同,所以時間需要單獨選擇。也獨立成一個界面。

 

4.選擇座位,如果你要硬塞,其實是可以把選擇座位和時間放在一張界面中的,因為像現(xiàn)在很多線上購票軟件在選擇座位的時候也能夠選擇時間。在選擇時間的時候也能選擇日期和影片。

 

所以這里又要提到線性任務(wù),如果一個任務(wù)是線性的,并且任務(wù)節(jié)點中的用戶場景會出現(xiàn)重復(fù)的情況,那么需要讓用戶在當(dāng)前頁面就可以進(jìn)行直接操作,比如我在選擇完影院之后又想看其他電影了怎么辦,那我是不是要返回到最開始的列表,這顯然效率是很低的。那么正確的做法就是當(dāng)用戶確定好要在哪家影院看之后,讓用戶可以同步修改影片和日期。

 

 

 

 

然后在選擇座位的時候又可以同步修改時間,大家發(fā)現(xiàn)沒有,這兩個界面中,每個界面里的信息都會和之前界面中有重復(fù),顯然,也是和場景有關(guān)。

 

那為什么不干脆都做在一個界面中呢?我們來看下,web端是怎么做的:

 

 

 

 

web端的空間充裕,所以他將影片介紹、選擇影院、選擇日期、選擇時間都放在了一個界面中,選座也是另起一個界面。所以,只要空間夠大,其實這些內(nèi)容都可以放在一起,但是也要考慮單個界面的復(fù)雜度。

 

我們也來嘗試一下,能不能把信息都塞到一個界面中,我分別在移動端和web端給大家演示一下

 

 

 

顯然太復(fù)雜了,同時也會出現(xiàn)一個問題,那就是在一個界面中出現(xiàn)過個核心任務(wù)按鈕,像選座購票、確認(rèn)選座這樣的按鈕是不能出現(xiàn)在同一個界面中的

 

來總結(jié)一下,想要規(guī)劃好一個任務(wù)流程,需要做注意以下幾點:

 

1.根據(jù)任務(wù)目標(biāo)列出關(guān)鍵行為節(jié)點

2.根據(jù)用戶核心場景將行為節(jié)點進(jìn)行排序

3.根據(jù)核心場景將行為節(jié)點以頁面維度進(jìn)行合并

4.補充其他支線場景

 

作者:應(yīng)駿
鏈接:https://www.zcool.com.cn/article/ZMTQ5NjI2OA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請注明出處。
 

藍(lán)藍(lán)設(shè)計(m.sillybuy.com )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計圖標(biāo)定制、用戶體驗設(shè)計交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。

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

銀行金融軟件UI界面設(shè)計能源及監(jiān)控軟件UI界面設(shè)計、氣象行業(yè)UI界面設(shè)計軌道交通界面設(shè)計、地理信息系統(tǒng)GIS UI界面設(shè)計、航天軍工軟件UI界面設(shè)計醫(yī)療行業(yè)軟件UI界面設(shè)計、教育行業(yè)軟件UI界面設(shè)計企業(yè)信息化UI界面設(shè)計、軟件qt開發(fā)、軟件wpf開發(fā)軟件vue開發(fā)

日歷

鏈接

個人資料

存檔