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

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

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


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


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

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

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

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

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


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


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

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

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

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

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

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


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


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

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

入門之旅

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

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

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

△ Slack通過四屏概覽引入了新用戶,整個(gè)介紹流程很清晰,為用戶提供了明確的進(jìn)度點(diǎn)以及跳過選項(xiàng)。

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

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

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

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

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

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

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

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

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

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

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

△ 用戶首次進(jìn)入團(tuán)隊(duì)管理平臺(tái)Basecamp時(shí),會(huì)被引導(dǎo)完成一項(xiàng)任務(wù),以此來熟悉產(chǎn)品的特性和功能。

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

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

開箱即用

第一印象很重要,因?yàn)楹芏嘤脩粼诘谝淮未蜷_產(chǎn)品后就把它放棄了。

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

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

漸進(jìn)式引導(dǎo)

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

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

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

新功能上線

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

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

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


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


1. 了解用戶

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

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

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

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

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

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

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

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

3. 快速引導(dǎo)

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

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

△ Morningstar Financial的入門引導(dǎo)違反保持簡單引導(dǎo)的準(zhǔn)則,因?yàn)闆]有人愿意花費(fèi)時(shí)間去閱讀這么多的說明,更別說記住這些說明。

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

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

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

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

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

5. 避免過于個(gè)性化

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

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

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

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


最后


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

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