創(chuàng)業(yè)投資服務(wù)平臺(tái)

創(chuàng)投時(shí)報(bào)LOGO

遵循這4步設(shè)計(jì)應(yīng)用啟動(dòng)頁(yè)面,讓用戶愛上你的APP

617人瀏覽 / 0人評(píng)論

從App Store誕生伊始,蘋果就一直在強(qiáng)調(diào)他們的一個(gè)觀念,那就是應(yīng)用的啟動(dòng)圖像(也就是桌面上所有應(yīng)用在打開時(shí)應(yīng)該短暫顯示的一個(gè)圖像),必須是一個(gè)處于中心位置的圖像,而且不能有其他的東西。如果你仔細(xì)閱讀了蘋果的人機(jī)界面指南,那么你一定注意到了這一點(diǎn)。

應(yīng)用的圖像應(yīng)該在iOS屏幕上盡可能的簡(jiǎn)潔。這樣的圖像能夠?yàn)橛脩籼峁┝己玫母杏X,讓他們覺得你的應(yīng)用響應(yīng)迅速、準(zhǔn)確。在打開你的應(yīng)用之后,應(yīng)用的第一屏要立刻代替啟動(dòng)圖像出現(xiàn)在屏幕上?!O果人機(jī)界面設(shè)計(jì)指南對(duì)于應(yīng)用啟動(dòng)圖像的要求。

然而現(xiàn)在的問(wèn)題是,幾乎每一個(gè)人,包括我自己,都沒有注意到這個(gè)指南對(duì)于應(yīng)用啟動(dòng)圖像設(shè)計(jì)的要求。如果你很好奇這個(gè)問(wèn)題究竟有多普遍,你可以看看上圖的例子,或者是關(guān)掉后臺(tái)中的所有應(yīng)用進(jìn)程,并且重新打開這些應(yīng)用。我相信,你會(huì)發(fā)現(xiàn)有許多應(yīng)用其實(shí)并沒有遵循蘋果的這個(gè)要求。

更糟糕的是,有許多開發(fā)人員其實(shí)同意蘋果的這個(gè)看法(誰(shuí)不希望給用戶留下一個(gè)響應(yīng)快速、準(zhǔn)確的印象呢?),但是在實(shí)際的應(yīng)用開發(fā)過(guò)程當(dāng)中,我們很多人都會(huì)忽略這個(gè)要求,或者只是為第一次使用應(yīng)用的用戶提供了啟動(dòng)圖像。在我日常的咨詢工作中,我也會(huì)發(fā)現(xiàn)許多公司忽略了這個(gè)東西,當(dāng)他們了解到啟動(dòng)圖像的作用之后,他們都會(huì)愛上這個(gè)東西。

一些應(yīng)用開發(fā)人員則了解到了啟動(dòng)圖像的重要性,他們甚至更進(jìn)一步,用一些動(dòng)畫和視頻來(lái)代替啟動(dòng)圖像。2010年的時(shí)候,我就用這種方式打造了我的日歷應(yīng)用Free Time。對(duì)此,我和我的團(tuán)隊(duì)都感到非常自豪。

Free Time啟動(dòng)動(dòng)畫,2011年

如果你看了視頻,你就會(huì)發(fā)現(xiàn),在打開這個(gè)應(yīng)用之后,你會(huì)看到一個(gè)非常好看的動(dòng)畫,很多人在第一次看到這個(gè)動(dòng)畫之后,都表示他們非常喜歡它。但是并不是當(dāng)你每一次打開應(yīng)用的時(shí)候,你都會(huì)看到那些云彩和那張圖片,然后再過(guò)渡到應(yīng)用的主體界面中。雖然這個(gè)動(dòng)畫很可愛,但是用戶看多了馬上就會(huì)對(duì)它失去興趣。

商標(biāo)啟動(dòng)圖像只會(huì)浪費(fèi)時(shí)間,并且阻礙用戶的使用體驗(yàn)。

蘋果說(shuō)的沒錯(cuò),我們不應(yīng)該忽略他們的指導(dǎo),因?yàn)槟切╊愃茝V告的啟動(dòng)圖像只有當(dāng)用戶第一次看到的時(shí)候才會(huì)讓他們感到有意思。如果每一次啟動(dòng)應(yīng)用都會(huì)看到他們,用戶只會(huì)感到厭煩,在最極端的情況下,用戶甚至?xí)艞壚^續(xù)使用這個(gè)應(yīng)用。

這個(gè)錯(cuò)誤,不僅僅是2010年出現(xiàn)的應(yīng)用犯過(guò),甚至是今天出現(xiàn)的應(yīng)用也在犯。例如,F(xiàn)ood Network的最新一次應(yīng)用升級(jí)(這個(gè)應(yīng)用幾周前剛剛被蘋果推薦過(guò),因此挑挑他們的毛病也不算過(guò)分)。

每一次當(dāng)你啟動(dòng)應(yīng)用的時(shí)候,都會(huì)看到這個(gè)視頻(要知道它足足有5秒那么長(zhǎng))!

在一段時(shí)間的使用之后,我甚至開始感覺這個(gè)應(yīng)用變慢了,但是我心里其實(shí)知道這僅僅是一個(gè)錯(cuò)覺,它其實(shí)是一個(gè)制作精良的應(yīng)用。而造成這種錯(cuò)覺的罪魁禍?zhǔn)?,就是那段視頻??纯碅pp Store里的用戶評(píng)論,你就知道有這種感覺的不僅僅是我一個(gè)人而已。上一次我查看的時(shí)候,這個(gè)應(yīng)用的評(píng)分為4.5星,但是評(píng)論中有很多人都在抱怨那段視頻是在浪費(fèi)用戶的時(shí)間。

我們算一個(gè)有趣的數(shù)字,這個(gè)應(yīng)用平均5.5秒被啟動(dòng)一次,它的用戶數(shù)量達(dá)到了100萬(wàn)人。就算這些人每周啟動(dòng)3次這個(gè)應(yīng)用,這意味著,在接下來(lái)的一年中,這個(gè)應(yīng)用將會(huì)浪費(fèi)人類820,000,000秒的時(shí)間。換句話說(shuō),在未來(lái)12個(gè)月中,F(xiàn)ood Network的應(yīng)用將會(huì)浪費(fèi)我們總共26年的時(shí)間。

為品牌冠名啟動(dòng)屏幕找到解決方式

很多年來(lái),我自己也并不是十分在意蘋果的啟動(dòng)圖像設(shè)計(jì)指南,但是如今我已經(jīng)認(rèn)識(shí)到了它的重要性,因?yàn)樵谶@份指南中我找到了最好的設(shè)計(jì)方式,甚至可以說(shuō)我進(jìn)入到了一個(gè)全新的世界中。在這個(gè)世界里,開發(fā)人員可以展示自己的品牌,而蘋果也能維持良好的應(yīng)用體驗(yàn)。

如果你覺得按照以下指南,你只能設(shè)計(jì)出無(wú)聊的應(yīng)用啟動(dòng)圖像,你一點(diǎn)錯(cuò)都沒有。記住,啟動(dòng)圖像其實(shí)無(wú)法為你創(chuàng)造更多的機(jī)遇,它的作用只是提升用戶的使用體驗(yàn),讓他們感覺應(yīng)用的響應(yīng)迅速而準(zhǔn)確?!O果人機(jī)界面設(shè)計(jì)指南對(duì)于應(yīng)用啟動(dòng)圖像的要求。

我們開發(fā)的應(yīng)用啟動(dòng)動(dòng)畫, 目的非常明確:

1 獲得我們需要的用戶授權(quán)(使用設(shè)備日歷和通知功能)

2 立刻消失(一些應(yīng)用的登錄體驗(yàn)簡(jiǎn)直慢的讓人難以接受)

3 讓第一次使用應(yīng)用的用戶感到高興,但是嚴(yán)格遵守蘋果UX的規(guī)定

如今的扁平化UI的趨勢(shì),能夠讓應(yīng)用開發(fā)人眼在設(shè)計(jì)應(yīng)用啟動(dòng)圖像和動(dòng)畫的時(shí)候更好的遵守蘋果的人機(jī)設(shè)計(jì)指南。

在以前的iOS版本中,擬物化的設(shè)計(jì)讓遵守設(shè)計(jì)指南變得非常困難。但是如今的扁平化導(dǎo)航欄能夠輕松的通過(guò)鋪平整個(gè)屏幕,變身為過(guò)渡動(dòng)畫的畫布。而且更好的是,這種過(guò)渡一點(diǎn)都不突兀,而且非常自然。

下圖展示了用戶在打開Free Time之后所看到啟動(dòng)動(dòng)畫的過(guò)渡:

制作應(yīng)用啟動(dòng)圖像或是動(dòng)畫其實(shí)很簡(jiǎn)單,只需要遵從以下4步:

1 如果你的應(yīng)用中有頂部導(dǎo)航欄或是分頁(yè)條,你要用純色,然后按照蘋果的規(guī)定創(chuàng)建一個(gè)簡(jiǎn)潔的啟動(dòng)圖像。

2 在第一次啟動(dòng)的時(shí)候,通過(guò)動(dòng)畫效果從上到下擴(kuò)展導(dǎo)航欄,讓它成為應(yīng)用啟動(dòng)圖像的“背景畫布”。

3 在這個(gè)界面上展示你的商標(biāo),并且向用戶索取授權(quán),歡迎用戶,然后立刻消失。

4 通過(guò)動(dòng)畫讓“畫布”變小,重新變成導(dǎo)航欄,然后讓界面過(guò)渡到應(yīng)用第一屏。

如果采取了這樣的設(shè)計(jì),你的用戶將會(huì)非常高興,他們根本不會(huì)有被打擾到的感覺。同時(shí),他們還會(huì)覺得你的應(yīng)用響應(yīng)迅速、準(zhǔn)確,然后不斷的使用你的應(yīng)用。

對(duì)你,對(duì)用戶,這都是一個(gè)雙贏的結(jié)果。

(編輯:Zoey)

全部評(píng)論