UI設(shè)計(jì)中的新手引導(dǎo)，主要幫助用戶認(rèn)識(shí)產(chǎn)品、捋清重要功能入口，降低后續(xù)使用過(guò)程中的認(rèn)知成本，對(duì)于較為復(fù)雜的產(chǎn)品來(lái)說(shuō)至關(guān)重要。本文作者對(duì)新手引導(dǎo)的設(shè)計(jì)進(jìn)行了分析，一起來(lái)看一下吧。
很多時(shí)候，大家都覺(jué)得新手引導(dǎo)大可不必，對(duì)于大部分產(chǎn)品，用戶看都不看直接關(guān)掉，但對(duì)于一些較為復(fù)雜的產(chǎn)品，新手引導(dǎo)是不是比看長(zhǎng)篇大論的說(shuō)明書(shū)好多了。設(shè)想一下，我們生病后拿的藥品，可曾有過(guò)一次將說(shuō)明書(shū)從頭到尾的看完過(guò)，我相信通常都是遵醫(yī)囑或者后續(xù)再咨詢吧，相比之下，如果購(gòu)買的是一臺(tái)跑步機(jī)，除了看視頻操作之外，可能還會(huì)看一看說(shuō)明書(shū)，雖然查看率較低，但不可否認(rèn)的是遇到突發(fā)問(wèn)題或許能起到關(guān)鍵作用。
UI設(shè)計(jì)中的新手引導(dǎo)主要幫助用戶認(rèn)識(shí)產(chǎn)品、捋清重要功能入口，以幫助其快速上手、降低后續(xù)使用過(guò)程中的認(rèn)知成本，同時(shí)也是產(chǎn)品作為拉新轉(zhuǎn)化的重要步驟，對(duì)于較為復(fù)雜的產(chǎn)品來(lái)說(shuō)至關(guān)重要，不容忽視。那么在設(shè)計(jì)新手引導(dǎo)時(shí)要注意哪些問(wèn)題、如何將引導(dǎo)的作用發(fā)揮到最大，接下來(lái)與大家一起了解。
一、了解新手引導(dǎo)
1. 什么是新手引導(dǎo)
當(dāng)我們進(jìn)入一家新的公司時(shí)，一般都會(huì)有人事帶著我們認(rèn)識(shí)團(tuán)隊(duì)中的每一個(gè)人、或者在會(huì)議上做自我介紹，我們很清楚，即便不這樣做，只需一定的時(shí)間也可以通過(guò)主動(dòng)/被動(dòng)溝通逐漸熟悉，但公司的安排無(wú)疑加速讓我們?nèi)谌胄碌沫h(huán)境，更快進(jìn)入最好的工作狀態(tài)，這就是顯示版的“新手引導(dǎo)”。
《增長(zhǎng)黑客》中曾說(shuō)過(guò)：欲望-摩擦=轉(zhuǎn)化，為了增加轉(zhuǎn)化，既可以增加用戶的欲望、也可以減少產(chǎn)品與用戶的摩擦，“新用戶體驗(yàn)”作為用戶旅程的起點(diǎn)，必定有諸多摩擦點(diǎn)，新手引導(dǎo)就是為了消除這些摩擦點(diǎn)而存在。
產(chǎn)品中的新手引導(dǎo)能幫助用戶在短時(shí)間內(nèi)快速了解產(chǎn)品特色以及使用方式，輕松體驗(yàn)多種功能。站在產(chǎn)品角度，新手引導(dǎo)讓用戶掌握產(chǎn)品核心功能、提高留存率后，對(duì)提升轉(zhuǎn)化起到了至關(guān)重要的作用。
2. 需引導(dǎo)的功能/內(nèi)容
首先，展示產(chǎn)品特色，讓用戶了解該產(chǎn)品相比同類產(chǎn)品中的優(yōu)勢(shì)與亮點(diǎn)，給用戶留下良好的印象、或者說(shuō)有想用下去的欲望;
第二，產(chǎn)品的更新迭代，不管是新功能的上線還是原有功能入口位置的變化，都應(yīng)該及時(shí)提示用戶，避免用戶在之前版本的固有思維中、無(wú)法快速掃視到自身所需的入口而花費(fèi)更多的時(shí)間成本;
第三，操作指引，這一點(diǎn)并不是所有產(chǎn)品都需要的，在正常情況下，產(chǎn)品要做到不讓用戶思考就能快速上手，但針對(duì)較為復(fù)雜的產(chǎn)品，則需要通過(guò)新手引導(dǎo)幫用戶快速掌握其操作方式與技巧，降低自行學(xué)習(xí)成本，例如部分B端、工具類應(yīng)用。
3. 出現(xiàn)的時(shí)機(jī)
大部分新手引導(dǎo)出現(xiàn)在應(yīng)用下載或版本更新后的首次打開(kāi)時(shí)，這有助于用戶對(duì)產(chǎn)品的新功能/操作有基本了解。新手引導(dǎo)不求大而全，在介紹核心功能和特色后，可將出現(xiàn)過(guò)的引導(dǎo)進(jìn)行隱藏，方便用戶在需要的時(shí)候手動(dòng)喚出以尋求幫助。
另外，產(chǎn)品需要保持用戶對(duì)產(chǎn)品自行探索的好奇心，對(duì)于那些非必須但必要的新手引導(dǎo)，可在不干擾用戶的前提下，根據(jù)用戶的操作進(jìn)行行為預(yù)判，在合適的時(shí)間主動(dòng)給予提示，確保用戶的隱性需求能得以明確并及時(shí)解決。
二、使用場(chǎng)景及樣式分類
1. 頁(yè)面遮罩引導(dǎo)
頁(yè)面遮罩引導(dǎo)相當(dāng)于把氣泡引導(dǎo)樣式進(jìn)行了升級(jí)，區(qū)別在于頁(yè)面上方增加了一個(gè)黑色半透明蒙層進(jìn)行遮罩，被引導(dǎo)的下層內(nèi)容處鏤空設(shè)計(jì)，并在蒙版上配交互手勢(shì)、文字信息或插圖等內(nèi)容進(jìn)行輔助說(shuō)明，用戶需要手動(dòng)點(diǎn)擊“下一步/跳過(guò)/關(guān)閉”按鈕方能操作其他內(nèi)容。
這種新手引導(dǎo)最大的優(yōu)勢(shì)是能讓視覺(jué)聚焦于當(dāng)前被指引的功能說(shuō)明處，確保用戶不會(huì)被其他信息所干擾�；臼窃谙螺d或更新應(yīng)用后的首次打開(kāi)時(shí)出現(xiàn)，可顯示一個(gè)或多個(gè)(順序引導(dǎo))，信息傳達(dá)的有效性很高。
需要注意的是內(nèi)容介紹必須與所引導(dǎo)的位置處保持親密性，關(guān)閉按鈕明顯、易操作。出現(xiàn)多個(gè)引導(dǎo)時(shí)，需同時(shí)提供“下一步”、“跳過(guò)”按鈕，這里不乏有一些老用戶二次下載或出于更新版本的目的，根本不需要新手引導(dǎo)，如果每次都要挨個(gè)點(diǎn)，對(duì)老用戶來(lái)說(shuō)，這不是幫助、而是干擾了。
2. 對(duì)話框引導(dǎo)
對(duì)話框一種強(qiáng)引導(dǎo)，一般在用戶即將使用的某個(gè)功能被限制或在使用過(guò)程中主動(dòng)尋求幫助時(shí)出現(xiàn)，對(duì)用戶來(lái)說(shuō)有實(shí)際性的幫助。對(duì)話框的出現(xiàn)依然會(huì)打斷用戶操作，尤其是自動(dòng)觸發(fā)的彈出時(shí)機(jī)要得當(dāng)，彈出不及時(shí)或提前干擾用戶都會(huì)存在負(fù)面影響。對(duì)話框引導(dǎo)會(huì)在合適的時(shí)機(jī)由系統(tǒng)自動(dòng)觸發(fā)或用戶主動(dòng)觸發(fā)。
1)系統(tǒng)自動(dòng)觸發(fā)
例如用戶需要使用某個(gè)功能時(shí)，系統(tǒng)自動(dòng)彈出需升級(jí)到新版本或完成任務(wù)才能體驗(yàn)，并提供快捷通道，方便用戶直達(dá)目標(biāo)。另外，視頻類應(yīng)用的付費(fèi)影片可免費(fèi)體驗(yàn)5分鐘，到時(shí)間后，系統(tǒng)會(huì)自動(dòng)暫停播放并彈出付費(fèi)通道，引導(dǎo)用戶轉(zhuǎn)化。
2)用戶手動(dòng)觸發(fā)
這類引導(dǎo)都會(huì)有一個(gè)操作入口，使用按鈕、“問(wèn)號(hào)”圖標(biāo)或文本超鏈接(說(shuō)明/操作指引/幫助…)提示，用戶可隨時(shí)點(diǎn)擊喚出引導(dǎo)說(shuō)明。例如，用戶在應(yīng)用內(nèi)主動(dòng)開(kāi)啟設(shè)備的通知、定位權(quán)限，激活信用卡時(shí)預(yù)留手機(jī)號(hào)碼的文本說(shuō)明或卡背面的CVV/CVC圖文指引說(shuō)明等。
3. 氣泡提示引導(dǎo)
這是一種較為輕量但指向性極強(qiáng)的引導(dǎo)方式，其表現(xiàn)形式是在需要的位置彈出一個(gè)帶尖角的氣泡容器加引導(dǎo)性的文案提示，用戶可跟隨引導(dǎo)操作、也可忽略氣泡直接操作其他內(nèi)容，不會(huì)打斷用戶，其干擾性極小。
氣泡提示引導(dǎo)可用在新功能上線、核心功能定位、隱藏菜單提示等場(chǎng)景，可配合圖片素材、動(dòng)畫(huà)效果，因帶有明確的指向性，可出現(xiàn)在頁(yè)面的任何位置，兼容性極強(qiáng)。
4. 操作欄引導(dǎo)
相比前面提到的對(duì)話框引導(dǎo)，操作欄與之有些相似，其都是阻斷式且沒(méi)有明確指向性的引導(dǎo)方式，唯一不同的是，操作欄雖然視覺(jué)重心稍弱于對(duì)話框，但彈出的位置在屏幕下方，利于用戶操作(靠近手指)，尤其是單手操作更容易觸達(dá)。
另外，操作欄有更多的空間資源，對(duì)于內(nèi)容較多的詳細(xì)指引比較適合，可通過(guò)圖文、背景組合營(yíng)造出濃烈的視覺(jué)氛圍，還能增加突出的CTA按鈕提升轉(zhuǎn)化率。
5. 其他引導(dǎo)方式
除了上述提到的幾種新手引導(dǎo)之外，還有引導(dǎo)頁(yè)、缺省頁(yè)、偏好標(biāo)簽等方式，但那些都是較為復(fù)雜且獨(dú)立的模塊體系，不是三言兩語(yǔ)能說(shuō)清楚的，建議閱覽其他單獨(dú)的相關(guān)資料。
三、新手引導(dǎo)設(shè)計(jì)小技巧
1. 情感化鏈接
情感化是設(shè)計(jì)的利器，它將毫無(wú)感情的互聯(lián)網(wǎng)產(chǎn)品賦予生命力，消除人機(jī)界面的冰冷交互，幫助用戶和產(chǎn)品建立友好的聯(lián)系。
在設(shè)計(jì)新手引導(dǎo)時(shí)，不妨加入擬人化的形象、深入人心的文案以及模擬現(xiàn)實(shí)世界的事物/事務(wù)，做一個(gè)有溫度的產(chǎn)品，更能拉近與用戶之間的距離。
2. 強(qiáng)化利益點(diǎn)、建立目標(biāo)
對(duì)于活動(dòng)促銷類新手引導(dǎo)，在用戶操作之前可告知操作后能得到什么、不操作會(huì)有什么損失，不乏使用一些如利益引誘、中斷警告、視覺(jué)氛圍等常規(guī)設(shè)計(jì)手段讓用戶有明確的使用目標(biāo)，便于推動(dòng)用戶做出正向的決策。操作之后著重突出利益點(diǎn)刺激用戶，給用戶留下深刻的印象或讓其期待下次的到來(lái)。
3. 多個(gè)功能分層引導(dǎo)
遵循一次只做一件事的原則，多個(gè)功能需按不同的優(yōu)先級(jí)、跟隨用戶的操作依次呈現(xiàn)。還需要在每個(gè)層級(jí)都提供“跳過(guò)”入口，新手引導(dǎo)是為滿足用戶需求所提供的幫助，而不是強(qiáng)制用戶使用。
4. 復(fù)雜功能分時(shí)間段引導(dǎo)
較為復(fù)雜的功能可將信息進(jìn)行拆分，根據(jù)其重要程度按不同的時(shí)間歷程分別開(kāi)放，避免用戶一次性接受過(guò)多的信息量，也能降低單次學(xué)習(xí)成本，提高吸收效率。
例如：VIP功能，每個(gè)等級(jí)都可能會(huì)單獨(dú)開(kāi)放新的服務(wù)、權(quán)限，系統(tǒng)應(yīng)該在用戶每次升級(jí)后、把新的服務(wù)及時(shí)引導(dǎo)反饋，切不可在首次開(kāi)通VIP時(shí)就一股腦的把所有增值服務(wù)都告知用戶，沒(méi)那耐心去記、也記不住。如有必要，可把不能使用的功能放出來(lái)置灰顯示或提供操作限制等。
5. 多樣化的視覺(jué)樣式
不同的新手引導(dǎo)，可設(shè)計(jì)出不同的視覺(jué)樣式，避免相同的樣式讓用戶形成“慣性思維”誤以為已經(jīng)看過(guò)，不加思索的跳過(guò)而讓新手引導(dǎo)成為累贅。
四、常見(jiàn)問(wèn)題及處理方式
1. “跳過(guò)”弱化處理
在UI界面中，只要不是用戶主動(dòng)尋求幫助而彈出的信息，就會(huì)條件反射地去尋找關(guān)閉按鈕，直至內(nèi)容消失。
雖然很多新手引導(dǎo)都有提供“跳過(guò)”操作，這無(wú)可厚非，但是不要設(shè)計(jì)的過(guò)于明顯，太過(guò)搶眼的“跳過(guò)”按鈕很容易激起用戶的條件反射，不管有無(wú)幫助、看見(jiàn)就點(diǎn)，這也就失去了新手引導(dǎo)的初衷。適度弱化“跳過(guò)”操作入口，用戶即便想要關(guān)閉，但在尋找操作的過(guò)程中，也許會(huì)被有趣的、有幫助的信息所干擾，或可持續(xù)瀏覽。
2. 使用淺色遮罩
很多時(shí)候，為了讓用戶按順序走完新手引導(dǎo)，會(huì)在氣泡后面添加一層遮罩，其不管是箭頭指示還是鏤空透底，遮罩的顏色(純黑不透明度)最好使用淺色，需要用戶在吸收新手指引內(nèi)容的同時(shí)、還能看到界面整體的結(jié)構(gòu)樣式，在新手引導(dǎo)結(jié)束后對(duì)操作路徑有一定的印象，太深的遮罩不利于用戶整體學(xué)習(xí)。
3. 最易理解的表達(dá)方式
引導(dǎo)文案必須言簡(jiǎn)意賅，需要以最能吸引用戶注意、容易理解的表達(dá)方式有效的突出重點(diǎn)。切忌長(zhǎng)篇大論，過(guò)多的文本內(nèi)容，用戶容易忘記或出現(xiàn)記憶偏差，而且也沒(méi)那個(gè)耐心去看。
如果內(nèi)容無(wú)法精簡(jiǎn)的更短，可以考慮使用圖片/插圖代替部分文字，以圖文結(jié)合的方式體現(xiàn)，還可以用分段顯示的方式跟用戶進(jìn)行互動(dòng)，邊用邊學(xué)。
4. 內(nèi)容較多要顯示進(jìn)度
在設(shè)計(jì)新手引導(dǎo)時(shí)，不管內(nèi)容有多么精彩，都不要想著一次給用戶灌輸過(guò)多信息。用戶初次使用產(chǎn)品，只需給予必要的功能及適當(dāng)?shù)膸椭�，多個(gè)引導(dǎo)的數(shù)量通�？刂圃�3~5條即可。還需要讓用戶實(shí)時(shí)知道當(dāng)前進(jìn)度，避免用戶無(wú)法掌控內(nèi)容量而產(chǎn)生焦慮感，如果被直接跳過(guò)就無(wú)法發(fā)揮出新手引導(dǎo)的作用。
5. 用戶要有選擇權(quán)
新手引導(dǎo)主要是為了幫助用戶快速上手，雖然最終的目標(biāo)是為提升轉(zhuǎn)化，但不要意想天開(kāi)的在新手引導(dǎo)中僅放置一個(gè)“去轉(zhuǎn)化”快捷入口。沒(méi)有關(guān)閉操作、強(qiáng)制用戶進(jìn)入轉(zhuǎn)化流程的做法，除了極少少數(shù)的必用情況外，大概率會(huì)被用戶直接結(jié)束進(jìn)程，既然無(wú)法關(guān)閉那就卸載吧!
不管內(nèi)容有多么重要、有多么想提升收益，都不可強(qiáng)制用戶，我們可以利用設(shè)計(jì)手段去吸引用戶操作，但依然要提供后退的入口，就算不是多么的明顯也行，用戶應(yīng)該要有自主選擇的權(quán)利。
6. 趣味化的內(nèi)容
用戶在使用新手引導(dǎo)學(xué)習(xí)的過(guò)程中，本身是枯燥的，設(shè)計(jì)師可以根據(jù)產(chǎn)品的調(diào)性設(shè)計(jì)出趣味化的字體、插畫(huà)，還能配合動(dòng)畫(huà)設(shè)計(jì)給用戶帶來(lái)趣味化的使用體驗(yàn)。
五、結(jié)語(yǔ)
本文從基礎(chǔ)認(rèn)識(shí)、樣式分類、設(shè)計(jì)技巧及常見(jiàn)問(wèn)題處理四個(gè)方面介紹了新手引導(dǎo)在UI設(shè)計(jì)中的實(shí)踐，雖然它只是很小的一個(gè)環(huán)節(jié)、且不是所有的應(yīng)用(如購(gòu)物類、社交類、新聞?lì)?都需要新手引導(dǎo)，可一旦涉及就顯得尤為重要。新手引導(dǎo)設(shè)計(jì)的是否合理易用，直接關(guān)系著用戶的使用體驗(yàn)及產(chǎn)品轉(zhuǎn)化，如果你的新手引導(dǎo)只是擺設(shè)、甚至成為累贅，還不如去掉。
新手引導(dǎo)設(shè)計(jì)需根據(jù)產(chǎn)品自身特性結(jié)合業(yè)務(wù)場(chǎng)景，在合適的時(shí)機(jī)、以最合理的方式呈現(xiàn)給用戶，引導(dǎo)用戶快速熟悉產(chǎn)品、并使用產(chǎn)品。
筆者希望通過(guò)本文內(nèi)容，讓初中級(jí)設(shè)計(jì)師對(duì)新手引導(dǎo)有一個(gè)系統(tǒng)化的認(rèn)識(shí)，在日后的設(shè)計(jì)中，能結(jié)合實(shí)際應(yīng)用場(chǎng)景給出最合適的方案，為用戶提供實(shí)際的幫助、為產(chǎn)品提升價(jià)值。
來(lái)源：人人都是產(chǎn)品經(jīng)理
以上是關(guān)于用戶增長(zhǎng)師的相關(guān)信息，以供大家查看了解。想要了解更多用戶增長(zhǎng)師信息，第一時(shí)間了解用戶增長(zhǎng)師相關(guān)資訊，敬請(qǐng)關(guān)注唯學(xué)網(wǎng)用戶增長(zhǎng)師欄目，如有任何疑問(wèn)也可在線留言，小編會(huì)為您在第一時(shí)間解答!
