發(fā)布時(shí)間:2024-03-10 20:05:38 瀏覽量:114次
生活中,機(jī)場(chǎng)、醫(yī)院等公共場(chǎng)所會(huì)設(shè)置導(dǎo)向指引牌,幫助人們辨別方位、找到目標(biāo)位置。APP中,也需要在用戶的行為旅程中,給出操作引導(dǎo),以輔助用戶完成操作目標(biāo),或者吸引、引導(dǎo)用戶按照設(shè)計(jì)者的想法參與使用APP、提升轉(zhuǎn)化率。今天我就針對(duì)UI設(shè)計(jì)中引導(dǎo)設(shè)計(jì)怎么做進(jìn)行簡(jiǎn)單的說(shuō)明。
為什么要進(jìn)行引導(dǎo)設(shè)計(jì)?
引導(dǎo)提示存在的本質(zhì)原因,是由于大多數(shù)APP內(nèi)的信息層級(jí)、視覺(jué)元素都很多,且受限于手機(jī)設(shè)備的頁(yè)面空間,信息與功能入口還會(huì)被折疊壓縮,讓用戶只根據(jù)頁(yè)面布局、信息架構(gòu)去尋找目標(biāo)內(nèi)容的話,學(xué)習(xí)成本與認(rèn)知負(fù)荷會(huì)很高。
引導(dǎo)提示的設(shè)計(jì),就可以讓原有的內(nèi)容架構(gòu)更靈活,可以突出引導(dǎo)用戶當(dāng)前最需要的內(nèi)容、或是最想讓用戶關(guān)注的內(nèi)容。恰當(dāng)?shù)囊龑?dǎo)設(shè)計(jì)可以起到「點(diǎn)睛」作用。從心理學(xué)角度來(lái)說(shuō),引導(dǎo)提示很好地應(yīng)用了「行為設(shè)計(jì)學(xué)」中的Fogg’s Behavior Model這一理論模型。該模型揭示了怎樣可以促成一個(gè)人的行為產(chǎn)生,即在合適的時(shí)機(jī),用合適的動(dòng)機(jī)來(lái)說(shuō)服、觸發(fā)用戶,做他力所能及的事情。
用一個(gè)簡(jiǎn)單的公式來(lái)表示就是B=MAT,其中B是Behavior行為,M是Motivation 動(dòng)機(jī),A是Ability能力,T是Triggers觸發(fā)。引導(dǎo)提示就是一個(gè)展示動(dòng)機(jī)和能力成本的觸發(fā)因素。
Fogg行為模型與引導(dǎo)設(shè)計(jì)
下面將展開(kāi)來(lái)說(shuō),引導(dǎo)設(shè)計(jì)與Fogg行為模型每個(gè)因素的具體聯(lián)系。
以下兩段是略顯枯燥的理論知識(shí),但它是進(jìn)行引導(dǎo)提示的文案撰寫、交互設(shè)計(jì)、視覺(jué)表達(dá)的重要支撐,請(qǐng)堅(jiān)持讀下去~
第一部分,動(dòng)機(jī)
動(dòng)機(jī)在心理學(xué)中是指激發(fā)個(gè)體朝著一定目標(biāo)活動(dòng),并且維持這種活動(dòng)的內(nèi)在心理活動(dòng)或內(nèi)部動(dòng)力。動(dòng)機(jī)關(guān)乎著行為的發(fā)生、方向、強(qiáng)度和持續(xù)性。
動(dòng)機(jī)產(chǎn)生的基礎(chǔ)是需要。馬斯洛需要層次理論中,由低到高,從生理層面到社會(huì)層面,對(duì)需要進(jìn)行了拆解。由需要的分層可以體會(huì)動(dòng)機(jī)的分類與層次。再深入說(shuō)的話,這篇文的學(xué)術(shù)氣息就太濃厚了,感興趣的小伙伴可以繼續(xù)深挖或者戳我交流~
用戶使用APP甚至沉迷其中就是由動(dòng)機(jī)促使的,如某用戶在電商平臺(tái)挑選瀏覽的動(dòng)機(jī),可以是想要物美價(jià)廉地購(gòu)買某件商品。
引導(dǎo)設(shè)計(jì)通常都抓住了用戶當(dāng)前頁(yè)面場(chǎng)景下,可能促成行為的動(dòng)機(jī),如引導(dǎo)提示”關(guān)注領(lǐng)取優(yōu)惠券“、”紅包即將失效“等機(jī)制,就戳中了用戶價(jià)廉購(gòu)買的動(dòng)機(jī)。
第二部分,能力成本
能力成本比較好理解,就是完成某件事的難易程度、需要調(diào)用的能力資源。
產(chǎn)品設(shè)計(jì)中的一大重要原則就是提升產(chǎn)品的易用性,降低操作門檻,降低對(duì)用戶能力成本的要求與消耗。
能力成本有以下6個(gè)維度:
前四點(diǎn)總結(jié)來(lái)說(shuō),就是省時(shí)、省錢、省事、省力。第五點(diǎn),社會(huì)偏好指的是借助人們「從眾」的心理本能,用大眾的選擇、觀點(diǎn)作為背書。如商品的描述與價(jià)格都相同,我們一般都會(huì)選銷量高的那個(gè),因?yàn)橛X(jué)得大家都選的應(yīng)該沒(méi)什么大問(wèn)題。
最后一點(diǎn)是指一些打破用戶習(xí)慣的行為是有很高成本的,UI設(shè)計(jì)中引導(dǎo)設(shè)計(jì)怎么做https://www.aaa-cg.com.cn/ui/2792.html如將公司的紙質(zhì)化報(bào)賬、申請(qǐng)的流程全部遷移到線上,光想想就有原資料錄入、構(gòu)建線上系統(tǒng)、規(guī)則調(diào)整、工作流程調(diào)整等一系列問(wèn)題。在APP設(shè)計(jì)中,目前比較成熟的電商、新聞等類型的APP都有比較固定的產(chǎn)品架構(gòu)與交互方式,用戶在長(zhǎng)期使用的過(guò)程中已經(jīng)建立了較深的習(xí)慣基礎(chǔ)。設(shè)計(jì)同類型產(chǎn)品時(shí)應(yīng)盡量保持用戶習(xí)慣的模式,不要做翻天覆地的創(chuàng)新設(shè)計(jì),否則會(huì)給用戶帶來(lái)很高的打破習(xí)慣、重新學(xué)習(xí)的成本。再說(shuō)回引導(dǎo)設(shè)計(jì),它可以傳遞給用戶「APP此處的功能可以降低某種能力成本」的信息,從而吸引用戶使用。如下圖中:
以網(wǎng)易嚴(yán)選為例,提示某產(chǎn)品入選網(wǎng)易員工精選好物是對(duì)迎合社會(huì)偏好的體現(xiàn);而攜程中,引導(dǎo)提示有福利可享、并可通過(guò)點(diǎn)擊引導(dǎo)組件滑至福利版塊,通過(guò)引導(dǎo)組件體現(xiàn)了APP可以降低金錢成本、操作的體力成本。除了降低能力成本的方式,還可以通過(guò)「提升用戶能力」的方式促成行為。如引導(dǎo)提示中可以教給用戶這個(gè)icon代表什么功能、要怎么操作、某功能遷移到這兒了,都是在讓用戶學(xué)習(xí)提升。換個(gè)角度說(shuō),也是在降低用戶認(rèn)知學(xué)習(xí)的體力成本。
第三部分,觸發(fā)因素
觸發(fā)因素是促使行為發(fā)生的第三個(gè)要素。當(dāng)用戶有充足的動(dòng)機(jī)、又有能力的時(shí)候,需要的只是臨門一腳——在適當(dāng)?shù)臅r(shí)機(jī)給用戶一個(gè)提醒。比如大促前的促銷短信發(fā)放、促銷活動(dòng)的倒計(jì)時(shí)、廣告投放等,都是常見(jiàn)的觸發(fā)因素。
這三個(gè)因素的關(guān)系如下圖:
行為需要的能力成本、人的動(dòng)機(jī)分別為橫縱坐標(biāo),上方的曲線為行動(dòng)成功曲線,它之上是成功觸發(fā)行為的區(qū)域,下方是失敗區(qū)域。簡(jiǎn)單來(lái)說(shuō),在動(dòng)機(jī)程度一定的情況下,行為越簡(jiǎn)單越容易觸發(fā);在行為難易程度一定的情況下,動(dòng)機(jī)越強(qiáng)越容易觸發(fā)行為。注意不要出現(xiàn)動(dòng)機(jī)要求高、操作又很難的設(shè)計(jì),轉(zhuǎn)化結(jié)果會(huì)很低。我們?cè)谠O(shè)計(jì)行為流程中的引導(dǎo)提示時(shí),要注意在這幾種情境下的發(fā)力點(diǎn):
1. 當(dāng)用戶行為動(dòng)機(jī)不足時(shí),引導(dǎo)提示的形式、文案內(nèi)容,要充分刺激用戶產(chǎn)生動(dòng)機(jī)。如使用大字號(hào)、動(dòng)效吸引用戶產(chǎn)生好奇的動(dòng)機(jī),標(biāo)明活動(dòng)滿減、贈(zèng)品等優(yōu)惠信息刺激用戶產(chǎn)生購(gòu)買動(dòng)機(jī)。
2. 當(dāng)用戶有足夠的動(dòng)機(jī)、想要進(jìn)行行為操作,但受限于頁(yè)面流程的復(fù)雜、個(gè)人能力,不知道要怎么操作時(shí),要適時(shí)適地給出操作引導(dǎo)提示,輔助用戶學(xué)會(huì)使用,從而完成轉(zhuǎn)化。如功能入口的折疊、位置變化,特殊交互方式的說(shuō)明。
在此基礎(chǔ)上,還可以將操作與引導(dǎo)提示結(jié)合起來(lái),讓用戶通過(guò)引導(dǎo)組件直接完成操作。如快捷滑動(dòng)頁(yè)面內(nèi)容、快捷錄入常用信息、收藏內(nèi)容后快捷進(jìn)入收藏夾等。
3. 當(dāng)用戶既有行動(dòng)的動(dòng)機(jī),又知道怎么行動(dòng)時(shí),就需要適時(shí)地給用戶一個(gè)適當(dāng)?shù)奶嵝?。這時(shí)不需過(guò)度引導(dǎo)誘惑,免得適得其反。簡(jiǎn)單的彈窗提示或者氣泡提示就可以達(dá)到效果。
劃重點(diǎn)
今天分享了設(shè)計(jì)引導(dǎo)提示時(shí)如何深入思考,挖掘設(shè)計(jì)方案背后的行為設(shè)計(jì)學(xué)原理。Fogg行為模型中指出B=MAT,行為的產(chǎn)生需要足夠的動(dòng)機(jī)、一定的能力和觸發(fā)條件。而引導(dǎo)提示就是可以提示用戶產(chǎn)生或強(qiáng)化動(dòng)機(jī)、幫助用戶提升能力、提醒觸發(fā)用戶現(xiàn)在就行動(dòng)起來(lái)的方式。因此,您現(xiàn)在已經(jīng)了解了與UI設(shè)計(jì)師的工作相關(guān)的主要技能。如果您想了解更多信息,請(qǐng)給我點(diǎn)個(gè)關(guān)注,我之后還會(huì)發(fā)包含有關(guān)在該領(lǐng)域工作的更多相關(guān)文章。
熱門資訊
1. iPhone6的UI設(shè)計(jì)尺寸規(guī)范,原來(lái)如此重要!
想要了解iPhone6界面設(shè)計(jì)的尺寸規(guī)范嗎?這里為您詳細(xì)介紹iPhone6的UI設(shè)計(jì)尺寸規(guī)范,包括界面尺寸、圖標(biāo)尺寸、可點(diǎn)擊高度規(guī)范、搜索欄高度規(guī)范以及界面元素之間的距離規(guī)范。
2. 12個(gè)絕佳的UI設(shè)計(jì)網(wǎng)站,助力你的創(chuàng)作之旅!
將為大家介紹12個(gè)絕佳的UI設(shè)計(jì)網(wǎng)站,這些網(wǎng)站不僅可以為你提供靈感,還可以幫助你學(xué)習(xí)新的技巧,助力你的創(chuàng)意之旅!dribbbleDribbble 是一個(gè)面向設(shè)計(jì)師的...
3. 移動(dòng)端UI設(shè)計(jì)中常見(jiàn)的5種APP界面類型,你get到了嗎?
通過(guò)介紹移動(dòng)端UI設(shè)計(jì)中的閃屏頁(yè)、引導(dǎo)頁(yè)、浮層引導(dǎo)頁(yè)、空白頁(yè)和首頁(yè)等5種APP界面類型,幫助大家更好地了解UI設(shè)計(jì)的基本知識(shí)
4. 10個(gè)免費(fèi)學(xué)習(xí)UI設(shè)計(jì)的網(wǎng)站 提升你的設(shè)計(jì)能力
怎樣可以提升你的UI設(shè)計(jì)能力!第一個(gè):站酷站酷想必是設(shè)計(jì)師都知道的一個(gè)網(wǎng)站,里面不止有UI設(shè)計(jì)的資源,還有其他設(shè)計(jì)的,不如:平面設(shè)計(jì)、網(wǎng)頁(yè)設(shè)計(jì)、字體...
5. 移動(dòng)端列表頁(yè)和表單頁(yè)設(shè)計(jì)秘訣:讓你的APP點(diǎn)擊率翻倍
在移動(dòng)端設(shè)計(jì)中,列表頁(yè)和表單頁(yè)是不可或缺的部分。一個(gè)好的列表頁(yè)和表單頁(yè)設(shè)計(jì)能夠讓用戶輕松地獲取信息并產(chǎn)生點(diǎn)擊欲望,從而提高點(diǎn)擊率。本文將為你...
6. 推薦10本適合UI設(shè)計(jì)師看的書籍,輕松掌握技能!
對(duì)于想要提高自己的設(shè)計(jì)能力和創(chuàng)造力的小白和UI設(shè)計(jì)師來(lái)說(shuō),這本書是一個(gè)很好的選擇。4.《設(shè)計(jì)的覺(jué)醒》(IKKO TANAKA)推薦理由: 這本書是日本現(xiàn)代平面...
7. 零基礎(chǔ)學(xué)UI設(shè)計(jì)要多久?培訓(xùn)完能拿多少工資?
探索零基礎(chǔ)UI設(shè)計(jì)培訓(xùn)的時(shí)長(zhǎng)與薪資前景。了解數(shù)字藝術(shù)教育領(lǐng)域的專業(yè)課程,以及培訓(xùn)后的職業(yè)發(fā)展機(jī)會(huì)。
8. 物聯(lián)網(wǎng)APP UI設(shè)計(jì):創(chuàng)造智能硬件領(lǐng)域的沉浸式體驗(yàn)
ui設(shè)計(jì)應(yīng)該讓用戶一目了然,能夠快速找到所需的信息和功能。在設(shè)計(jì)過(guò)程中,應(yīng)盡量使用簡(jiǎn)潔的圖標(biāo)、文字和色彩,避免過(guò)多的視覺(jué)干擾。符合用戶習(xí)慣:ui設(shè)...
9. 武漢UI設(shè)計(jì)培訓(xùn)班費(fèi)用怎么樣?想學(xué)UI設(shè)計(jì)要多少錢?
想了解武漢UI設(shè)計(jì)培訓(xùn)班的費(fèi)用是多少嗎?不知道學(xué)UI設(shè)計(jì)要花多少錢?不妨看看這篇文章,了解UI設(shè)計(jì)培訓(xùn)班的學(xué)費(fèi)價(jià)格以及學(xué)習(xí)內(nèi)容。
10. 設(shè)計(jì)中的色彩心理學(xué):淺析中西方色彩的歷史演變與設(shè)計(jì)應(yīng)用
摘要:本文探討了色彩的歷史演變和設(shè)計(jì)應(yīng)用。通過(guò)對(duì)色彩在早期文明社會(huì)中的實(shí)用運(yùn)用、不同文化背景下色彩觀念的差異、色彩在設(shè)計(jì)中的重要性以及新興技...
最新文章
同學(xué)您好!