整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
輯導語：關于啟動頁和引導頁，我們在每個APP都可以看到。做好這兩個頁面，是用戶了解產品的基礎一步，也是用戶最先了解產品的第一個窗口。因此，該如何設計啟動頁與引導頁，才能夠吸引他人？作者總結了一些自己的經驗，與你分享。
啟動頁與引導頁設計幾乎是每個APP必備的。
在產品上架前期，設計師們通常會集中設計產品啟動頁與引導頁。啟動頁與引導頁是用戶了解產品的第一個窗口，能給用戶留下初印象~最近剛做完新產品的啟動圖與引導頁設計，分享自己關于做啟動圖、引導頁學到的相關知識與經驗總結，希望對大家有所幫助，歡迎一起交流學習呀~
啟動頁：當用戶打開APP時，在啟動APP的過程中被用戶所看到的過渡頁面或動畫都被稱為啟動頁。
作用：
特點：
啟動頁的形式比較多樣化，但UI設計師在產品上架前期主要還是設計以產品內容或品牌為主的品牌啟動圖，介紹產品核心服務與傳遞品牌，本文主要介紹的是APP品牌啟動圖這種形式。
其他的，比如廣告頁、節日閃屏等運營類的啟動頁形式，我們知道有這種過渡頁面存在就行了，這里就不做過多介紹了。
引導頁：當用戶安裝或更新APP后首次啟動APP時展示的3-5個滑動頁面就是引導頁，幫助用戶更加清晰的了解產品定位與功能服務。
作用：
特點：
啟動圖設計形式啟動圖常見的設計形式有純背景+圖標/slogan、背景圖片、漂浮圖標、品牌滲透這4種形式。
純背景+圖標/slogan在純色背景上，融入產品啟動圖標或產品slogan。這一種是最簡潔也是最經典的啟動圖設計形式。簡單有力的宣傳產品品牌、傳遞產品服務理念、加深用戶對產品印象。
設計小tip：設計這種形式的啟動圖，我們需要注意頁面的視覺平衡。上下比例建議采用0.86:1很多設計師在對齊的時候會直接采用工具的垂直居中，我們可以來對比看一下直接垂直居中與微調后的視覺感受~
很明顯，直接采用垂直居中，上下比例為1:1的話，視覺中心是有些往下掉的；我們需要往上進行調整，達到視覺平衡。NAVER的改版設計中，專門將啟動頁的比例由1:1調整為了0.86:1，讓視覺達到舒適。
背景圖片采用圖片或短視頻作為背景圖。圖片或視頻的選取需要符合產品調性。這種設計形式更加直觀，具有場景感，能帶來更大的共鳴，具有沉浸式體驗。最具代表的就是微信的啟動圖了，僅靠一張圖片就形成了產品的記憶點。
政務類產品啟動圖常選用當地的地標建筑或區域特色作為啟動背景圖。
漂浮圖標將與產品相關的功能服務圖標飄散浮動在整個頁面中。最具代表的就是淘寶的啟動圖。
品牌滲透品牌滲透設計形式是目前市場上應用得最多的。采用插畫、3D等設計手法，結合產品IP形象、品牌符號等與品牌相關的元素進行融合設計，加強品牌推廣，形成品牌記憶。
品牌滲透的設計形式有：a.將品牌圖形與服務場景進行融合設計利用插圖或3d的形式將品牌圖形與功能服務場景相結合，這類設計形式也是比較流行的，既能直觀的展示服務場景又能很好的宣傳品牌。
b.品牌符號因為啟動圖時間特別短，將產品的品牌符號放大或者重復排版，從而加深用戶對產品、品牌的記憶，這也是一個比較討巧的方法。
c.IP形象啟動圖展示產品的IP形象，加強用于與產品IP的鏈接。最經典的就是QQ的企鵝開屏，這么多年都是一直保持這種設計形式。
引導頁動圖設計形式引導頁設計除了幫助用戶更加清晰的了解產品定位與功能服務外，現已成為每個app的儀式感設計。
每次下載新的app后，自己也很期待看到產品的引導頁，通過引導頁來推測整個app的設計調性~引導頁設計內容相對來說比較固定，一般為文案（主副標題）、圖形部分、輪播器、按鈕這四部分。
設計形式也主要為插畫、3D、實景圖片這3種設計形式。
插畫設計形式這是市場上應用得最多的設計形式，分為扁平化插圖與2.5D插圖形式。
3D元素隨著3D設計形式的流行，3D元素在UI設計中越來越常見。3D圖形比扁平化的圖形更加直觀立體、具有場景感，在引導頁中的應用也越來越多。
實景圖片采用實景圖片或視頻形式，讓畫面更具場景感，具有沉浸式體驗。這類設計形式更適合旅游類或短視頻類產品。
一個產品的啟動圖與引導頁設計（特別是啟動圖設計）是很具有代表性的。我們可以從啟動圖與引導頁看出產品的設計調性與服務理念，個人覺得這兩個模塊也是值得設計師花心思做的~
結合產品服務與品牌進行設計方案探索，也是很有趣的。以上就是自己關于啟動圖與引導頁的部分設計見解與解析，歡迎大家多多指教呀~
本文由 @小魚晴子 原創發布于人人都是產品經理。未經許可，禁止轉載
題圖來自Unsplash，基于CC0協議
/張麗 引導頁即是用戶在首次使用軟件時進行產品推介和引導的說明書，使用戶在最短的時間內了解這個軟件的主要功能、操作方式，以便于迅速上手。
引導頁具有指引用戶了解和掌握軟件應用的功能、特性操作方法等作用，根據軟件應用的安裝情況，從位置上一般將引導頁分為前置引導和中間引導。
①前置引導。
所謂前置引導即在用戶安裝完成軟件應用，并第一次打開的時候出現的引導頁，該引導頁一般由2到6頁連續或不連續的相關頁面構成，某些應用引導頁可達10頁。
前置引導是用戶使用軟件應用前所看到的內容，此時用戶對所安裝的產品了解并不多，對于產品的功能、布局、具體操作方法等內容還沒有相關的認知。
所以前置引導擔任的作用主要就在于介紹產品的概況內容、核心功能、比同類產品更具競爭力的功能，以及重要的操作步驟等。
②中間引導。
對于版本更新的軟件應用，采用中間引導是一個常見的選擇。
中間引導往往是對已有版本更新升級后，新功能的一些說明性操作指導。
在第一次使用有新功能出現的頁面或操作中彈出指導性的說明界面，能夠讓用戶快速掌握新功能的使用，而不會因為對新功能的不解造成使用上的困擾。
中間引導在設計中常用比較貼近用戶的俏皮口語進行引導，而非正式官方的書面用語。
因為在使用過程中，用戶往往更傾向于舒適滿意的服務性語言，而不使用說教形式的官方用語。
設計中多用卡通形象進行引導，以對話的方式逐步提示使用戶帶入感更強，更利于引導內容的呈現，避免了用戶的反感。
①合理化原則。
只做必要的內容引導，根據引導頁的目的，出發點不同，大致可以將其分為產品說明類、使用說明類、推廣類和問題解決類。
在設計之初就應該對需要設計的引導頁進行充分分析，從而得出合理化的設計方案。
②優化編排原則。
引導頁最常用設計方式有文字與界面組合、文字與插圖組合、動態效果與音樂、視頻特效等。
常用的編排有逐一展示故事串聯、應景節日等，逐一展示是將一個個內容總結成點并順序排列出來，各點之間沒有必要的關聯。
③眼球效應原則。
有效地吸引用戶的眼球才能使引導頁面起到事半功倍的效果，需要將焦點聚集在重點閱讀的內容上，才能達到突出信息的目的。
聚焦可以通過光影突出、虛化背景、放大鏡突出內容等方式來實現。
眼球效應還可以通過交互效果、動畫和視頻來實現。對于泛濫的靜態引導頁面來說，采用動態內容更能夠吸引用戶的注意力。所以除了采用靜態的表現方式，還可以通過增加合適的動態內容來吸引用戶的眼球。
采用不一樣的引導頁切換方式，也可以吸引用戶的眼球。一般引導頁的切換都是從右向左滑動切換，對于用戶來說沒有多余的學習負擔，但長久以后就會麻木從而感覺沒有創意。
可以通過設計出具有新意的切換方式來博取用戶的關注，比如類似抽取、刮開、上下等切換形式，在合適的時候能取得與眾不同的效果。
引導頁在交互設計中應當根據項目需求來制定設計方案，并且需要根據產品的受眾及競品等調研進行合理化設計。
引導頁的設計對于新用戶來說是非常重要的，而功能性的升級版本中的引導頁也能讓老用戶快速掌握新升級功能，能起到很好的輔助作用，提升用戶體驗。
總之，引導頁設計是APP的設計重點之一。
們在打開APP時候總會跳出一些頁面，有人說是啟動頁也有人叫開機圖，各種叫法讓人傻傻分不清楚。那么在啟動APP的時候我們看到的頁面到底是什么，又有什么區別呢？下面就是關于啟動頁、閃屏、引導頁的簡單的歸納和總結，希望對大家有所幫助。
當app被用戶打開時，在app啟動過程中被用戶所看到的過渡頁面（或動畫）都被我們統稱為啟動頁。
APP在用戶打開過程中需要一定的時間，啟動頁的展示是為了給用戶一個過渡頁面，緩解用戶打開app時等待的焦慮心情。類似于在app在加載過程中loading動畫一樣，都是為了通過設計的手段來解決用戶的焦慮情緒。
規范型和品牌推廣型
（1）規范型
根據 iOS 和MD 的官方定義來，用戶打開應用能立即使用是最好的體驗，例如蘋果系統自帶的一些應用，是沒有閃屏的；或者把閃屏設計的和首頁很像，類似 國外的instagram
（2）品牌推廣型
國內很多APP為了體現產品的品牌，強化用戶對品牌的記憶，一般啟動頁會由：產品名稱+產品形象（logo）+產品廣告語（slogan）組成。閃屏設計多數較為精簡，主要目的是為了突出產品特點，不宜內容太多，太過復雜，且不易經常更換，打斷用戶對品牌的認知記憶，類似國內的淘寶、優酷等。
啟動頁為一張靜態圖片，不可點擊，不可跳過
閃屏頁約等于啟動頁，又叫做開機廣告。由于閃屏主要用于活動推廣，商業上的廣告宣傳，容易造成用戶排斥心理，所以這類閃屏多數有倒計時和跳過的功能。該頁面出現在啟動頁之后，類似京東、愛奇藝等國內大多數應用，在冷啟動出現啟動頁之后有時候緊接著還會出現廣告閃屏。
廣告推廣型、活動推廣型、節日關懷型。
（1）廣告推廣型
產品為了通過流量變現，在此區域給一些商家提供廣告宣傳。
（2）活動推廣型
有時候產品在運營過程中會策劃一些行銷活動，該區域就作為活動的宣傳口。活動推廣型閃屏著重體現活動的主題，用戶利益點，以及營造活動氛圍。
（3）節日關懷型
在節假日到來時，很多APP會通過營造節日氣氛來體現人文關懷。目的主要是通過情感化得設計給用戶帶來節日祝福，提升用戶的對產品的好感度，提升產品本來的品牌調性。且此類閃屏多采用插畫類的手法，對設計師的表現力比較強的需求。
引導頁可以為一張靜態圖片，也可以是個動態短視頻，有倒計時和可以跳過，跳過后進入app首頁。
用戶第一次安裝app或者app更新后首次啟動時展示的3-5個可滑動的頁面。主要是向用戶展示產品的功能和產品亮點。
功能介紹性、推廣介紹型、問題解決型
（1）功能介紹性
通過簡潔明了的設計和通俗易懂的文案提煉產品特色功能，把產品信息傳達給用戶。需要注意的是保證信息展示一針見血，切記啰嗦反復，引導頁數控制在5張以內，避免過多的頁面造成用戶反感。
（2）推廣介紹型
主要目的是傳達產品的思想和態度，告訴用戶產品的使命和情懷。這一類的引導頁需要做到吸引用戶注意，引發用戶的共鳴。
（3）問題解決型
問題解決類通過描述在實際生活中會遇到的問題，直擊用戶痛點，通過最后的解決方案讓用戶產生情感上的聯系，讓用戶對產品產生好感，增加產品粘度。
可以左右滑動切換頁面，一般最后一頁有引導按鈕，可以寄點擊進入app。
本文由 @Sevenmoon 原創發布于人人都是產品經理。未經許可，禁止轉載
題圖來自Unsplash，基于CC0協議
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
