每年都有許多的設計畢業生進入設計行業，能夠進入大廠的人都是有限的。作者在本文中對新手引導的設計進行介紹，將9種設計模式都講解了一遍，如果對設計感興趣的話一起繼續看下去吧~

首先在開始前，我們要明確一個原則：新手引導設計雖然對于幫助新用戶熟悉產品和操作十分重要，但并不是所有的場景和功能都需要新手引導，需謹記非必要不引導。接下來我們進入主題，本文將從新手引導的定義、價值、設計模式以及適用場景，來和大家探討如何設計新手引導。

一、What | 新手引導是什么？

因為互聯網產品在上線后會不斷更新迭代，所以對互聯網產品來說，“新手”泛指的是對系統或者系統內某一具體功能不熟悉的用戶，而非剛下載注冊的用戶。

“引導”是指通過某種手段或方法，干預用戶的決策和操作，促使其嘗試并完成某任務。

新手引導設計的好，可以有效幫助用戶更快地熟悉產品操作，傳遞產品的實際價值，從而提升用戶活躍度、留存率與付費率。

二、When | 什么時候需要新手引導？

新手引導可以涵蓋用戶心智模型中接觸、了解、使用這三個環節。通常新手引導的場景可以劃分為以下三種：

1. 新產品剛上線或是上線觀察一段時間后，用戶的核心行為完成量未達到預期，這種情況下，新手引導一定是對核心功能的教育引導。
2. 產品表現穩定后，希望引導不同生命周期的用戶去完成差異化的行為。
3. 產品不斷更新上線新功能，此時可能是對新的邊緣功能的引導。

三、Why | 新手引導的意義

新手引導不是必需品，只有能夠同時為用戶和產品帶來價值的引導，才是有意義的。簡單來說，新手引導有以下意義：

對用戶來說：新手引導可以讓用戶聚焦并理解產品/功能，或者幫助用戶更快捷地達成目標。

對業務來說：可以向用戶傳遞產品的價值和差異競爭點，刺激用戶投入更多的情感和精力。

四、How | 新手引導的設計模式

接下來我們來介紹9種常見的設計模式，我們會從組成元素、出現時間、位置、場景以及優缺點等方面來描述這些設計模式。

1. 引導頁

引導頁出現在用戶首次進入產品時，在用戶使用前將產品的功能亮點或最核心的操作方式告知用戶，并在用戶心中塑造產品品牌的基調。引導頁的內容一定要仔細挑選，保證能帶給用戶新鮮感，否則容易對用戶造成干擾。

出現時間：進入產品系統時

引導位置：啟動單頁

組成元素：大標題+副標題+場景化插圖+輪播點+跳過按鈕

適用場景：新產品冷啟動或重大改版升級

優點：在表達產品價值和差異化競爭點上有很大的優勢，并且這種引導方式在用戶側的感知非常強，可以在用戶剛接觸產品時就進行用戶動機的培養，強化產品價值認知

缺點：場景聯系性弱，不能準確對具體的功能模塊做出解釋和教育

設計要點：

• 圖示為主，文字要簡潔、易理解、強調核心價值
• 數量控制在3個左右，一個單頁只展示一個特性
• 必須有醒目的進度和跳過操作
• 可以融入有沖擊力和吸引力的插畫或動效

2. 動畫引導

當遇到的產品有非常復雜的操作時，有些產品會選擇通過一段動畫來進行教學。

出現時間：進入產品系統或者觸發相關功能

引導位置：產品啟動單頁/ 相關頁面

組成元素：動畫視頻+跳過/ 關閉

?動畫教學引導

適用場景：工具類產品、復雜的操作

優點：動畫吸引力很強，也非常直觀

缺點：阻斷行為，教學不是即時的

設計要點：必須控制動畫的內容和時長，盡量控制在10s以內，避免信息過多造成學習負擔

3. 單頁蒙層

蒙層就是在產品的整個界面上方用一個半透明蒙層進行遮罩，上方對界面進行圈注，旁邊配以手勢、文字、符號、插畫等，如下圖所示的應用中就運用了單頁蒙層的引導，幫助用戶了解新功能該如何使用。

?單頁蒙層示意

出現時間：首次進入相關頁面，且無操作時

引導位置：單頁全局/操作按鈕或模塊旁邊/全局多個位置

組成元素：蒙層+文字+插圖/ GIF

適用場景：功能上新或改動 / 頁面結構更新 / 交互操作引導

優點：蒙層設計的內容形式多樣，視覺焦點突出，并且場景聯系性很強

缺點：阻斷行為，對用戶行為干擾較強

設計要點：

• 以圖示為主，文字簡潔易理解，確保在短短的幾秒內用戶能夠獲取有效信息
• 盡量設計醒目的關閉按鈕，同時蒙層區域需要支持點擊跳出

4. 分步引導

分步引導和單頁蒙層的相似之處在于都是蒙層+內容的形式，但它會按照流程依次出現。例如下圖中蘇寧益起走的活動中就運用了分布引導，它和單頁蒙層最大的差別是分步引導會出現跳頁引導的情況。

蘇寧益起走活動引導

出現時間：首次進入相關頁面，且無操作時

引導位置：按流程/優先級出現在頁面上方

組成元素：蒙層+內容

適用場景：頁面結構改動較多 / 流程較長的交互 / 復雜功能

優點：可以一步一步地教育用戶，控制單次傳遞的信息，讓用戶快速了解每個功能的收納位置，并以最短路徑體驗流程

缺點：過程連續不可預期，會持續地干擾用戶，容易讓用戶產生厭煩心理

設計要點：

• 需以圖示為主，文字簡潔易理解，確保用戶在幾秒內能夠獲取有效信息
• 盡量控制分步的數量在3步左右
• 盡量設計醒目的關閉按鈕和引導進度，點擊蒙層區域會進入下一步或消除蒙層

5. 教學式引導

出現時間：真實的使用過程中，邊用邊學

引導位置：預判操作，在觸點的旁邊展示

組成元素：蒙層 / 氣泡 / 動效等

適用場景：游戲、工具類產品、營銷活動

游戲中的教學式引導

優點：可以結合實際使用場景，并且在完成引導后給予及時的實際反饋，例如游戲中常見的教學式引導就可以直觀的幫助用戶了解游戲玩法

缺點：用戶不可以跳過，必須完成引導的內容

設計要點：

• 反饋要明顯且及時，突出引導教學的成果
• 教學步驟盡量控制在3步左右

6. 彈窗引導

彈窗引導一般在進入相關模塊或觸發功能時出現在單頁全局去介紹對應的操作與信息，例如拼多多中運用的彈窗引導可以讓用戶快速聚焦當前內容，引導用戶達成設計目標。

拼多多中的彈窗引導

出現時間：首次進入產品或相關模塊

引導位置：單頁全局

組成元素：蒙層+對話框（標題、說明文案、示意圖、按鈕）

適用場景：版本更新 / 新功能上線 / 后續操作引導等

優點：彈窗在操作和視覺上都非常聚焦，是某個時間點上優先級最高的事情

缺點：強制阻斷了用戶的正常操作，容易對用戶造成打擾

設計要點：

• 要提供明顯的關閉或跳過功能，同時蒙層區域需要支持點擊跳出
• 特別要注意避免多層彈窗嵌套的情況

7. 氣泡/toast

氣泡是一種非常輕量的引導，當用戶首次進入相關頁面時會出現在引導對象的旁邊，例如QQ音樂、支付寶等產品在頁面中運用了氣泡引導，指示性比較強，并且對用戶的打擾比較弱。

氣泡引導

出現時間：首次進入相關頁面，無操作時

引導位置：按鈕/ 入口旁邊

組成元素：氣泡+文字

適用場景：版本更新 / 新功能上線 / 功能引導 / 隱藏內容引導

優點：很輕量，但目標指向性極強，對用戶的干擾較小

缺點：容易被忽略，通常我們會在氣泡的出現邏輯或形式上進行設計，以確保氣泡不是無效引導

8. 召喚式引導

召喚式引導主要指的是一些動效，通常出現在一些從未操作過的或新上線的重要功能上，例如在游戲或活動中的新手引導可以采用召喚式引導的方式，激發用戶的點擊欲望。

召喚式引導

優點：以動態效果為主，有較強的視覺效果，容易形成視焦點

缺點：無法對功能或內容進行適當的解釋說明，需要動效本身有比較明確的教學效果

9. 預設任務引導

最后一種新手引導也比較輕量，就是預設任務引導，例如有道云筆記的產品中就通過設置新手任務達到教學的作用。

預設任務引導

出現時間：在相關板塊無操作歷史 / 空態

引導位置：空態頁面 / 空態模塊

適用場景：工具向產品或模塊 / 任務列表 / 文檔列表

優點：借用本身的產品形態讓用戶沉浸在真實場景中去學習，在后續產品的使用中更容易上手，同時突出了產品的特色和核心價值。

五、How to Choose | 如何選擇合適的設計模式

介紹完這么多設計模式，那在具體的使用過程中該如何進行選擇呢？我們可以根據用戶的不同使用場景選擇不同的設計模式，我們還是把用戶場景分為剛接觸系統，使用新功能和使用之后三個場景。

首先剛接觸產品系統時，用戶需要能快速理解產品可以干什么，為我解決什么問題，需要我付出什么。所以我們在這一階段設計新手引導時就需要強調出產品差異化的價值、競爭點與核心場景使用路徑，同時切忌在用戶剛接觸產品時就給出過多強硬的教育引導?；谶@樣的原則，我們可以選擇引導頁、動畫引導、教學式引導、預設任務以及彈窗引導的模式。

剛接觸產品系統場景

當用戶對產品整體有了一定認知時，大概率還是會遇到很多沒有使用過的新功能。此時新功能能為用戶帶來什么價值、使用成本有多高對用戶來說是最關心的。這一場景下可以使用的設計模式有很多，在選擇時要依據引導內容的重要性（比如用戶價值、業務價值以及引導內容的學習難度）來決定使用模態引導還是非模態引導。

開始使用新功能場景

最后，用戶已經使用過某一功能后不等于用戶不再是新用戶，如果前后流程或再次使用的路徑比較特殊，都應該在用戶使用之后做出相應的引導說明。比如微信語音輸入，在用戶點擊使用語音功能后，還會有松開取消和松開轉文字的新手引導，因為這兩步的操作在用戶點擊語音的預期之外，比較特殊。

開始使用之后場景

這里附上一個速查表，方便大家在設計時可以快速地根據用戶場景和業務場景選擇設計模式。

使用場景速查表

寫在最后

新手引導在設計的過程中我們要時刻記住以下兩點：

1. “非必要不引導”。不要陳述顯而易見的事情，要選擇合適的引導，確保引導對用戶的價值大于對用戶的干擾。
2. “一目了然”。讓用戶在第一時間能夠理解引導內容，降低認知成本和操作成本。