技術(shù)資訊
空狀態(tài)設(shè)計(jì)是提升產(chǎn)品用戶體驗(yàn)的不錯(cuò)的方法
2018-08-23 09:00:26
從用戶進(jìn)入到與APP交互的過程中,空狀態(tài)設(shè)計(jì)都是提升產(chǎn)品用戶體驗(yàn)的不錯(cuò)的方法??諣顟B(tài)是指沒有數(shù)據(jù)的頁(yè)面,盡管如此,空狀態(tài)也可以提供有趣的用戶體驗(yàn)。
空狀態(tài)是指沒有數(shù)據(jù)的頁(yè)面,也就是說,在用戶進(jìn)行某些動(dòng)作后,頁(yè)面將會(huì)展示其產(chǎn)生的內(nèi)容。盡管如此,空狀態(tài)也可以提供有趣的用戶體驗(yàn)。事實(shí)上,空狀態(tài)完全可以用于指導(dǎo)用戶的操作,向他們介紹你的產(chǎn)品或展示產(chǎn)品品牌的個(gè)性。
什么是空狀態(tài)?
空狀態(tài)是APP中的內(nèi)容無(wú)法顯示的頁(yè)面狀態(tài),用“空”來(lái)描述其實(shí)是不恰當(dāng)?shù)?,因?yàn)榭諣顟B(tài)頁(yè)面中還有一些內(nèi)容的。事實(shí)上,空狀態(tài)可以顯示多種不同的內(nèi)容來(lái)提升用戶體驗(yàn),接下來(lái)我們就會(huì)著重介紹這一點(diǎn)。
例如:如果你曾經(jīng)使用過一款允許你把你喜愛的內(nèi)容添加到收藏夾里的APP,你就會(huì)對(duì)空狀態(tài)有所了解?;蛘吣闶褂盟阉?,有過沒有搜索結(jié)果的經(jīng)歷…
以Instagram為例:當(dāng)你進(jìn)入沒有添加任何照片的收藏夾時(shí),你可能會(huì)看到一個(gè)空狀態(tài),并告訴你還沒有添加任何照片。
由于沒有數(shù)據(jù)內(nèi)容,因此只能展示空狀態(tài)或無(wú)數(shù)據(jù)。
Instagram的空白狀態(tài)
但是,Instagram的收藏頁(yè)面并沒有空狀態(tài)說明,相反,它是空白的頁(yè)面。因此,他們錯(cuò)過了一次引導(dǎo)用戶去與APP互動(dòng)的機(jī)會(huì)。
設(shè)計(jì)空狀態(tài)的原因多種多樣,最常見的原因有以下幾種:
1、用戶清空了所有的數(shù)據(jù)(如:清空收件箱);
2、用戶是新用戶,并且剛剛才登錄APP成功;
3、用戶遇到了某種錯(cuò)誤(如:沒有WIFI連接)。
使用空狀態(tài)的好處
Spotify的用戶體驗(yàn)專家Tamara Hilmes提醒設(shè)計(jì)師們時(shí)說,空狀態(tài)是一個(gè)展示產(chǎn)品個(gè)性化的機(jī)會(huì),因此,在進(jìn)行空狀態(tài)設(shè)計(jì)時(shí),需要認(rèn)真考慮品牌和用戶的目標(biāo)和背景。
Deliveroo的產(chǎn)品設(shè)計(jì)師Ryan Cordell同意Tamara Hilmes的觀點(diǎn),并進(jìn)一步說:
“設(shè)計(jì)好文字和視覺界面,是產(chǎn)品與用戶互動(dòng)并最終實(shí)現(xiàn)他們目標(biāo)的關(guān)鍵一步。設(shè)計(jì)團(tuán)隊(duì)?wèi)?yīng)該投入足夠多的時(shí)間、耐心和精力來(lái)設(shè)計(jì)任何場(chǎng)景下的文案?!?/p>
同樣,即使不是特別重要的頁(yè)面,告知用戶下一步如何操作也有著不錯(cuò)的效果。如果不這樣做,空狀態(tài)就不能提供任何價(jià)值,其也就成為了化妝品添加劑,毫無(wú)用處。
空狀態(tài)設(shè)計(jì)的最佳案例
如果你打算設(shè)計(jì)一個(gè)空狀態(tài),那么請(qǐng)記住這些好的做法,以便能夠幫助到用戶去達(dá)到他們的目標(biāo)。
告訴用戶該怎么做
如上所述,空狀態(tài)是鼓勵(lì)用戶與產(chǎn)品互動(dòng)的絕佳機(jī)會(huì),你也不希望把用戶進(jìn)入頁(yè)面后,一臉茫然而不知所措。
例如,你可以在空狀態(tài)頁(yè)面上放一個(gè)具有引導(dǎo)性的按鈕,以一款剛下載的社交APP為例來(lái)說明。
這款A(yù)PP有通訊錄標(biāo)簽,但目前是空的。一個(gè)好的引導(dǎo)性按鈕可以告訴用戶去查找并添加自己的朋友,這樣能夠讓他們也參與到你的APP中。你的引導(dǎo)能夠完整的告訴用戶,如何把空空的通訊錄轉(zhuǎn)變成好友眾多的頁(yè)面,可以看看Facebook是如何做的(上圖)?
空狀態(tài)要保持個(gè)性化
空狀態(tài)設(shè)計(jì)中,個(gè)性與絕望、無(wú)畏和欲望之間有著非常細(xì)微的界限,若無(wú)法很好的平衡這兩者之間的關(guān)系,就會(huì)把展示品牌個(gè)性變成了展示絕望、無(wú)畏和欲望啦。
但是,空狀態(tài)設(shè)計(jì)僅僅只是產(chǎn)品展示個(gè)性化的一個(gè)小例子,個(gè)性并不總代表著有趣,為頁(yè)面添加幽默的元素時(shí),需要格外謹(jǐn)慎。某個(gè)笑話在今天可能很受歡迎,但是明天就會(huì)有用戶不再喜歡了,給人以過時(shí)的感受。
在空狀態(tài)設(shè)計(jì)中,使用友好且合適的文案能夠帶來(lái)意外的效果。兼具特制和適合特性的插圖,可以幫助你設(shè)計(jì)出一個(gè)成功的空狀態(tài)。
如果你決定要使用插圖和文案,請(qǐng)確保它們要有層次感,不會(huì)相互影響。一個(gè)好的插圖能夠?yàn)轫?yè)面帶來(lái)足夠的樂趣和參與度,此時(shí),你可以使用簡(jiǎn)單且常用的文案。來(lái)看看Google是如何平衡兩者之間的關(guān)系的?
Google的Material Design 指南中規(guī)定,如果打算使用圖片,請(qǐng)遵循以下規(guī)則:
1、使用中性或幽默的語(yǔ)氣;
2、與產(chǎn)品的品牌風(fēng)格保持一致
文案需要遵循的規(guī)則:
1、文案?jìng)鬟_(dá)出有用的信息;
2、在不需要操作的情況下,告訴用戶頁(yè)面的作用。
使用空狀態(tài)來(lái)培養(yǎng)用戶
你可以使用空狀態(tài)來(lái)告知用戶如何使用產(chǎn)品,空狀態(tài)在用戶首次體驗(yàn)產(chǎn)品時(shí)扮演著重要角色。
如果你想留住用戶,那么良好的首次體驗(yàn)是至關(guān)重要的,這有利于構(gòu)建產(chǎn)品與用戶之間持久的關(guān)系。
近期更新
- [2023-07-26 14:17:28] 為品牌賦能,海外官網(wǎng)品牌數(shù)字化
- [2023-05-06 10:32:26] 青島網(wǎng)站建設(shè)公司,高端網(wǎng)站定制,一站式網(wǎng)站服務(wù)——力圖數(shù)字科技
- [2023-04-27 13:47:54] 高端定制網(wǎng)站建設(shè)——從滿足預(yù)期到走向卓越
- [2023-04-11 09:17:49] H5頁(yè)面設(shè)計(jì)開發(fā)——移動(dòng)端傳播利器
- [2022-11-16 10:11:43] windows2012程序在哪
- [2022-04-14 11:01:47] 力圖數(shù)字科技配套網(wǎng)站服務(wù)支持
- [2021-05-18 10:14:11] 青島網(wǎng)站建設(shè)的流程
- [2021-04-29 10:14:38] 企業(yè)定制化官網(wǎng)建設(shè)項(xiàng)目
- [2021-03-05 10:34:45] 移動(dòng)互聯(lián)時(shí)代房地產(chǎn)行業(yè)的微信小程序解決方案
- [2021-01-22 17:29:38] 微信小程序有哪些優(yōu)勢(shì)?為什么要開發(fā)微信小程序?
- [2021-01-08 17:28:04] 網(wǎng)站建設(shè)最容易忽略的人性化設(shè)計(jì)
- [2020-12-16 16:55:32] 建設(shè)一個(gè)常規(guī)的公司網(wǎng)站建設(shè)成本大概是多少?
延伸閱讀
- [2008-08-25 11:38:00] 向左還是向右,向上還是向下?
- [2008-12-15 08:38:00] 博客信息架構(gòu)的優(yōu)化建議
- [2008-09-05 12:08:00] Design IT.(2),關(guān)于好設(shè)計(jì)
- [2011-10-29 21:32:03] Yahoo!英文雅虎站長(zhǎng)工具聯(lián)姻微軟bing
- [2008-12-20 17:15:00] 什么是留言和評(píng)論,留言和評(píng)論的價(jià)值
- [2019-05-14 11:09:21] 青島網(wǎng)站設(shè)計(jì)公司哪家好
- [2008-12-11 17:53:00] facebook能成為網(wǎng)絡(luò)身份證嗎?
- [2014-09-19 01:35:08] fckeditor 圖片插入出現(xiàn)空格
- [2009-01-19 14:50:00] 社會(huì)化電子商務(wù),淘寶行嗎?
- [2008-08-14 16:13:00] 注冊(cè)表單中出錯(cuò)字段排行榜
- [2008-10-18 17:08:00] 給鏈接一個(gè)添加下劃線的理由
- [2009-03-09 08:48:00] 項(xiàng)目反思
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計(jì)解決方案 機(jī)械行業(yè)網(wǎng)站設(shè)計(jì)解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 科技企業(yè)網(wǎng)站設(shè)計(jì)解決方案 電子家電網(wǎng)站設(shè)計(jì)解決方案 食品行業(yè)網(wǎng)站設(shè)計(jì)解決方案 集團(tuán)公司網(wǎng)站設(shè)計(jì)解決方案 企事業(yè)單位網(wǎng)站設(shè)計(jì)解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 健身運(yùn)動(dòng)網(wǎng)站設(shè)計(jì)解決方案 美容與化妝品網(wǎng)站設(shè)計(jì)解決方案 建筑設(shè)計(jì)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 物流行業(yè)網(wǎng)站設(shè)計(jì)解決方案
TAGS關(guān)鍵字
蘋果系統(tǒng) 手機(jī)網(wǎng)站建設(shè) 網(wǎng)站制作 青島輪胎網(wǎng)站設(shè)計(jì)公司 青島好的網(wǎng)站優(yōu)化公司 版面布局 網(wǎng)站建設(shè)的步驟有哪些 官網(wǎng)建設(shè) 網(wǎng)站設(shè)計(jì) 微信小程序 網(wǎng)站策劃 青島黃島、紅島網(wǎng)站建設(shè)公司 程序開發(fā) 扁平化設(shè)計(jì) 搜索引擎 php程序 青島flash網(wǎng)站 網(wǎng)站開發(fā) H5 SEO 營(yíng)銷型網(wǎng)站建設(shè) 新的元素 css 微網(wǎng)站 交互設(shè)計(jì) 良好的導(dǎo)航 企業(yè)網(wǎng)站 外貿(mào)網(wǎng)站設(shè)計(jì) 青島網(wǎng)站制作 用戶界面