結(jié)合案例 | 思考交互設(shè)計(jì)的價(jià)值!別再說我們只會(huì)畫原型了!

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



一、思考不同場景下的用戶需要

原型里的某個(gè)頁面、組件并不是畫好了就萬事大吉、一成不變的,交互側(cè)需要分析:在不同場景下用戶是否存在不同的訴求?

如順豐速運(yùn),在工作日里是默認(rèn)【派送到豐巢柜】,而到了休息日則自動(dòng)勾選了【上門派件】。

圖片

正是充分考慮到了【工作日與休息日】這2個(gè)不同的場景與用戶需要:

工作日:上班不在家,下班可以順路去站點(diǎn)拿快遞

休息日:有時(shí)間在家里等、不想/懶得出門去拿快遞

通過分析和預(yù)判用戶的行為,可以有效地減少操作成本、保障產(chǎn)品的使用體驗(yàn)。

 

二、盡量別讓用戶離開當(dāng)前頁面

我們?cè)诮o用戶設(shè)計(jì)一個(gè)新的、分支流程時(shí),往往都會(huì)選擇【新跳一個(gè)頁面】的方式去處理。

而對(duì)于交互需要注意的是:

但并不是所有的新的、分支流程,都需要脫離掉當(dāng)前頁面。有些場景下,新跳頁面容易斷掉用戶的當(dāng)前任務(wù),再切回來時(shí)的操作成本、鏈路會(huì)特別復(fù)雜。

比如你在刷朋友圈,此時(shí)收到一條消息,此時(shí)退出朋友圈回去看消息后,再切回來繼續(xù)看朋友圈,這個(gè)鏈路得多長…

而對(duì)比QQ空間你就知道多香了:

查看QQ動(dòng)態(tài)時(shí)有新的消息通知,可以用【小窗口】的方式進(jìn)行快速查看與回復(fù),用戶處理完可以繼續(xù)瀏覽動(dòng)態(tài),當(dāng)前流程不受任何影響。

圖片

再如Edge瀏覽器,選中某段信息后可以在【右側(cè)邊欄】中加載結(jié)果。

圖片

這樣既不用覆蓋當(dāng)前頁面 來加載新的結(jié)果,又不用新建一個(gè)窗口去處理(用戶還得切回來),用戶可以邊看邊搜。

 

三、別忘了特殊人群的訴求

和上面的要點(diǎn)有點(diǎn)類似,同樣是需要分析產(chǎn)品里不同的【用戶群】,是否需要兼容不同的交互方式。

比如左撇子用戶,【右邊更容易操作的概念】就不能用在他們身上了。對(duì)于那些重要、高頻的功能就需要思考:如何更好兼容【左/右手】的操作習(xí)慣。

比如UC瀏覽器的【刷新】按鈕,默認(rèn)是放在右邊(順應(yīng)最主流的操作習(xí)慣),也可以長按它拖拽到左邊的位置,這樣都能兼顧到不同用戶的使用習(xí)慣。

當(dāng)然以上的預(yù)判、分析不一定都在畫原型/出方案的時(shí)候能想到的,還得借助【用戶反饋、訪談、后臺(tái)數(shù)據(jù)等】等逐步發(fā)現(xiàn)和完善用戶訴求,這也是交互和產(chǎn)品的工作之一。

 

四、用更直接的方式告知用戶

當(dāng)采用了某種方式、組件來設(shè)計(jì)方案后,交互都可以靜下來心想一想:是否能更簡單、明顯一點(diǎn)?

畢竟設(shè)計(jì)者的理想視角,和使用者的使用視角,有時(shí)真的不是同一回事。不同的用戶因?yàn)椤灸挲g、經(jīng)歷、學(xué)歷、身體條件】等原因,對(duì)同一個(gè)事物有著不同的理解。

比如上滑引導(dǎo),傳統(tǒng)的做法可能就是蓋一個(gè)蒙層引導(dǎo),跟你說上下滑動(dòng)可切換視頻

圖片

而為了更好地幫助用戶理解、減少認(rèn)知漏斗,交互側(cè)可以考慮直接展示上滑的動(dòng)作,讓用戶明顯看到下面還有視頻。

比如抖音的新手引導(dǎo):

支付寶的這個(gè)例子就更加明顯了,直接將我們習(xí)慣表達(dá)的術(shù)語,直接轉(zhuǎn)換成最易懂的語言。

圖片

 

五、盡量擺脫組件的束縛

大部分設(shè)計(jì)者在設(shè)計(jì)某個(gè)頁面或功能時(shí),都會(huì)優(yōu)先調(diào)取團(tuán)隊(duì)已有的設(shè)計(jì)組件,在大廠里更看重這點(diǎn)。

畢竟能用已有組件解決的,就絕不新增一個(gè)樣式和代碼,對(duì)整個(gè)產(chǎn)品的調(diào)性、交互方式、用戶心智等都能保持統(tǒng)一。

實(shí)際上是:對(duì)設(shè)計(jì)和開發(fā)來說能減少很多工作量…

比如在【日期選擇】上,我們的常規(guī)思路往往會(huì)選擇系統(tǒng)組件,讓用戶在里面選擇某一年的1-12個(gè)月份。

圖片

有條件的話交互也可以考慮:是否有更合適的表達(dá)形式?不一定要依靠組件的限制。

比如QQ團(tuán)隊(duì)在這點(diǎn)上就有新的突破:用側(cè)邊欄的方式里展示日期

圖片

這樣做的處理有以下優(yōu)勢:

1.首屏內(nèi)容可以展示更多月份,選擇效率更快

2.用戶可以一邊選擇月份,一邊看QQ動(dòng)態(tài)

3.更方便快速退出日期

 

六、維持用戶已有的心智

每個(gè)人使用APP都存在著一定的【固有理解】,比如下拉=刷新。

在設(shè)計(jì)交互方案時(shí)同樣需要注意這點(diǎn),尤其是那些容易被我們忽略的地方。

舉個(gè)栗子:iOS在日歷里添加日程時(shí),原本設(shè)置了「30分鐘」的日程時(shí)間。

而當(dāng)你在【開始時(shí)間】里修改了日期或時(shí)間點(diǎn)后,【結(jié)束日期】會(huì)自動(dòng)設(shè)置「30分鐘」后的時(shí)間點(diǎn)。

依然保持著原有「只有30分鐘」的心智模型。

圖片

當(dāng)然如果存在【信息變化】需要讓用戶知道的話,則需要進(jìn)行一定程度的提示設(shè)計(jì)了。

 

七、用易懂的方式處理復(fù)雜事物 

交互設(shè)計(jì)的工作核心,就在于將復(fù)雜的產(chǎn)品/用戶需求,轉(zhuǎn)換成易懂、易操作的處理方式。特別是那些對(duì)用戶來說【不知道怎么操作的】。

比如一些疊字(如‘淼’字),用戶不知道怎么打出時(shí)。除了進(jìn)行手寫外,搜狗輸入法中還提供了一個(gè)【打出N個(gè)組成詞的拼音】的處理方法。

如輸入3個(gè)【水】的拼音,就能得出【淼】字。

圖片

對(duì)于習(xí)慣打拼音的用戶,這無疑也是一個(gè)不錯(cuò)的處理方法。

再比如:想打出一些不懂的生僻字(如‘卞’字),個(gè)人所得稅APP里就提供一個(gè)【選擇筆畫數(shù)】的方式來幫助用戶尋找。

圖片

 

– END

好了,以上老和對(duì)【交互價(jià)值】的一些小總結(jié),覺得認(rèn)同的麻煩幫我【點(diǎn)贊/在看/收藏/轉(zhuǎn)發(fā)】,寫得不對(duì)的請(qǐng)輕點(diǎn)噴~

 

原文地址:和出此嚴(yán)(公眾號(hào))

作者:和出此嚴(yán)

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》結(jié)合案例 | 思考交互設(shè)計(jì)的價(jià)值!別再說我們只會(huì)畫原型了!

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

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

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(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è)人資料

存檔