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