如何通過(guò)空狀態(tài)留住用戶(hù)

2022-9-26    純純

在交互設(shè)計(jì)、用戶(hù)體驗(yàn)設(shè)計(jì)中,每一個(gè)細(xì)小環(huán)節(jié)都至關(guān)重要。比如說(shuō),空狀態(tài) ( The Empty State ) 是許多應(yīng)用程序設(shè)計(jì)開(kāi)發(fā)過(guò)程中忽略的一點(diǎn),卻也有著優(yōu)化用戶(hù)體驗(yàn)、改善應(yīng)用程序的潛力。

 

一.什么是空狀態(tài)?

空狀態(tài):顧名思義就是空白的狀態(tài),空狀態(tài)是對(duì)沒(méi)有數(shù)據(jù)頁(yè)面的補(bǔ)充,一種對(duì)零數(shù)據(jù)的設(shè)計(jì)形式(如下圖所示:無(wú)網(wǎng)絡(luò)、訂單為空、沒(méi)有關(guān)注的人以及無(wú)法連接網(wǎng)絡(luò)等等這些頁(yè)面就是所謂的“空狀態(tài)”。)

空狀態(tài)是APP設(shè)計(jì)中不可或缺的一部分,特別是新用戶(hù)初次接觸到產(chǎn)品APP時(shí),必然會(huì)面對(duì)很多空狀態(tài)。

 

       undefined     

二:空狀態(tài)的分類(lèi)

第一:根據(jù)空狀態(tài)產(chǎn)生的路徑,可以將空狀態(tài)分為3類(lèi)

 

系統(tǒng)層:本地請(qǐng)求異常;如:無(wú)網(wǎng)絡(luò)、服務(wù)器異常等

信息層:請(qǐng)求成功,數(shù)據(jù)異常;如內(nèi)容已刪除、已下架等;

空白層:請(qǐng)求成功,無(wú)數(shù)據(jù);最常見(jiàn)的空頁(yè)面或空狀態(tài);

 

       undefined     

 

第二:根據(jù)空狀態(tài)的出現(xiàn)場(chǎng)景又可以將其分為4大類(lèi):

 

初體驗(yàn):初次注冊(cè)登錄的用戶(hù)很多功能都沒(méi)有熟悉

無(wú)信息/無(wú)結(jié)果:某些功能還未使用過(guò)

完成任務(wù):完成某項(xiàng)功能后反饋的結(jié)果

出錯(cuò):因?yàn)楦鞣N原因?qū)е碌腻e(cuò)誤頁(yè)面

 

       undefined     

初體驗(yàn)時(shí),根據(jù)不同的產(chǎn)品,我們可以為用戶(hù)提供不同的引導(dǎo)

· 創(chuàng)作平臺(tái)→引導(dǎo)用戶(hù)創(chuàng)造內(nèi)容、推薦相關(guān)內(nèi)容、開(kāi)啟權(quán)限……

· 工具類(lèi)app→介紹相關(guān)功能、添加相關(guān)人、相關(guān)功能……

·學(xué)習(xí)類(lèi)app→收集用戶(hù)目標(biāo)、推薦相關(guān)課……

       undefined     

 

無(wú)信息/無(wú)結(jié)果時(shí),告知用戶(hù)該如何解決問(wèn)題,或者給用戶(hù)其他選擇

·購(gòu)物車(chē)為空時(shí)→讓用戶(hù)購(gòu)買(mǎi)或者給用戶(hù)推薦商品

·無(wú)收藏時(shí)→應(yīng)到用戶(hù)去收藏

·搜索為空時(shí)→告知用戶(hù)換一個(gè)詞試一試

·無(wú)評(píng)論時(shí)→讓用戶(hù)搶個(gè)沙發(fā)

       undefined     

 

 

任務(wù)完成后,鼓勵(lì)或獎(jiǎng)勵(lì)用戶(hù)

·郵件全部回復(fù)完→祝用戶(hù)擁有美好的一天

·書(shū)看完時(shí)→讓眼睛放松一下

·打卡成功→獎(jiǎng)勵(lì)用戶(hù)勛章等等

       undefined     

 

程序出錯(cuò)后,緩解用戶(hù)情緒,告知用戶(hù)解決辦法

·網(wǎng)絡(luò)出錯(cuò)→檢查網(wǎng)絡(luò)/刷新頁(yè)面

·404頁(yè)面→讓用戶(hù)反饋情況到后臺(tái)、報(bào)錯(cuò)等

       undefined     

三:設(shè)計(jì)空狀態(tài)頁(yè)面的好處

 

據(jù)調(diào)查顯示:“平均下來(lái),APP在被下載之后的前3天時(shí)間里,日活躍用戶(hù)(DAU)數(shù)量下降了77個(gè)百分點(diǎn)。30天內(nèi),下降比例達(dá)到80%”。用戶(hù)會(huì)嘗試多個(gè)同類(lèi)APP,然后在接下來(lái)的3到7天內(nèi)決定其中的哪些不合適。這時(shí)候就需要通過(guò)更多好的設(shè)計(jì)和體驗(yàn)來(lái)留住用戶(hù)

 

當(dāng)然一個(gè)產(chǎn)品的好與壞不能全靠空狀態(tài),但是空狀態(tài)對(duì)于新用戶(hù)的留存是很重要的。

 

Spotify的用戶(hù)體驗(yàn)專(zhuān)家Tamara Hilmes提醒設(shè)計(jì)師們時(shí)說(shuō),空狀態(tài)是一個(gè)展示產(chǎn)品個(gè)性化的機(jī)會(huì),因此,在進(jìn)行空狀態(tài)設(shè)計(jì)時(shí),需要認(rèn)真考慮品牌用戶(hù)的目標(biāo)和背景。

 

 

 

四:空狀態(tài)設(shè)計(jì)原則


       undefined     

4.1基本原則 


準(zhǔn)確:空狀態(tài)需要清晰明確地將當(dāng)前系統(tǒng)狀態(tài)傳達(dá)給用戶(hù)

直觀:簡(jiǎn)言之就是畫(huà)面要“小而美”→簡(jiǎn)單

高效:提供用戶(hù)快速有效地?cái)[脫空狀態(tài)的方法

 

準(zhǔn)確

準(zhǔn)確原則要求在文字描述上做到清晰地闡述系統(tǒng)當(dāng)前的狀態(tài)。

下圖為例,如果僅以“獲取不到數(shù)據(jù)”作為收件箱空狀態(tài)提示文字,用戶(hù)不清楚是系統(tǒng)異常、網(wǎng)絡(luò)異常還是僅僅因?yàn)槭占錄](méi)有郵件而出現(xiàn)當(dāng)前狀態(tài)。準(zhǔn)確地將系統(tǒng)狀態(tài)及操作結(jié)果告知用戶(hù)是空狀態(tài)設(shè)計(jì)中十分重要的目標(biāo)。

       undefined     

 

 

特殊原因?qū)е碌目諣顟B(tài),也可以在附加文字中告知用戶(hù)其原因,例如郵箱賬號(hào)未登錄而導(dǎo)致收件箱為空的情況。

 

直觀:

空狀態(tài)不僅要講究視覺(jué)的美感,還要講究體驗(yàn)的“美感”,要讓用戶(hù)在不用思考的情況下,  獲得最大的價(jià)值,

       undefined     

 

高效

若空狀態(tài)在系統(tǒng)中可以通過(guò)觸發(fā)操作離開(kāi),建議在空狀態(tài)的文字或操作上進(jìn)行展現(xiàn)。

以站內(nèi)信空狀態(tài)為例,系統(tǒng)存在用戶(hù)可執(zhí)行的解決方案,在設(shè)計(jì)上也要體現(xiàn)。上面提到的賬號(hào)未登錄導(dǎo)致站內(nèi)信為空時(shí),考慮附加文字提示‘登錄賬號(hào)即可開(kāi)始’。若系統(tǒng)存在直接觸發(fā)操作的方案,可通過(guò)鏈接或按鈕的形式提供入口給用戶(hù),便于用戶(hù)快速有效地回到功能主流程中。

       undefined     

 

 

4.2進(jìn)階原則undefined       

有趣:有趣又易用,符合用戶(hù)的心理預(yù)期

品牌:介紹并強(qiáng)化品牌元素,通過(guò)恰當(dāng)?shù)姆绞?、形式呈現(xiàn)

記憶:有創(chuàng)意或幽默色彩,呈現(xiàn)形式新穎,體現(xiàn)專(zhuān)業(yè)同時(shí)創(chuàng)造正面情緒

 

有趣

空狀態(tài)的設(shè)計(jì)在滿(mǎn)足了基本的設(shè)計(jì)原則后,還可根據(jù)產(chǎn)品的品牌特征進(jìn)行優(yōu)化。一般對(duì)空狀態(tài)的圖片、文案來(lái)著手進(jìn)行品牌化設(shè)計(jì)。

采用含著關(guān)懷情感的文案“哎呀,網(wǎng)絡(luò)好像出了點(diǎn)問(wèn)題”代替“網(wǎng)絡(luò)未連接”這樣冰冷無(wú)感情的提示文字,同樣達(dá)到告知用戶(hù)系統(tǒng)狀態(tài)的目的,但修改后的文案明顯更能貼合服務(wù)工具型軟件的品牌形象。

 

同時(shí)結(jié)合文案主題,用有趣的插畫(huà)吸引用戶(hù),達(dá)到緩解用戶(hù)焦慮、負(fù)面情緒的目的

例如下圖的刷新一下試試,企業(yè)IP作為粉刷匠在刷新Wi-Fi,比起一個(gè)失聯(lián)的行星就更有意思

       undefined品牌

當(dāng)空狀態(tài)滿(mǎn)足了用戶(hù)的基本需求后,就可以考慮如何樹(shù)立品牌形象了!

目前最簡(jiǎn)單且有效的辦法是——企業(yè)IP+插畫(huà)+文案,雖然被很多人吐槽套路、片面,但是作為剛起步的創(chuàng)業(yè)類(lèi)的app,這不失為一種好辦法

 

       undefined     

 

設(shè)計(jì)專(zhuān)屬吉祥物形象,對(duì)產(chǎn)品進(jìn)行擬人化表達(dá),避免極其復(fù)雜的插畫(huà),保障界面簡(jiǎn)潔明快;

由于插畫(huà)不可交互,盡量與背景融合為一部分,避免使用明亮的色彩,誤導(dǎo)用戶(hù)點(diǎn)擊。

 

 

記憶

文章的開(kāi)頭講過(guò),空狀態(tài)對(duì)留住新用戶(hù)有著很關(guān)鍵的作用,那么空狀態(tài)在用戶(hù)使用的幾秒鐘內(nèi)一定要給用戶(hù)留下足夠深刻的印象才有可能留住這些新用戶(hù),所以空狀態(tài)一定要有新意,甚至是要給用戶(hù)出其不意的視覺(jué)感受,這個(gè)階段考慮的問(wèn)題要更多一些,受眾人群的特點(diǎn)、品牌的調(diào)性、想要達(dá)到的效果、解決問(wèn)題的手法、還要注意對(duì)用戶(hù)而言是否直接有效并且準(zhǔn)確。

 

阿里旗下“躺平”app的空狀態(tài)打破常規(guī),非常優(yōu)秀的抓住了用戶(hù)人群的特性,解決了用戶(hù)的需求的同時(shí),還給用戶(hù)樹(shù)立了非常深刻的品牌印象。

       undefined     

產(chǎn)品所有能傳遞情緒的場(chǎng)景都應(yīng)該與品牌情緒一致。采用負(fù)面情緒的空狀態(tài)有一定風(fēng)險(xiǎn),可能會(huì)起到消極作用。

用戶(hù)更容易代入場(chǎng)景化的故事,產(chǎn)生情感共鳴。構(gòu)思場(chǎng)景,需研究產(chǎn)品目標(biāo)用戶(hù)群的特質(zhì),設(shè)計(jì)他們的共同回憶,將有關(guān)的場(chǎng)景、片段、元素進(jìn)行拼貼、組合、關(guān)聯(lián),再找到最能勾起情緒沖動(dòng)的突破口,豐滿(mǎn)場(chǎng)景。

避免正面刻板的形象(一眼就能看到底的設(shè)計(jì)),盡可能簡(jiǎn)單有趣、不落俗套,讓用戶(hù)看到這個(gè)畫(huà)面后可以有更多想象的空間,從而吸引用戶(hù),驅(qū)動(dòng)用戶(hù)的好奇心。

 

五、總結(jié)

簡(jiǎn)單總結(jié)了一些設(shè)計(jì)空狀態(tài)時(shí)整體的設(shè)計(jì)流程,如下:

 
功能入口:提供相關(guān)功能的入口和動(dòng)作按鈕,解釋服務(wù)的功能和優(yōu)點(diǎn),引導(dǎo)用戶(hù)到其他頁(yè)面查看內(nèi)容

  1. 標(biāo)題文案:說(shuō)明當(dāng)前狀態(tài),解釋當(dāng)前問(wèn)題出現(xiàn)原因,介紹功能概要

  2. 解說(shuō)文案:如何走出當(dāng)前狀態(tài),如何解決當(dāng)前問(wèn)題,補(bǔ)充說(shuō)明功能的屬性

  3. 推薦數(shù)據(jù):提供熱門(mén)數(shù)據(jù)、個(gè)性化推薦數(shù)據(jù)讓用戶(hù)選擇;如電商搜索無(wú)結(jié)果、購(gòu)物車(chē)等頁(yè)面,推 薦用戶(hù)感興趣的商品,能有效地提升購(gòu)買(mǎi)轉(zhuǎn)化率

  4. 操作引導(dǎo):提供相關(guān)操作的示意和引導(dǎo),讓用戶(hù)能刪除或替換內(nèi)容

  5. 完成指導(dǎo):送上任務(wù)達(dá)成的祝賀語(yǔ),鞏固用戶(hù)的成就

 

細(xì)節(jié)備注:

文字和圖形一樣,也是一種情緒的載體,注意文字的魅力,加注重文字的情緒表達(dá),更易調(diào)動(dòng)觀者的心。

日歷

鏈接

個(gè)人資料

存檔