啟動(dòng)頁(yè)的作用很多,在緩解用戶(hù)等待焦慮的同時(shí),也能夠通過(guò)啟動(dòng)頁(yè)來(lái)奠定品牌的基調(diào)或者實(shí)現(xiàn)商業(yè)價(jià)值,其重要性可見(jiàn)一斑。
首先簡(jiǎn)要的概括一下什么是啟動(dòng)頁(yè):每次喚起一個(gè)app的時(shí)候,在進(jìn)入app首頁(yè)之前的等待頁(yè)面。
文章目錄如下:
啟動(dòng)頁(yè)設(shè)計(jì)目的
啟動(dòng)頁(yè)分類(lèi)及樣式
啟動(dòng)頁(yè)邏輯及細(xì)節(jié)
當(dāng)用戶(hù)點(diǎn)開(kāi)app時(shí),需要對(duì)于app內(nèi)的素材進(jìn)行加載,比如說(shuō)加載圖片信息等等,為了給用戶(hù)呈現(xiàn)一個(gè)完整友好的app界面,這個(gè)加載素材的過(guò)程需要一定的時(shí)間,為了讓用戶(hù)在等待這一小段時(shí)間的時(shí)候減少一些困惑,啟動(dòng)頁(yè)這個(gè)模塊就應(yīng)然而生了。
剛才提到的困惑會(huì)有很多種,比如說(shuō)用戶(hù)在知道app啟動(dòng)需要等待時(shí)間的情況下,啟動(dòng)頁(yè)可以減少用戶(hù)因?yàn)榈却龁?dòng)時(shí)間而產(chǎn)生的無(wú)聊的情緒;用戶(hù)也極有可能不知道app啟動(dòng)需要等待時(shí)間,如果沒(méi)有啟動(dòng)頁(yè)這樣一個(gè)模塊,會(huì)讓用戶(hù)產(chǎn)生很大的困惑,我的手機(jī)卡死了嗎?還是這個(gè)app有問(wèn)題?等等…
啟動(dòng)頁(yè)大致可以分為以下四類(lèi):
第一類(lèi):品牌展示
這類(lèi)是最常見(jiàn)的,在啟動(dòng)頁(yè)展示的信息包括app名稱(chēng)、icon及slogan,界面簡(jiǎn)單清晰,加深用戶(hù)對(duì)于品牌的認(rèn)知,整體的顏色風(fēng)格也遵從app界面的設(shè)計(jì)風(fēng)格,讓用戶(hù)提前熟悉app的樣式風(fēng)格。
第二類(lèi):廣告展示、活動(dòng)展示
這一類(lèi)中包含廣告展示和活動(dòng)展示兩個(gè)小類(lèi),廣告展示對(duì)外,app與廣告商家談好合作,在app的啟動(dòng)頁(yè)展示廣告商家的廣告信息,當(dāng)此app積累下來(lái)的流量已經(jīng)形成一定的規(guī)模,足夠進(jìn)行分發(fā)的時(shí)候,可以用這種廣告展示的方法進(jìn)行流量的變現(xiàn),通常使用這類(lèi)啟動(dòng)頁(yè)方式的app為通過(guò)廣告作為變現(xiàn)的一種方式的app。常見(jiàn)的如網(wǎng)易系列的產(chǎn)品。活動(dòng)展示對(duì)內(nèi),如app內(nèi)一些運(yùn)營(yíng)的活動(dòng)需要進(jìn)行推廣,app啟動(dòng)頁(yè)就承擔(dān)了這個(gè)職責(zé),在用戶(hù)第一時(shí)間進(jìn)入這個(gè)app的時(shí)候就能看見(jiàn)app的活動(dòng)有哪些。
第三類(lèi):內(nèi)容展示
這一類(lèi)較前兩種來(lái)說(shuō)比較少見(jiàn),啟動(dòng)頁(yè)的內(nèi)容與app的內(nèi)容相關(guān)聯(lián),不僅僅展示出app的活動(dòng),同時(shí)也會(huì)摻雜進(jìn)app自身的設(shè)計(jì)元素在里面。如圖蟲(chóng)網(wǎng)app,一個(gè)攝影朋友圈,在啟動(dòng)頁(yè)的展示內(nèi)容就是用戶(hù)上傳的優(yōu)質(zhì)攝影,這樣不僅僅符合自身的攝影元素,同時(shí)保持了啟動(dòng)頁(yè)的格調(diào)美感,還向用戶(hù)提前展示了優(yōu)質(zhì)的原創(chuàng)內(nèi)容。
第四類(lèi):背景底色
這一類(lèi)也是比較少見(jiàn),啟動(dòng)頁(yè)主體顏色樣式采用和app首頁(yè)相同的顏色樣式,目的是在于讓用戶(hù)提前熟悉一下app的頁(yè)面風(fēng)格,這種啟動(dòng)頁(yè)符合啟動(dòng)頁(yè)設(shè)計(jì)的初衷,既然最初啟動(dòng)頁(yè)的目的是為了讓用戶(hù)不那么無(wú)聊,那么就在這一小段時(shí)間里,提前讓用戶(hù)從視覺(jué)上熟悉了解一下app的框架。
在AppStore上排名前一百名的app里面,我人工的統(tǒng)計(jì)了一下每個(gè)app的啟動(dòng)頁(yè)樣式及分類(lèi),如上圖展示。
由此可以看出,品牌展示占了絕大多數(shù),現(xiàn)在主流的app都是以輸出自己的品牌文化為主,更加注重自己的風(fēng)格調(diào)性;其次是活動(dòng)廣告類(lèi),主要是以網(wǎng)易的產(chǎn)品為主,都是用的同樣的框架。
值得注意的一點(diǎn),有3款app沒(méi)有自己的啟動(dòng)頁(yè),這三款都是美化拍攝類(lèi)的app,faceu、美顏相機(jī)等,這類(lèi)APP的用戶(hù)打開(kāi)應(yīng)用的主要目的是美妝自拍,更急迫的想直接使用app提供的功能,外加上首頁(yè)進(jìn)來(lái)就是自拍,都是本地的參數(shù),不需要去服務(wù)器調(diào)取參數(shù),所以就免去了啟動(dòng)頁(yè)的功能。
這里就列舉最常用的兩類(lèi)啟動(dòng)頁(yè)類(lèi)型:品牌展示、活動(dòng)廣告展示,這兩種。
品牌展示
在啟動(dòng)頁(yè)展示的信息包括app名稱(chēng)、icon及slogan,屬于靜態(tài)的啟動(dòng)頁(yè),在一次版本迭代中,app的名稱(chēng)、icon、slogan都是不會(huì)變的,若是上述三點(diǎn)有所改變,那一定會(huì)是一個(gè)新的版本迭代,所以品牌展示類(lèi)型的啟動(dòng)頁(yè),就會(huì)是一張長(zhǎng)寬定好的圖片。在展示啟動(dòng)頁(yè)的過(guò)程中,app向服務(wù)器請(qǐng)求的是app的內(nèi)容,而與啟動(dòng)頁(yè)的內(nèi)容無(wú)關(guān)。
品牌展示類(lèi)型的啟動(dòng)頁(yè)需要注重的細(xì)節(jié),就是視覺(jué)上的樣式問(wèn)題。UI設(shè)計(jì)的事情暫且不做太多討論。在產(chǎn)品上需要注重的細(xì)節(jié)問(wèn)題不多,這里想到的一點(diǎn)就是“跳過(guò)”按鈕。我們?cè)趩?dòng)頁(yè),都會(huì)看到有一個(gè)跳過(guò)的按鈕,這個(gè)按鈕的意義在于,對(duì)于用戶(hù)可以跳過(guò)自己不想看的啟動(dòng)頁(yè)內(nèi)容,對(duì)于app來(lái)說(shuō),首頁(yè)需要的參數(shù)信息已經(jīng)向服務(wù)器請(qǐng)求完畢,可以讓用戶(hù)自己選擇他們停留在啟動(dòng)頁(yè)的時(shí)長(zhǎng)。
活動(dòng)廣告展示
將廣告商家和自己活動(dòng)的信息展示在啟動(dòng)頁(yè)中,屬于動(dòng)態(tài)的啟動(dòng)頁(yè)。每天每時(shí)每刻,啟動(dòng)頁(yè)上展示的內(nèi)容都可能不一樣。在app啟動(dòng)的時(shí)候,不僅僅需要向服務(wù)器請(qǐng)求app首頁(yè)的參數(shù),同時(shí)需要向服務(wù)器請(qǐng)求啟動(dòng)頁(yè)的參數(shù)。現(xiàn)在的活動(dòng)廣告展示,只占了一整個(gè)屏幕的一部分,我們舉個(gè)例子進(jìn)行說(shuō)明。
網(wǎng)易云音樂(lè)的啟動(dòng)頁(yè)樣式如上圖,下方的是本地默認(rèn)模板,在用戶(hù)下載apk包的時(shí)候自帶的。上方的組件是線(xiàn)上讀取廣告,從線(xiàn)上讀取廣告之后,緩存在本地中,每次啟動(dòng)app的時(shí)候展示出來(lái),下次再次啟動(dòng)app的時(shí)候,先向服務(wù)器調(diào)取參數(shù),看看線(xiàn)上有沒(méi)有更新廣告,如果有更新,則需要下載最新一版的,如果沒(méi)有更新,則展示本地緩存的廣告。
活動(dòng)廣告類(lèi)型的啟動(dòng)頁(yè),需要注意的細(xì)節(jié)問(wèn)題就要比品牌展示類(lèi)多得多。主要有兩塊細(xì)節(jié)問(wèn)題,弱網(wǎng)環(huán)境下的下載問(wèn)題、廣告CMS管理。
如果處于弱網(wǎng)或者斷網(wǎng)的情況下,app不能一直請(qǐng)求啟動(dòng)頁(yè)或者app的參數(shù),那樣會(huì)一直停留在啟動(dòng)頁(yè)上沒(méi)有其他的交互,用戶(hù)會(huì)認(rèn)為app卡死了或者手機(jī)出了什么問(wèn)題。所以會(huì)需要一個(gè)下載啟動(dòng)頁(yè)素材的時(shí)間,超過(guò)這段時(shí)間,就要默認(rèn)的播放本地的緩存,以免影響用戶(hù)體驗(yàn)。這樣一來(lái),啟動(dòng)頁(yè)的時(shí)間就被分成兩塊:一是下載素材、回調(diào)參數(shù)的時(shí)間,二是播放啟動(dòng)頁(yè)的時(shí)間。每段時(shí)間都要設(shè)置一個(gè)閾值上限。若超過(guò)這個(gè)閾值上限,就要自動(dòng)的跳過(guò)這個(gè)流程,這樣才能保證啟動(dòng)頁(yè)的流暢及友好的用戶(hù)體驗(yàn)。
第二塊需要注意的細(xì)節(jié)就是廣告CMS管理,我們都遇見(jiàn)過(guò)這個(gè)功能點(diǎn),在啟動(dòng)頁(yè)觀(guān)看廣告的時(shí)候,都會(huì)有一個(gè)“跳過(guò)”按鈕,點(diǎn)擊跳過(guò),進(jìn)入app首頁(yè)。淺顯的剖析一下“跳過(guò)”按鈕功能點(diǎn),我們可以快速的找到它的設(shè)計(jì)原因,用戶(hù)覺(jué)得廣告太過(guò)于枯燥,或者更想快速的使用app,就會(huì)點(diǎn)擊跳過(guò)。如果能對(duì)廣告商家提供的廣告搭建一個(gè)CMS管理中心,對(duì)廣告進(jìn)行打標(biāo)簽處理,再根據(jù)用戶(hù)畫(huà)像的分類(lèi),對(duì)不同的用戶(hù)進(jìn)行精準(zhǔn)投遞,通過(guò)這樣的方法延長(zhǎng)用戶(hù)觀(guān)看廣告的平均時(shí)長(zhǎng),使廣告的價(jià)值最大化,對(duì)KPI也有很大的提升。
以上就是自己對(duì)于啟動(dòng)頁(yè)的一點(diǎn)點(diǎn)小的看法,希望各位大佬們批評(píng)指正。
以上就是類(lèi)似于APP頁(yè)面如何優(yōu)雅的設(shè)計(jì)的內(nèi)容,如果想要了解關(guān)于網(wǎng)站品牌推廣及網(wǎng)站建站知識(shí),可直接點(diǎn)擊查看