2022-06-21 分類: 網(wǎng)站建設(shè)
理清業(yè)務(wù)邏輯是交互設(shè)計(jì)的第一步,你必須得擁有非常清晰的邏輯思維,因?yàn)槟承┊a(chǎn)品往往伴隨著海量的功能、大量的模塊、錯(cuò)綜復(fù)雜的交互流程以及難以理解的業(yè)務(wù)技術(shù)背景,這些都是對(duì)設(shè)計(jì)師邏輯思維的一個(gè)挑戰(zhàn)。如果你沒(méi)有清晰的清晰的邏輯思維,那可能就不適合做交互設(shè)計(jì)了。
在講核心任務(wù)前,我想先用一張圖來(lái)闡述用戶需求的實(shí)現(xiàn)過(guò)程(如下圖)。
如上圖,任務(wù)是由設(shè)計(jì)師為了滿足用戶需求所設(shè)計(jì)出來(lái)的,用戶要想實(shí)現(xiàn)他的需求就得去完成產(chǎn)品為他所設(shè)計(jì)的任務(wù),這就好比在游戲中做任務(wù)一樣,你只有完成了游戲任務(wù)你才能得到游戲的獎(jiǎng)勵(lì)和升級(jí)。對(duì)于某項(xiàng)任務(wù)來(lái)講又需要具體的行為去完成它,這就形成了任務(wù)的操作流程。需求、任務(wù)、行為這三者之間就形成了行為驅(qū)動(dòng)任務(wù),多項(xiàng)任務(wù)去實(shí)現(xiàn)用戶需求的關(guān)系。
那么什么又是核心任務(wù)呢?于一個(gè)產(chǎn)品來(lái)說(shuō),大量最終用戶希望通過(guò)這個(gè)產(chǎn)品去完成的任務(wù)被稱為核心任務(wù);對(duì)于一個(gè)功能模塊來(lái)講,大量用戶會(huì)經(jīng)常使用某些功能去完成的任務(wù)稱為核心任務(wù)。
為什么需要確定核心任務(wù)?核心任務(wù)是大部分用戶大部分時(shí)間使用產(chǎn)品完成的任務(wù),這正是為用戶帶來(lái)驚喜,為他們創(chuàng)建良好體驗(yàn)的好機(jī)會(huì),用戶在使用產(chǎn)品的過(guò)程中對(duì)核心任務(wù)的期望會(huì)越來(lái)越高。通過(guò)了解用戶的核心任務(wù),你會(huì)更容易地去改進(jìn)產(chǎn)品,對(duì)所需資源按優(yōu)先度排序,把資源和時(shí)間投到核心任務(wù)上去,而不是花大量時(shí)間去改進(jìn)那些用戶不經(jīng)常使用的功能。前段時(shí)間寫過(guò)一篇文章《任務(wù)優(yōu)先級(jí)的重要性》,實(shí)例講解了核心任務(wù)的重要性。
如何確定核心任務(wù)?由于核心任務(wù)會(huì)隨著用戶需求的改變而改變,而用戶需求又會(huì)隨著目標(biāo)用戶的變化而變化,所以說(shuō)你首先得弄明白自己產(chǎn)品最終用戶群體的類型。在確定了目標(biāo)用戶群體后,接下來(lái)就是確定他們的需求(這一步梳理功能需求文檔的時(shí)候就完成了),確定用戶需求后你就很清楚這個(gè)功能模塊中用戶經(jīng)常使用的功能是什么,他們?cè)谑褂眠@些功能時(shí)的痛點(diǎn)是什么。如果你是在改進(jìn)一款現(xiàn)有的產(chǎn)品,不要坐著去YY用戶的需求,站起來(lái)找?guī)讉€(gè)實(shí)際使用的用戶做個(gè)簡(jiǎn)單的調(diào)研,這樣很快就可以確定用戶的實(shí)際需求所在。接下來(lái)就是根據(jù)需求去確定核心任務(wù),要永遠(yuǎn)記住任務(wù)是為了完成用戶的需求,它看起來(lái)很像在描述一個(gè)產(chǎn)品的功能。舉一個(gè)簡(jiǎn)單的例子,用戶的需求是希望能和好友一起聽歌,我們?cè)O(shè)計(jì)出來(lái)的任務(wù)可能就是“分享一首歌給好友并同步播放”、“查看好友的歌單并一起聽歌”
任務(wù)流程圖是由用戶目標(biāo)作為導(dǎo)向來(lái)設(shè)計(jì)的,它描述的是用戶實(shí)現(xiàn)某一目標(biāo)所需要完成的任務(wù),這些任務(wù)彼此間按照先后順序和條件連成一條線,這樣就形成了任務(wù)流程圖。舉一個(gè)最簡(jiǎn)單的購(gòu)物流程,我的目標(biāo)是購(gòu)買一件男士羽絨服,我需要完成的任務(wù)如下:登陸網(wǎng)站—尋找男士羽絨服—確定購(gòu)買對(duì)象—選擇物品參數(shù)—加入購(gòu)物車—結(jié)算—付款。設(shè)計(jì)任務(wù)流程時(shí)要不斷思考和嘗試如何讓用戶完成更少的任務(wù)去實(shí)現(xiàn)它的需求。在實(shí)際工作中,這部分工作通常由產(chǎn)品經(jīng)理完成,或者是交互設(shè)計(jì)師配合產(chǎn)品經(jīng)理完成。
行為流程圖是完成某項(xiàng)任務(wù)所需要進(jìn)行的具體操作。上面的的購(gòu)物流程中每項(xiàng)任務(wù)都對(duì)應(yīng)著具體的行為流程,拿結(jié)算來(lái)講,用戶會(huì)經(jīng)過(guò)如下的這些操作:
和同行交流中發(fā)現(xiàn)很多人并沒(méi)有任務(wù)流程和行為流程的概念,會(huì)把他們混為一談一起去設(shè)計(jì),個(gè)人認(rèn)為這樣是不好的,因?yàn)閷?duì)于架構(gòu)非常復(fù)雜的產(chǎn)品來(lái)講,一起設(shè)計(jì)會(huì)使你的思維在整體流程與具體行為之間不斷地跳躍,思路會(huì)變得很亂,設(shè)計(jì)出來(lái)的流程可能會(huì)是相當(dāng)復(fù)雜的。
在用戶完成某項(xiàng)任務(wù)的時(shí)候,不同場(chǎng)景下不同的選擇或操作會(huì)帶來(lái)不同的交互反饋和結(jié)果,這個(gè)過(guò)程中,我們就需要去完善這些交互邏輯。以下是我在完善交互邏輯時(shí)經(jīng)??紤]的方面:
1.是非條件的判斷:
是非條件是交互流程中最常見(jiàn)的一種條件判定,大家應(yīng)該都懂的,還是舉京東付款的例子,點(diǎn)擊結(jié)算了會(huì)判斷你是否有默認(rèn)的收貨地址,如果沒(méi)有就得添加,如果有就默認(rèn)選擇。
2.網(wǎng)絡(luò)信號(hào)
大家可能會(huì)認(rèn)為網(wǎng)絡(luò)信號(hào)不就是在沒(méi)有網(wǎng)絡(luò)的時(shí)候給用戶一個(gè)提示嘛,沒(méi)有什么好注意和設(shè)計(jì)的。非也,在沒(méi)網(wǎng)時(shí)一個(gè)好的處理方式會(huì)給用戶帶來(lái)意想不到的驚喜,在這個(gè)設(shè)計(jì)上被微信感動(dòng)過(guò),微信在沒(méi)有網(wǎng)絡(luò)時(shí)依然能發(fā)朋友圈,而且會(huì)記住你發(fā)布的時(shí)間,在有網(wǎng)絡(luò)時(shí)系統(tǒng)自動(dòng)幫你按照之前的時(shí)間戳發(fā)布出去。想想,如果這里我們只是做簡(jiǎn)單的處理,沒(méi)有網(wǎng)絡(luò)時(shí)就不能發(fā)朋友圈,用戶會(huì)有什么樣的感受呢?還有,對(duì)于工具型產(chǎn)品,斷網(wǎng)情況下的處理方式是非常重要的。比如說(shuō)你正在填寫一個(gè)表單,這個(gè)時(shí)候網(wǎng)絡(luò)斷了,該怎么辦呢?
3.任務(wù)中斷
這種情況是經(jīng)常會(huì)遇見(jiàn)的交互場(chǎng)景,上面說(shuō)的網(wǎng)絡(luò)中斷也可能導(dǎo)致任務(wù)中斷的發(fā)生。任務(wù)中斷可能由外部不可抗力因素或者自身需求改變等引起,在任務(wù)中斷時(shí)我們需要去判斷中斷任務(wù)的原因并給出相應(yīng)的反饋,舉一個(gè)點(diǎn)外賣的例子,在餓了么點(diǎn)外賣時(shí)我到付款這一步時(shí)突然覺(jué)得菜點(diǎn)錯(cuò)了想重新選擇一下,于是我放棄了付款,然后返回到了訂單詳情頁(yè)面,再次點(diǎn)擊返回就回到了首頁(yè),這時(shí)我會(huì)很迷茫,為啥就回到首頁(yè)了呢,我又得重新去尋找一遍餐廳,同樣的情況,百度和美團(tuán)取消付款后在訂單頁(yè)面點(diǎn)擊返回時(shí)則是回到了之前所選的店家頁(yè)面。
4.需求改變
在用戶執(zhí)行任務(wù)的時(shí)候需求可能會(huì)發(fā)生改變,這種情況在工具型產(chǎn)品中很常見(jiàn),舉個(gè)例子,下面為某BI工具的數(shù)據(jù)配置界面,我本來(lái)想做一個(gè)多種線型的組合圖(數(shù)據(jù)配置界面如圖2),做著做著我想切換成餅圖(數(shù)據(jù)配置界面如圖3),最后我又想再切換為組合圖。餅圖和組合圖的數(shù)據(jù)配置方式是有一些區(qū)別的,在它們之間相互切換時(shí),數(shù)據(jù)的放置會(huì)發(fā)生怎樣的變化呢,再切換回來(lái)的時(shí)候是否與之前的保持一致?
圖一
圖二
5.交互邏輯之間的沖突
這種情況在架構(gòu)復(fù)雜的產(chǎn)品中是很常見(jiàn)的,你在前面為某一任務(wù)定下的交互邏輯可能會(huì)與后面某一任務(wù)的交互邏輯發(fā)生沖突,這一點(diǎn)我就不舉例說(shuō)明了。對(duì)于這一問(wèn)題,不斷去完善團(tuán)隊(duì)的設(shè)計(jì)規(guī)范可以有效的避免這些問(wèn)題的發(fā)生
行為流程圖設(shè)計(jì)完后,這個(gè)過(guò)程就是根據(jù)行為流程圖去設(shè)計(jì)具體的屏幕流,具體的方法如下:
逐一從行為流程圖中去提取屏幕,梳理每個(gè)流程節(jié)點(diǎn),列舉這個(gè)節(jié)點(diǎn)上應(yīng)該具有的支撐信息,去判斷這些信息出現(xiàn)的情景和方式從而確定界面的形式,把每個(gè)節(jié)點(diǎn)確定后,將他們串成線就成為了屏幕流程圖。以下是京東付款流程的一個(gè)實(shí)例。
如上圖,拿是否有收貨信息這個(gè)節(jié)點(diǎn)來(lái)舉例,用戶進(jìn)入購(gòu)物車點(diǎn)擊結(jié)算后首先得判斷是否有收貨信息,如果有就得讓用戶去選擇收貨地址,如果沒(méi)有就得讓用戶去添加。收貨信息包含:“收貨人、收貨地址、聯(lián)系方式、備用聯(lián)系方式、郵箱”,這些信息是用來(lái)支撐整個(gè)付款流程的,但它又不是每次都需要填寫,它屬于整個(gè)付款流程的子任務(wù),如果說(shuō)讓用戶到另一個(gè)頁(yè)面去完成這個(gè)任務(wù)這樣可能會(huì)打斷用戶的行為流,頁(yè)面間的跳轉(zhuǎn)可能會(huì)讓用戶搞不清楚自己所處的狀態(tài),所以把填寫收貨信息做成一個(gè)彈窗式的表單為好。通過(guò)這樣分析后,就確定了“是否有收貨信息”這個(gè)節(jié)點(diǎn)的界面出現(xiàn)的情景和形式。
這一步就是對(duì)每一個(gè)屏幕做具體的界面設(shè)計(jì)了,做界面原型設(shè)計(jì)時(shí)最重要的就是把握住具體平臺(tái)的設(shè)計(jì)規(guī)范以及一些通用的設(shè)計(jì)原則和自己團(tuán)隊(duì)所定下的設(shè)計(jì)規(guī)范。這里我就不多講具體的設(shè)計(jì)規(guī)范和原則了,一方面去熟讀各大平臺(tái)的設(shè)計(jì)規(guī)范,另一方面在實(shí)際的工作中多去總結(jié)。以下為界面設(shè)計(jì)時(shí)需要注意的問(wèn)題:
在完成界面原型設(shè)計(jì)后我們就需要確定界面間具體的交互方式了,它描述的就是用戶向界面上某一監(jiān)聽區(qū)域所發(fā)出的指令,在用戶發(fā)出指令后界面會(huì)出現(xiàn)什么樣的反饋,移動(dòng)網(wǎng)站建設(shè),高端網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站這些反饋出現(xiàn)后用戶怎么繼續(xù)執(zhí)行任務(wù)。在確定交互方式時(shí)我們需要特別注意的就是遵循各大平臺(tái)的設(shè)計(jì)規(guī)范以及用戶的行為習(xí)慣。拿IOS來(lái)舉例,下圖為IOS的標(biāo)準(zhǔn)手勢(shì)(來(lái)自iOS設(shè)計(jì)規(guī)范)
需要注意以下幾點(diǎn)(來(lái)之IOS設(shè)計(jì)規(guī)范)
不要給標(biāo)準(zhǔn)手勢(shì)賦予不同的行為
除非你的應(yīng)用是游戲,否則重新定義標(biāo)準(zhǔn)手勢(shì)會(huì)使用戶迷惑,且增加使用難度。
不要?jiǎng)?chuàng)建和標(biāo)準(zhǔn)手勢(shì)功能相似的手勢(shì)操作
用戶已經(jīng)習(xí)慣了標(biāo)準(zhǔn)手勢(shì)的行為,沒(méi)有必要讓用戶學(xué)習(xí)達(dá)到同樣效果的不同操作。
可以用復(fù)雜手勢(shì)作為完成某任務(wù)的快捷方式,但不能是唯一觸達(dá)方式
最好給用戶提供一些簡(jiǎn)單、直接的方式完成某操作,即使這種方法需要額外的動(dòng)作。簡(jiǎn)單的手勢(shì)能讓用戶集中于當(dāng)前的體驗(yàn)和內(nèi)容,而不是交互操作本身。
除非是游戲,否則避免定義新的手勢(shì)
在游戲或其他沉浸式的應(yīng)用中,操作手勢(shì)也是有趣體驗(yàn)的一部分。但是在普通應(yīng)用中,幫助用戶達(dá)成目標(biāo)要比操作本身重要的多,所以最好使用標(biāo)準(zhǔn)手勢(shì),盡量避免讓用戶去發(fā)掘和記憶新的操作。
在特定的環(huán)境中,可以考慮使用多指操作
雖然復(fù)雜的操作并不一定適用于所有應(yīng)用,但對(duì)用戶會(huì)花大量時(shí)間使用的應(yīng)用來(lái)說(shuō)可以豐富體驗(yàn),例如游戲或創(chuàng)建內(nèi)容環(huán)境。但因?yàn)榉菢?biāo)準(zhǔn)手勢(shì)可發(fā)現(xiàn)性差,要盡量少用,移動(dòng)網(wǎng)站建設(shè),高端網(wǎng)站建設(shè),企業(yè)網(wǎng)站建設(shè),成都響應(yīng)式網(wǎng)站并且不要讓這類手勢(shì)成為完成任務(wù)的唯一方式
在做完界面原型設(shè)計(jì)后整個(gè)設(shè)計(jì)過(guò)程基本完成了,接下來(lái)為了讓產(chǎn)品的體驗(yàn)變得更加優(yōu)雅,我們需要去進(jìn)行一些微交互上的設(shè)計(jì),比如說(shuō)一些界面加載動(dòng)畫、頁(yè)面跳轉(zhuǎn)方式、出錯(cuò)提示、頁(yè)面過(guò)渡效果等等。這個(gè)過(guò)程也是非常重要的,好的細(xì)節(jié)設(shè)計(jì)會(huì)讓你的產(chǎn)品上升幾個(gè)層次。
舉一個(gè)新版百度地圖的例子
上圖是百度地圖搜索結(jié)果頁(yè)面的展示方式,搜索結(jié)果分為地圖標(biāo)記點(diǎn)和具體信息條目出現(xiàn)在同一個(gè)屏幕上,這里用戶可能存在兩種需求,一種是優(yōu)先查看地圖標(biāo)記點(diǎn),一種是優(yōu)先查看具體條目,我通常時(shí)兩者間相互切換查看。這兩者間轉(zhuǎn)換的具體交互方式如圖所示,向上滑動(dòng)搜索結(jié)果面板時(shí),搜索結(jié)果面板和頂部Navigation Bar拼接成為另一個(gè)頁(yè)面。向下滑動(dòng)搜索面板時(shí),搜索結(jié)果的條目被收起,只向用戶展示標(biāo)記點(diǎn)地圖。這種頁(yè)面間的轉(zhuǎn)場(chǎng)方式相比之前很好地降低了兩種不同展現(xiàn)形式之間的隔閡。
上訴10步完成后最后一步就是制作可交互的原型了,我并沒(méi)有把它算在真正的交互設(shè)計(jì)的過(guò)程中,因?yàn)樗雌饋?lái)更像一門純技能的活,這里不多講了,扒一扒我平時(shí)使用的原型工具,“Axure、Pixate、墨刀、Adobe animate、AE、PS、AI”等等。原型制作玩后,拿在手上盡情的享受這種成就感吧。
名稱欄目:十步交互設(shè)計(jì)方法
本文地址:http://www.rwnh.cn/news13/170113.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站維護(hù)、移動(dòng)網(wǎng)站建設(shè)、自適應(yīng)網(wǎng)站、網(wǎng)站建設(shè)、域名注冊(cè)、ChatGPT
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容