移動(dòng)應(yīng)用的＂空＂狀態(tài)界面設(shè)計(jì)

“空狀態(tài)”是指移動(dòng)應(yīng)用界面在沒(méi)有內(nèi)容或數(shù)據(jù)時(shí)呈現(xiàn)出的狀態(tài)。長(zhǎng)久以來(lái)，空狀態(tài)界面一直是被忽視的，因?yàn)樵O(shè)計(jì)師們通常會(huì)將全部精力集中在怎樣更好的呈現(xiàn)內(nèi)容和數(shù)據(jù)上，只有開發(fā)人員才會(huì)比較頻繁的與這類相對(duì)“意外”的狀態(tài)打交道。也正是因?yàn)檫@樣的原因，空狀態(tài)界面留給用戶的印象大體上就是晦澀難懂的文案以及缺乏視覺(jué)設(shè)計(jì)風(fēng)格。

　　要想打造好的整體體驗(yàn)，作為設(shè)計(jì)師，我們不能放過(guò)任何一個(gè)用戶有可能接觸到的界面狀態(tài)?？諣顟B(tài)界面大致包括三種類型：初次使用、用戶清空數(shù)據(jù)、出錯(cuò)。下面，我們就來(lái)一同了解一下這三種情境所對(duì)應(yīng)的相關(guān)創(chuàng)意要素與注意事項(xiàng)。

1.初次使用

　　應(yīng)用在初次加載時(shí)留給用戶的第一印象是非常重要的。你的一部分用戶也許已經(jīng)通過(guò)其他同類產(chǎn)品建立起了心智模型及預(yù)期，他們會(huì)非常敏感的從一開始就將你的應(yīng)用與他們已經(jīng)熟悉的那些進(jìn)行對(duì)比;而另外一些用戶可能完全沒(méi)有同類產(chǎn)品的使用經(jīng)驗(yàn)，他們就像一張空白的花布，等待著驚喜或失望。無(wú)論哪種情況，差勁的第一印象所造成的損害都是很難彌補(bǔ)的。

　　如果用戶下載了你的應(yīng)用并完成了注冊(cè)，那么這幾乎可以代表他們已經(jīng)知道你的產(chǎn)品是做什么用的，但未必清楚具體怎樣使用。對(duì)于某些類型的應(yīng)用來(lái)說(shuō)，初次登錄之后是沒(méi)有任何數(shù)據(jù)內(nèi)容的，這也正是充分利用界面空間為用戶提供新手指引的好機(jī)會(huì)。你可以告訴用戶為什么當(dāng)前沒(méi)有內(nèi)容、怎樣創(chuàng)建或獲取內(nèi)容;在這個(gè)環(huán)節(jié)中，不妨試著融入一些能夠體現(xiàn)產(chǎn)品個(gè)性的情感化元素，這可以使用戶進(jìn)入一種較為輕松的上手狀態(tài)，引發(fā)他們積極正面的情感，同時(shí)也能給他們留下不錯(cuò)的第一印象。

　　看看Buffer、Timehop和Dropbox是怎么做的叭。值得一提的是，Buffer與Dropbox的空狀態(tài)界面與他們各自的Web端頁(yè)面(bufferapp.com以及dropbox的登錄頁(yè))在引導(dǎo)與插圖等方面都使用了相同風(fēng)格的視覺(jué)元素，這也體現(xiàn)出了他們的產(chǎn)品與品牌形象在不同平臺(tái)上的良好一致性。

　　buffer

　　Timehop

　　Dropbox(真的很暖心的趕腳，我喜歡 - 譯者C7210)

     2.用戶清空數(shù)據(jù)

　　想想郵件或信息的收件箱，多數(shù)時(shí)候是滿的叭，里面有幾百封未讀郵件也不奇怪。不過(guò)不同類型的用戶有著不同的需求和用法，有些人確實(shí)會(huì)閱讀其中的大部分內(nèi)容。

　　不管你是哪類用戶，其實(shí)我們?cè)谛睦锘蚨嗷蛏俣紩?huì)有將“待處理對(duì)象”歸零的欲望(回想一下你看到App Store圖標(biāo)右上角的待更新應(yīng)用數(shù)量圖標(biāo)時(shí)的趕腳)。從這個(gè)角度講，將待處理信息進(jìn)行歸零其實(shí)是一種沒(méi)有太多實(shí)際意義但卻很容易花費(fèi)時(shí)間精力進(jìn)行操作的任務(wù)，有時(shí)人們做這件事只是出于那一點(diǎn)點(diǎn)強(qiáng)迫癥。這種時(shí)候，不妨給他們一點(diǎn)正面的情緒回饋，在空狀態(tài)界面中給這些用戶一點(diǎn)小小的“回報(bào)”。

　　下面我們來(lái)看看Sparrow、Gmail以及iOS原生的郵件客戶端在這方面的做法。

　　當(dāng)郵件被清空之后，Sparrow會(huì)在界面中展示一個(gè)傳統(tǒng)“收件箱”的圖標(biāo)，下面的標(biāo)題是“零郵件”，形象、干凈、簡(jiǎn)單，多少可以讓人產(chǎn)生一點(diǎn)沒(méi)有多大實(shí)際意義的成就感。

　　Gmail則在這種最基本的做法之上又進(jìn)了一步，他們的設(shè)計(jì)師在空收件箱頁(yè)面中放了一個(gè)微笑著的太陽(yáng)，通過(guò)對(duì)人類情緒的模仿，為產(chǎn)品賦予了人格，使用戶從情感上感受到愉悅。而且他們?cè)谖陌傅奶幚砩弦埠苜N心：“你當(dāng)前沒(méi)有郵件要處理了，開心的享受這一天叭!”

　　在這里強(qiáng)烈推薦閱讀“為產(chǎn)品賦予人格 - 情感化設(shè)計(jì)的組成要素及實(shí)踐案例”一文。

        而相比之下，iOS自帶的郵件應(yīng)用就缺乏這方面的積極回饋了，用戶在這個(gè)空狀態(tài)界面中很容易產(chǎn)生疑慮：我是否已經(jīng)真的清空了收件箱，還是我的網(wǎng)絡(luò)連接有問(wèn)題?或是別的什么狀況導(dǎo)致我看不到收件箱里的其他郵件?任何一點(diǎn)疑慮都會(huì)導(dǎo)致認(rèn)知上的負(fù)擔(dān)，進(jìn)而影響產(chǎn)品的整體體驗(yàn)。

3.出錯(cuò)

　　“出錯(cuò)”多數(shù)是由網(wǎng)絡(luò)連接的中斷引起的?？梢栽囍谶@種情況下提供一些更有用的或是更具親和力的內(nèi)容，而不是一堆丑陋的出錯(cuò)信息。讓用戶在非常規(guī)用例中看到你的設(shè)計(jì)，他們就會(huì)感知到當(dāng)前的狀況是在可預(yù)計(jì)范圍之內(nèi)的，從而放松下來(lái)。

　　接下來(lái)我們對(duì)比一下Chrome、Opera Mini和Safari這三款瀏覽器在這方面的表現(xiàn)叭。

　　Chrome提供了大量的、似乎只有技術(shù)人員才看得懂的出錯(cuò)信息;普通用戶甚至不會(huì)有興趣花時(shí)間在移動(dòng)設(shè)備上閱讀這樣的內(nèi)容。

　　Opera Mini只提供了一個(gè)模態(tài)對(duì)話框一樣的控件，整個(gè)風(fēng)格看上去非常生硬，不過(guò)文案相對(duì)簡(jiǎn)單易懂了些。

　　而Safari的處理方式則漂亮了很多，它通過(guò)簡(jiǎn)單直白的語(yǔ)言向用戶解釋了當(dāng)前的狀況，整個(gè)界面的視覺(jué)風(fēng)格似乎是有意在柔化“出錯(cuò)”所帶來(lái)的負(fù)面效應(yīng)。當(dāng)發(fā)生網(wǎng)絡(luò)連接問(wèn)題時(shí)，人們很容易產(chǎn)生非常消極的感受，這種情況下，最不該做的就是通過(guò)大段晦澀的文字以及生硬的視覺(jué)風(fēng)格來(lái)加劇用戶的焦慮感。

　　當(dāng)然，出錯(cuò)的情況不止會(huì)發(fā)生在瀏覽器當(dāng)中。再次以Gmail的iPhone客戶端為例，他們同樣使用了情感化的元素來(lái)呈現(xiàn)出錯(cuò)信息——一個(gè)看上去不那么開心的小云朵——似乎應(yīng)用自身也很理解用戶當(dāng)前的感受。

　　相比之下，Instagram和Youtube的反饋方式在態(tài)度上略顯消極。

總結(jié)

　　其實(shí)，無(wú)論你的產(chǎn)品是否需要網(wǎng)絡(luò)連接，或者它根本就不是iOS應(yīng)用，這當(dāng)中的一些基本道理都是相通的：留意那些用戶無(wú)法獲取任何內(nèi)容的狀態(tài)，給用戶某種形式的反饋。我們進(jìn)一步將本文內(nèi)容抽象為三條簡(jiǎn)單的設(shè)計(jì)原則：

沒(méi)有數(shù)據(jù)時(shí)，引導(dǎo)用戶創(chuàng)建內(nèi)容。

思考目標(biāo)用戶在使用產(chǎn)品時(shí)的心理與目標(biāo)。他們是否會(huì)頻繁的清空數(shù)據(jù)?如果是的話，進(jìn)行相應(yīng)的設(shè)計(jì);你甚至可以準(zhǔn)備一些不同的空狀態(tài)內(nèi)容來(lái)隨機(jī)展示。

發(fā)生錯(cuò)誤時(shí)，不要讓用戶進(jìn)一步焦慮。通過(guò)你的設(shè)計(jì)弱化用戶心中的負(fù)面感受，降低他們對(duì)壞狀況的感知。

新聞名稱：移動(dòng)應(yīng)用的＂空＂狀態(tài)界面設(shè)計(jì)
轉(zhuǎn)載來(lái)源：http://www.muchs.cn/news30/171830.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供靜態(tài)網(wǎng)站、App開發(fā)、網(wǎng)站制作、用戶體驗(yàn)、營(yíng)銷型網(wǎng)站建設(shè)、微信公眾號(hào)

廣告

聲明：本網(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)