基于移動(dòng)終端界面的用戶引導(dǎo)方法探索

1、    基于移動(dòng)終端界面的用戶引導(dǎo)方法探索    方婷摘 要：3g時(shí)代的來(lái)臨讓移動(dòng)互聯(lián)網(wǎng)超越了傳統(tǒng)的互聯(lián)網(wǎng)，更個(gè)性化的移動(dòng)服務(wù)已經(jīng)深入我們的生活，覆蓋了吃穿住行等方方面面。我們每天都會(huì)投入大量的時(shí)間精力在手機(jī)應(yīng)用上，與手機(jī)界面發(fā)生頻繁的交互，但是復(fù)雜的功能和操作流程往往讓用戶望而生畏，沒(méi)有正確的用戶引導(dǎo)容易導(dǎo)致誤操作而令用戶產(chǎn)生挫敗感。如今的手機(jī)應(yīng)用功能和內(nèi)容不斷膨脹，產(chǎn)品變得越來(lái)越復(fù)雜難懂，怎么有效地引導(dǎo)用戶了解產(chǎn)品功能，學(xué)習(xí)產(chǎn)品的使用操作是需要設(shè)計(jì)師思考的問(wèn)題。關(guān)鍵詞：移動(dòng)終端 手機(jī)應(yīng)用 新手引導(dǎo)一、用戶引導(dǎo)的意義對(duì)于一個(gè)全新的互聯(lián)網(wǎng)產(chǎn)品，新手用戶在

2、嘗試使用時(shí)都會(huì)經(jīng)歷一些共同的情感歷程：他們會(huì)對(duì)新產(chǎn)品和新功能有一些好奇和茫然，希望能快速了解它的用途和使用方法。在嘗試使用時(shí)會(huì)比較敏感、小心，容易受挫。使用之后會(huì)對(duì)產(chǎn)品建立初步的評(píng)判，產(chǎn)品用起來(lái)是否順暢，是否簡(jiǎn)單易懂，能否快速完成任務(wù)。這些就是交互設(shè)計(jì)所追求的用戶體驗(yàn)，當(dāng)然，功能述求、界面美觀度、系統(tǒng)性能等很多因素都會(huì)影響用戶體驗(yàn)，但是影響用戶第一感受的用戶引導(dǎo)的作用同樣不可小覷，而用戶引導(dǎo)的設(shè)計(jì)目標(biāo)就是讓新手用戶快速、無(wú)痛苦地成為產(chǎn)品的中間用戶。二、用戶引導(dǎo)的范圍所謂用戶引導(dǎo)一般針對(duì)初次使用產(chǎn)品或產(chǎn)品中某項(xiàng)功能的新手用戶，為他們?cè)O(shè)計(jì)前一兩次使用產(chǎn)品時(shí)的體驗(yàn)，是一種能夠在較短時(shí)間內(nèi)將產(chǎn)品品牌、

3、功能、操作以簡(jiǎn)單易懂的方式傳達(dá)給用戶的方式。那么，用戶引導(dǎo)包括哪些內(nèi)容？究竟能幫助用戶解決哪些方面的困惑呢？（一）品牌引導(dǎo)。對(duì)于一個(gè)全新的互聯(lián)網(wǎng)產(chǎn)品，需要快速向用戶傳達(dá)產(chǎn)品的理念，形成關(guān)于其載體的良好印象，強(qiáng)化用戶對(duì)產(chǎn)品及產(chǎn)品系列的認(rèn)知程度。在用戶初次接觸產(chǎn)品時(shí)采用適當(dāng)?shù)挠脩粢龑?dǎo)，如在歡迎頁(yè)使用品牌色，品牌的logo，品牌slogan等，通常由文字、標(biāo)記、符號(hào)、圖案和顏色等要素或這些要素的組合構(gòu)成能夠有效幫助用戶了解產(chǎn)品的品牌理念。品牌引導(dǎo)也是產(chǎn)品使用前的熱身，用戶熟悉了產(chǎn)品氛圍后開始循序漸進(jìn)地對(duì)產(chǎn)品內(nèi)容進(jìn)行探索。（二）功能引導(dǎo)。全新的移動(dòng)互聯(lián)網(wǎng)產(chǎn)品在用戶的意識(shí)里只是一個(gè)模糊概念，需要產(chǎn)品的主

4、動(dòng)引導(dǎo)和吸引，要想使用戶對(duì)新的網(wǎng)絡(luò)產(chǎn)品或一個(gè)全新的功能產(chǎn)生興趣，則需要讓用戶在剛一接觸產(chǎn)品的時(shí)候快速了解它是什么，能幫助解決什么問(wèn)題，這就是對(duì)產(chǎn)品的功能引導(dǎo)。一般產(chǎn)品的功能按照重要程度可分為：核心功能和輔助功能。核心功能是產(chǎn)品的述求點(diǎn)，能夠?qū)崿F(xiàn)產(chǎn)品的主要用途，是具有代表性的、主推的特色功能。輔助功能是相對(duì)核心功能而言，其作用是幫助實(shí)現(xiàn)產(chǎn)品的核心功能。例如：微信的核心功能是語(yǔ)音對(duì)話，發(fā)送表情、換頭像都是輔助功能。（三）操作引導(dǎo)。當(dāng)一個(gè)新手用戶來(lái)到你的應(yīng)用中，開始探索界面并要完成某項(xiàng)任務(wù)時(shí)，他們想要馬上進(jìn)行一些簡(jiǎn)單的操作，這個(gè)過(guò)程中用戶可能會(huì)遇到兩種情況的迷惑，一是不知如何操作某項(xiàng)功能，二是根本就

5、不知道某些功能的存在。所以產(chǎn)品應(yīng)該提供一些簡(jiǎn)單的操作引導(dǎo)，鼓勵(lì)用戶主動(dòng)探索和學(xué)習(xí)，幫助他們解決迷惑更快地投入到產(chǎn)品的使用中。產(chǎn)品應(yīng)當(dāng)盡量避免用戶在眾多的功能按鍵和操作入口中迷失而不知所措，如果用戶感覺(jué)到無(wú)從下手，那么很可能感到挫敗、焦躁甚至憤怒，然后退出應(yīng)用徹底放棄對(duì)它的使用。三、引導(dǎo)模式（一）前置引導(dǎo)將引導(dǎo)集中在歡迎頁(yè)歡迎頁(yè)是一個(gè)特殊的表達(dá)空間，它存在于全新應(yīng)用和迭代期應(yīng)用中，當(dāng)初次開啟應(yīng)用時(shí)以單頁(yè)或多頁(yè)的形式呈現(xiàn)，下次開啟則消失不見(jiàn)。這個(gè)有限且短暫存在的空間卻可以承載非常重要的信息，如果能充分利用可以讓用戶還沒(méi)有正式進(jìn)入產(chǎn)品界面時(shí)就在心中塑造對(duì)產(chǎn)品的良好形象。1.分頁(yè)式引導(dǎo)。分頁(yè)式引導(dǎo)從字

6、面意思理解就是指將多個(gè)頁(yè)面串聯(lián)在一起組成一個(gè)完整的用戶引導(dǎo)。該引導(dǎo)方式適合于產(chǎn)品要傳達(dá)的內(nèi)容相對(duì)獨(dú)立的情況。在內(nèi)容的編排有兩種方式，一是提取內(nèi)容點(diǎn)一一羅列，也就是對(duì)產(chǎn)品具有競(jìng)爭(zhēng)力的亮點(diǎn)著重宣傳，直白表達(dá)。如移動(dòng)端新版支付寶的前置引導(dǎo)，用三屏分別簡(jiǎn)單介紹自助繳費(fèi)服務(wù)、方便的收付款方式、賬戶二維碼三個(gè)亮點(diǎn)功能。另一種內(nèi)容編排是融入場(chǎng)景，像將故事一樣委婉地向用戶傳達(dá)信息。情感渲染巧妙地將引導(dǎo)內(nèi)容按照一定的邏輯組合在一起，循序漸進(jìn)將用戶帶入某個(gè)氛圍，旨在讓用戶對(duì)引導(dǎo)內(nèi)容感同身受產(chǎn)生共鳴，然后靜靜等待用戶點(diǎn)擊“開始體驗(yàn)”那一刻。分頁(yè)式導(dǎo)航有橫向和豎向兩種瀏覽方式，左右滑動(dòng)屏幕瀏覽比較常見(jiàn)，用導(dǎo)航符引導(dǎo)頁(yè)

7、面（圖1），上下滑動(dòng)屏幕瀏覽方式更個(gè)性獨(dú)特，在形式上更符合時(shí)間邏輯，往往需要明顯的上下滑動(dòng)指引（圖2）。2.預(yù)置范例。利用產(chǎn)品本身的界面形態(tài)，預(yù)設(shè)一個(gè)典型的例子，讓用戶通過(guò)觀察學(xué)習(xí)來(lái)了解產(chǎn)品有哪些功能，都是怎么用。這種引導(dǎo)方式要求產(chǎn)品界面本身美觀具有創(chuàng)新性，案例典型具有視覺(jué)吸引力，滿足這些條件才能讓用戶有立刻搭建界面的欲望。im應(yīng)用的興起，特別是像語(yǔ)音助手、微信這樣的語(yǔ)音對(duì)話應(yīng)用的出現(xiàn)，越來(lái)越多的應(yīng)用開始增加小秘書、xx客服、xx產(chǎn)品團(tuán)隊(duì)之類的官方賬號(hào)用于用戶引導(dǎo)。這種方式是一種預(yù)置范例引導(dǎo)形式，它把冷冰冰的機(jī)械引導(dǎo)變成了有血有肉的擬人化引導(dǎo)。（圖3）（二）過(guò)程中的引導(dǎo)將引導(dǎo)拆分到使用過(guò)程中這

8、種引導(dǎo)方式并不是將引導(dǎo)內(nèi)容一股腦堆砌在應(yīng)用的前置頁(yè)讓用戶閱讀，而是用戶在使用產(chǎn)品過(guò)程中邊操作邊給出提示，這些指引和幫助是實(shí)時(shí)的，出現(xiàn)機(jī)制可以選擇第一時(shí)間出現(xiàn)，或在條件觸發(fā)狀態(tài)下出現(xiàn)，如需連續(xù)操作、失敗、超時(shí)、推送/更新等不同狀態(tài)下以不同的形式顯示相應(yīng)的引導(dǎo)內(nèi)容。josh clark稱這只模式為“just in time education”。1.任務(wù)演練。將引導(dǎo)拆分成多個(gè)步驟，“手把手”教會(huì)用戶學(xué)會(huì)操作，有時(shí)也將某些必要設(shè)置項(xiàng)融入這個(gè)環(huán)節(jié)，完成引導(dǎo)的同時(shí)也完成了某些設(shè)置（圖4）。2.聚焦提醒。通過(guò)界面中的半透明標(biāo)注或tips聚焦用戶視線，實(shí)現(xiàn)對(duì)界面具體功能和操作入口的指引與說(shuō)明。在使用該引導(dǎo)方

9、式時(shí)應(yīng)當(dāng)盡量避免遮擋界面中的重要信息，控制每屏標(biāo)注提醒的數(shù)量和出現(xiàn)機(jī)制，減輕對(duì)用戶的操作打擾（圖5、6）。3.弱文引導(dǎo)。弱文引導(dǎo)是指通過(guò)文字輔助說(shuō)明的方式為用戶做出引導(dǎo)，常見(jiàn)于輸入框，一種情況是弱文在輸入框內(nèi)，告知用戶框內(nèi)可輸入的內(nèi)容，當(dāng)光標(biāo)定位到輸入框時(shí)，弱文消失（圖7）。還有一種情況是在輸入框旁出現(xiàn)精短的文字信息，對(duì)該輸入框狀態(tài)或限制做出說(shuō)明（圖8）。4.操作演示。用一段簡(jiǎn)單的動(dòng)畫把功能演示出來(lái)，這是一種具有趣味性，學(xué)習(xí)成本低且淺顯易懂的手法。如bump的啟動(dòng)畫面為兩個(gè)手機(jī)碰一碰的動(dòng)畫形式，告知用戶像這樣操作就可以近距離傳輸數(shù)據(jù)（如圖9）；另一種動(dòng)畫引導(dǎo)形式是自動(dòng)展示，首次啟動(dòng)應(yīng)用時(shí)，隱藏

10、于主界面后的次級(jí)界面先曝光在逐漸消失，提醒用戶左右滑或上下滑可以看到相關(guān)功能。（圖10）（三）用戶引導(dǎo)的設(shè)計(jì)建議1.好的創(chuàng)意。大多數(shù)用戶喜歡標(biāo)新立異，追求個(gè)性化的東西，用戶引導(dǎo)的設(shè)計(jì)也應(yīng)該追求好的創(chuàng)意，帶給用戶驚喜，吸引他們探索更多內(nèi)容。2.簡(jiǎn)單易學(xué)。由于手機(jī)屏幕可視化區(qū)域較小，能承載的信息有限，并且手機(jī)作為移動(dòng)設(shè)備，它的使用環(huán)境非常復(fù)雜，使用時(shí)間碎片化，用戶正忙著從這個(gè)應(yīng)用切換到另一個(gè)應(yīng)用中，常常不愿在引導(dǎo)頁(yè)停留太長(zhǎng)時(shí)間，甚至?xí)^(guò)或忽略用戶引導(dǎo)，所以用戶引導(dǎo)的設(shè)計(jì)也應(yīng)該考慮到用戶操作手機(jī)的情景，去繁就簡(jiǎn)、言簡(jiǎn)意賅的向用戶傳達(dá)產(chǎn)品所要引導(dǎo)的內(nèi)容。3.友好的引導(dǎo)文案。引導(dǎo)文案應(yīng)當(dāng)清醒易懂，并且

11、具有描述性。別太過(guò)隱晦深?yuàn)W，那樣只會(huì)讓用戶摸不著頭腦，分散注意力，使他們更加迷惑。要抓住他們實(shí)際的需求和痛點(diǎn)，友好的將表達(dá)產(chǎn)品述求。4.原諒用戶出錯(cuò)。用戶在不了解產(chǎn)品的時(shí)候最有可能在界面到處亂逛，因此產(chǎn)品需要提供一個(gè)安全的、可供探索的環(huán)境?？紤]到用戶初次使用存在誤操作，用戶引導(dǎo)內(nèi)容可以做得更加細(xì)致和周到。結(jié)語(yǔ)移動(dòng)互聯(lián)網(wǎng)產(chǎn)品趨于同質(zhì)化，未來(lái)互聯(lián)網(wǎng)產(chǎn)品的競(jìng)爭(zhēng)還將體現(xiàn)在用戶體驗(yàn)的競(jìng)爭(zhēng)上。用戶引導(dǎo)是產(chǎn)品與用戶之間的直接對(duì)話，把握好用戶引導(dǎo)的設(shè)計(jì)將大大提升產(chǎn)品的用戶體驗(yàn)。盡管用戶引導(dǎo)的作用很難量化和評(píng)估，但只要旨在為用戶解除困，讓用戶放心地進(jìn)行探索并幫助他們輕松、順暢、無(wú)痛苦地達(dá)到目標(biāo)完成任務(wù)，那么這將是一個(gè)引人入勝的引導(dǎo)設(shè)計(jì)。指導(dǎo)老師：楊雄勇參考文獻(xiàn)1 戴力農(nóng).用戶體驗(yàn)超人性化設(shè)計(jì)方法m.上海：上海交通大學(xué)出版社，2009.2