APP「啟動頁」設(shè)計(jì)中的門道
來源：你是猴子請來的救兵么（ID：tattoo0616）
作者： tattoo616
數(shù)英已獲授權(quán)，轉(zhuǎn)載請聯(lián)系原作者
啟動頁是我們在使用 APP 中比較常見的一個(gè)頁面。作為設(shè)計(jì)我們經(jīng)常會關(guān)注哪家產(chǎn)品的啟動頁設(shè)計(jì)的好看，甚至?xí)滩蛔∪ソ貓D。那么，啟動頁設(shè)計(jì)中有什么門道呢？
今天我們不講如何把啟動頁設(shè)計(jì)的好看，我們講如何把啟動頁設(shè)計(jì)好。
一、為什么要有啟動頁？
蘋果官方對于 iOS 啟動頁的設(shè)計(jì)說明：
為了增強(qiáng)應(yīng)用程序啟動時(shí)的用戶體驗(yàn)，您應(yīng)該提供一個(gè)啟動圖像。啟動圖像與應(yīng)用程序的首屏幕看起來非常相似。當(dāng)用戶在主屏幕上點(diǎn)擊您的應(yīng)用程序圖標(biāo)時(shí)，iPhone OS 會立即顯示這個(gè)啟動圖像。一旦準(zhǔn)備就緒，您的應(yīng)用程序就會顯示它的首屏幕，來替換掉這個(gè)啟動占位圖像。請記住，啟動圖像并不是為您提供機(jī)會進(jìn)行藝術(shù)展示；它完全是為了增強(qiáng)用戶對應(yīng)用程序能夠快速啟動并立即投入使用的感知度。
所以說，啟動頁是為了解決用戶等待時(shí)間，保證用戶使用流暢。
二、啟動頁的分類
以前我們看過的文章大多數(shù)是從設(shè)計(jì)角度來介紹啟動頁的分類，這次我們從產(chǎn)品角度來解析。
從產(chǎn)品的角度來講啟動頁被分為兩種：靜態(tài)與動態(tài)
1、靜態(tài)啟動頁
靜態(tài)啟動頁就是蘋果官方所指的解決用戶等待時(shí)間，保證用戶使用流暢的啟動頁。
通常這個(gè)靜態(tài)啟動頁是由蘋果開發(fā)寫在 APP 當(dāng)中的；而安卓通常情況下不會顯示靜態(tài)啟動頁，而當(dāng) APP 從服務(wù)器獲取動態(tài)啟動頁失敗的時(shí)候，才會啟動靜態(tài)啟動頁。
從設(shè)計(jì)的角度講，通常靜態(tài)啟動頁分為規(guī)范型和品牌推廣型，這也是我們比較常見的。
例如，印象筆記與 Facebook，采用的就是規(guī)范型啟動頁。啟動頁面就是首頁的框架，去掉了里面所有的內(nèi)容。這樣就好像是用戶進(jìn)入了應(yīng)用，它已經(jīng)在加載，感覺非常快速的啟動了，讓用戶覺得應(yīng)用性能好，速度快。通常國外的產(chǎn)品都會采用這種形式的啟動頁。
而淘寶、網(wǎng)易嚴(yán)、喜馬拉雅等產(chǎn)品則采用的是品牌推廣型啟動頁。
這類啟動頁其實(shí)就是在規(guī)范型的基礎(chǔ)上做了一點(diǎn)擴(kuò)展，幫助品牌做一些宣傳。其實(shí)在MD的官方定義中，是允許用戶展示具有品牌特色的啟動頁的，但是在iOS中明確說明是不允許的。不過我們國內(nèi)的產(chǎn)品向來不按套路出牌。
通常品牌推廣類啟動頁會包括LOGO、品牌名稱、Slogan這三個(gè)元素，也有些會加入產(chǎn)品的主形象。
2、動態(tài)啟動頁
動態(tài)啟動頁是由后臺系統(tǒng)上傳的。國內(nèi)大多數(shù) APP 都會把動態(tài)啟動頁做的五花八門、各顯神通。
通常動態(tài)啟動頁的需求都來自運(yùn)營且偏商業(yè)化。例如，節(jié)日促銷、活動宣傳、合作廣告等。
如圖所示，淘寶、網(wǎng)易嚴(yán)選和喜馬拉雅的動態(tài)啟動頁。
三、如何設(shè)計(jì)好啟動頁
這里以國內(nèi)產(chǎn)品為例。我們先說 iOS，當(dāng)我們打開一款 APP 時(shí)，首先啟動的是靜態(tài)啟動頁，然后再顯示動態(tài)啟動頁。也就是說我們要看到兩個(gè)啟動頁，然后才可以進(jìn)入到產(chǎn)品首頁，而這其中有些動態(tài)啟動頁的時(shí)長達(dá)到5秒。
其實(shí)兩個(gè)啟動頁的產(chǎn)品使用體驗(yàn)并不好，那么我們?nèi)绾螌@一問題進(jìn)行優(yōu)化呢？我們先來看看大廠是如何做的~
先說淘寶，淘寶的靜態(tài)啟動頁是一個(gè)用淘寶 logo 設(shè)計(jì)的盒子打開的樣式。而動態(tài)啟動頁展示時(shí)，盒子就合上了，同時(shí)上半部分為活動圖片。
網(wǎng)易嚴(yán)選的啟動頁：
喜馬拉雅的啟動頁：
不難看出它們都有一定的規(guī)律，下面的 logo 基本為固定的樣式。
我們要知道，大多數(shù)用戶是很討厭廣告的，特別是時(shí)間過長的廣告。
這種設(shè)計(jì)方式會讓用戶有一種只是啟動頁上半部分變化的錯(cuò)覺，而并非多了一個(gè)頁面，從而減少因啟動頁過多或過長而帶來的反感。
通常動態(tài)啟動頁的時(shí)長為2~3秒為宜，如果達(dá)到3秒以上建議在動態(tài)啟動頁上加入跳過功能。
有錯(cuò)誤的地方歡迎來指正~~~不強(qiáng)X用戶，從我做起~
- END -
轉(zhuǎn)載請?jiān)谖恼麻_頭和結(jié)尾顯眼處標(biāo)注：作者、出處和鏈接。不按規(guī)范轉(zhuǎn)載侵權(quán)必究。
未經(jīng)授權(quán)嚴(yán)禁轉(zhuǎn)載，授權(quán)事宜請聯(lián)系作者本人，侵權(quán)必究。
本文禁止轉(zhuǎn)載，侵權(quán)必究。
授權(quán)事宜請至數(shù)英微信公眾號(ID: digitaling) 后臺授權(quán)，侵權(quán)必究。
評論
評論
推薦評論
暫無評論哦，快來評論一下吧！
全部評論（0條）