學(xué)學(xué)這些引導(dǎo)頁設(shè)計方法
發(fā)布時間:2022-01-05 10:50 [ 我要自學(xué)網(wǎng)原創(chuàng) ] 發(fā)布人: 小劉2175

引導(dǎo)頁可以算作我們打開一個新產(chǎn)品時看到的第一個畫面,能在未使用產(chǎn)品之前提前告知產(chǎn)品的主要功能與特點。

第一印象的好壞會很大程度上影響到后續(xù)的產(chǎn)品使用體驗。文章通過梳理引導(dǎo)頁設(shè)計的構(gòu)成,總結(jié)出實用的觀點與方法來助力引導(dǎo)頁設(shè)計。


什么是引導(dǎo)頁?


第一次打開新的應(yīng)用時通常能會看到 2-3 個系列開屏頁,上面有簡短的文案來解釋產(chǎn)品的功能,方便用戶使用。

又或者打開一個全新的社交類產(chǎn)品,會引導(dǎo)用戶進行創(chuàng)建帳號、設(shè)置偏好、添加興趣等一系列操作,從零開始帶用戶了解產(chǎn)品。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法!(附素材)

△ 通過友好的引導(dǎo)頁向用戶介紹價值主張以及產(chǎn)品將如何改善他們的生活。

入門引導(dǎo)有助于用戶了解需要做什么以及怎么做才能從產(chǎn)品中獲得需要的東西。這是一種與用戶建立信任的方法,不僅有助于用戶,也是提高業(yè)務(wù)轉(zhuǎn)化率和保留率的關(guān)鍵。


為什么引導(dǎo)頁很重要?


平均來說,近四分之一的用戶會在僅使用產(chǎn)品一次后就因為各種原因放棄再次使用。一旦用戶試用了產(chǎn)品并且離開,可能很難再次成為產(chǎn)品的使用者,除非他們能從產(chǎn)品中獲得一些有價值的內(nèi)容。

例如我們花時間和精力去下載一個新產(chǎn)品時,總會帶著某種目的性,希望這個產(chǎn)品能在某種程度上解決現(xiàn)階段遇到的問題或者改善我們的生活。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法!(附素材)

△ Twine將漸進式的引導(dǎo)頁融入到產(chǎn)品體驗中,用戶的流失率降低了一半以上。

用戶留存率和客戶忠誠度是大多數(shù)產(chǎn)品和服務(wù)成功的關(guān)鍵因素,合適的引導(dǎo)頁可以提高長期留存率。

為產(chǎn)品或服務(wù)添加新功能雖然很好,但如果用戶不了解或不知道如何使用,會導(dǎo)致用戶在很大程度上未充分利用這些新功能,那么它們就沒有為用戶帶來太大的價值。


引導(dǎo)頁設(shè)計類型和方法


1. 引導(dǎo)頁類型

為滿足新用戶的需求并留住他們,大多數(shù)產(chǎn)品會采用幾種引導(dǎo)頁組合來為用戶提供指導(dǎo)。

入門之旅

這是一種在移動應(yīng)用中非常流行的模式。用戶第一次啟動產(chǎn)品后,他們會看到幾個快速概述產(chǎn)品價值和基礎(chǔ)知識的頁面。

這種簡單、靜態(tài)的介紹為新用戶提供了一個很好的入門。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法。ǜ剿夭模

△ Slack通過四屏概覽引入了新用戶,整個介紹流程很清晰,為用戶提供了明確的進度點以及跳過選項。

最好的做法是為用戶提供進度指示以及退出或跳過選項。這樣他們就會明白還有多少介紹內(nèi)容需要閱讀,并且不會感到困惑。

工具提示和指導(dǎo)標記

這是另一種很常見且相對省力的方法,用于從一開始并貫穿整個產(chǎn)品體驗來引導(dǎo)用戶。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法。ǜ剿夭模

△ Twine使用工具提示和指導(dǎo)標記幫助用戶快速了解頁面情況。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法。ǜ剿夭模

△ 在為Metrie的3D房間配置器設(shè)計界面時,通過添加指導(dǎo)標記的可切換圖層,將它們合并到加載屏幕中。

雖然這種帶注釋的引導(dǎo)設(shè)計很有用,但要注意不要過度使用或者連續(xù)彈出多個窗口來干擾用戶。一次引導(dǎo)用戶使用一個元素或操作,避免解釋太多顯而易見的事情。

引導(dǎo)任務(wù)完成

讓用戶記住某事最好的方法就是讓他們實際去做。引導(dǎo)式任務(wù)是通過一系列步驟提示用戶與產(chǎn)品交互的方法,常用于當(dāng)產(chǎn)品希望用戶盡早創(chuàng)建帳戶或設(shè)置一些個性化參數(shù)時。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法!(附素材)

△ 用戶首次進入團隊管理平臺Basecamp時,會被引導(dǎo)完成一項任務(wù),以此來熟悉產(chǎn)品的特性和功能。

2. 什么時間開始引導(dǎo)

從初次進入到持續(xù)使用的整個過程中,決定在產(chǎn)品體驗的哪個部分使用哪種引導(dǎo)模式對于用戶體驗來說都至關(guān)重要。

開箱即用

第一印象很重要,因為很多用戶在第一次打開產(chǎn)品后就把它放棄了。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法!(附素材)

△ 日記應(yīng)用Dailyo友好細致的引導(dǎo)頁向用戶解釋了產(chǎn)品的價值,并提供了如何讓用戶從中獲益的提示。

漸進式引導(dǎo)

用戶完成了開箱即用的流程之后,在使用產(chǎn)品的過程中仍然有很多機會可以繼續(xù)幫助、啟發(fā)和取悅用戶。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法。ǜ剿夭模

△ 每當(dāng)用戶選擇一種新語言來學(xué)習(xí)時,多鄰國都會提示用戶表明他們的專業(yè)水平,然后測試他們的語言能力。這有助于用戶避免因高估自己的能力而有可能放棄使用的挫折感。

新功能上線

當(dāng)產(chǎn)品推出新功能或?qū)w驗進行重大的改動時,需要讓用戶知道這些新功能的優(yōu)點以及如何使用。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法。ǜ剿夭模

△ 當(dāng)Facebook為用戶引入一項新功能時,會通過一個高度可見的工具提示標注來讓用戶知道如何在一個簡單的消息中使用新的功能。


引導(dǎo)頁設(shè)計實踐和技巧


1. 了解用戶

通過了解用戶來調(diào)整引導(dǎo)頁的設(shè)計,發(fā)現(xiàn)并利用用戶現(xiàn)有的心智模型,來幫助彌合用戶對產(chǎn)品的期望。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法。ǜ剿夭模

△ Basecamp通過提供一個簡單的選擇面板和友好的指南,突出了新用戶在首次使用時要注意的核心要素。

在構(gòu)建產(chǎn)品時,用戶測試和可用性分析不僅能幫助團隊改進整體設(shè)計,還能告知用戶在入門時應(yīng)關(guān)注哪些內(nèi)容。

2. 與用戶價值聯(lián)系起來

使用福利介紹來提醒用戶為什么產(chǎn)品或服務(wù)適合滿足特定需求。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法!(附素材)

△ Inbox對入門體驗進行了冗長的介紹,但每個案例都強調(diào)了其功能將如何使用戶的生活更輕松。

3. 快速引導(dǎo)

使用一個實體產(chǎn)品時,很少有人愿意翻看說明書,相反大家更愿意自己去摸索產(chǎn)品的功能。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法。ǜ剿夭模

△ Morningstar Financial的入門引導(dǎo)違反保持簡單引導(dǎo)的準則,因為沒有人愿意花費時間去閱讀這么多的說明,更別說記住這些說明。

如果產(chǎn)品很簡單,快速的概覽可能就足夠了。當(dāng)需要更深入時可以考慮漸進式引導(dǎo),將引導(dǎo)擴展到整個產(chǎn)品體驗中。

4. 可重復(fù)引導(dǎo)

入門引導(dǎo)之后,不能假設(shè)用戶不會再次訪問這些引導(dǎo)內(nèi)容,用戶很可能忘記了第一次引導(dǎo)時提到的技巧或內(nèi)容,所以考慮在導(dǎo)航中設(shè)置一個“幫助”模塊,便于用戶重復(fù)回看這些引導(dǎo)內(nèi)容。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法。ǜ剿夭模

△ 指導(dǎo)標記可以根據(jù)用戶需要在房間中選擇打開或關(guān)閉,這使用戶能夠根據(jù)自己的實際情況獲得指導(dǎo)和幫助。

5. 避免過于個性化

鼓勵新用戶提供一些有助于個性化體驗的信息是很好的,但需要注意不能要求太多細節(jié),導(dǎo)致讓用戶有一種信息泄漏的感覺。

產(chǎn)品不應(yīng)該向用戶詢問太多不必要的問題,尤其是在剛開始使用的時候。

想抓住產(chǎn)品第一印象?看看這些引導(dǎo)頁設(shè)計方法!(附素材)

△ 首次使用Pinterest時,用戶需要使用郵箱才能登錄,再通過年齡和興趣愛好的選擇為用戶帶來個性化的體驗。


最后


引導(dǎo)頁不僅僅是一瞬間的操作,而是一個與受眾建立并保持信任的過程。

HTML基礎(chǔ)視頻教程
我要自學(xué)網(wǎng)商城 ¥30 元
進入購買
文章評論
0 條評論 按熱度排序 按時間排序 /350
添加表情
遵守中華人民共和國的各項道德法規(guī),
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任,
本站有權(quán)保留或刪除有爭議評論。
參與本評論即表明您已經(jīng)閱讀并接受
上述條款。
V
特惠充值
聯(lián)系客服
APP下載
官方微信
返回頂部
分類選擇:
電腦辦公 平面設(shè)計 室內(nèi)設(shè)計 室外設(shè)計 機械設(shè)計 工業(yè)自動化 影視動畫 程序開發(fā) 網(wǎng)頁設(shè)計 會計課程 興趣成長 AIGC