交互思考:怎么設(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ù)是找到廁所,進入包廂,進行“作業(yè)”。你會覺得前者是農(nóng)夫設(shè)計好的任務(wù)讓你來完成,而后者是自發(fā)的,是自己安排的任務(wù)?

 

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

 

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

 

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

 

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

 

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

 

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

 

 

 

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

 

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

 

 

 

 

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

 

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

 

1.選擇電影,怎么選擇

 

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

 

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

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

 

 

 

 

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

 

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

 

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

 

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

 

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

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

4.補充其他支線場景

 

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

藍藍設(shè)計(yvirxh.cn )是一家專注而深入的界面設(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ā)

日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://yvirxh.cn

存檔