超全面的用戶引導設計指南
超全面的用戶引導設計指南-移動閱讀二維碼

網易UEDC-任軼:用戶引導,在生活中隨處可見。醫院的科室指向標、交通警察的指揮手勢、男廁內為了達到“精準射擊”的小蒼蠅……

然而,當我們看到不知是該“推”還是“拉”的門把手、看不出狀態的開關、摸不清頭緒的指示標,便會產生迷惑甚至焦躁。

引導是通過某種手段或方法,干預目標對象的決策和發展,促使其更快地接近目標。

工作中,臭臉君經常糾結如何告知用戶功能新增和變更、如何讓用戶按照我們的預期順利使用產品。為什么說糾結,因為既然是引導,都是附加在原有產品功能之上的,往往不是用戶心理預期之內出現的東西。正因如此,我們更需要謹慎思考,選擇最恰當的方式實現我們的既定目標。

用戶引導的目的

從用戶的角度來說:降低學習成本,迅速上手使用產品;告知有價值的信息,減少時間和精力開支;提前預知幫助,愉快的學習使用產品。

例如App Store的精華產品Paper,作為繪圖軟件它的交互建立在很多特殊手勢之上,還定義了一些帶有品牌特色的操作規范。要知道用戶沒有多少時間和耐心去摸索一個完全陌生的產品,因此Paper為用戶使用初期做了大量的引導。

從產品的角度來說:需要通過用戶引導,讓新用戶快速了解使用產品;吸引用戶使用操作新功能或指定對象;提前給予用戶幫助,提升產品體驗的愉悅度。

用戶引導三要素

如何做引導設計?首先我們需要想清楚以下三個要素之間的關系

  • 目的:我們想達到的目標是什么?用戶能從中得到什么好處?我們能從中得到什么好處?
  • 用戶:目標用戶是誰?新用戶還是老用戶?活躍用戶還是輕度用戶?
  • 場景:被引導對象的使用場景是怎樣的?需要在什么場景下觸發?

不同的用戶、不同時期、在不同狀態下,希望得到的幫助不盡相同。譬如高級功能在新用戶早期就不應給于引導,收效不大還會提升了學習成本。

我們不妨多反問自己幾個問題

1,這個功能真的很必要引導和提醒用戶嗎?

2,這個功能是需要讓所有用戶都知道還是某一類用戶知道就可以了?

3,這個提醒是需要所有場景都提示,還是到某一類特定場景才來提示呢?

……

如果以上幾個問題你都能胸有成竹,那就開始吧騷年~

觸發點的選擇

用戶引導的觸發點,就是在什么地方觸發引導。是用戶打開程序時觸發?到達特定頁面后觸發?操作了指定功能后觸發?到了某個時間點觸發?

作為設計師我們一定要懂得取舍和克制,什么都想說就等于什么都沒說。想象一下用戶隔三差五就能碰到引導提示,你的好意成為埋伏在產品中的地雷,而用戶也被你一手培養成“拆彈專家”。

切勿像下圖這樣,一股腦的將所有東西拋給用戶。

舉一個觸發點相關的小栗子

掃一掃功能中,易信和微信都很貼心的引入照明功能。目的是為了滿足光線不好時可以輔助用戶完成掃描功能。

左邊是易信的界面,“照明”按鈕是默認顯示在取景框下方,位置選在頁面中間倒也很好發現。而右邊微信對場景進行了細分,環境光線理想時不顯示照明提示按鈕,當設備檢查到環境較暗,“輕觸照亮”按鈕便會出現。一對比便高下立見,微信不但保障了正常狀態下頁面的純凈,而且從無到有的閃現比默認常置更能引起用戶注意。

引導的類型

信息提示類

用信息展示的方式,幫助用戶理解產品的功能和所需要執行的操作。最常見的就是“小紅點”“未讀提醒”“更新提醒”這樣的提示。

從左到右依次為:云音樂頁面中的紅點和數字標識、聚劃算中的結束時間提示、唯品會中清空購物車的倒計時。

功能提醒類

出于有些icon達意不明確、有些功能被收起或隱藏在手勢中、主打功能希望被用戶快速掌握等原因,需要加以引導降低用戶的學習成本。

類似的提示案例很多,在這里就不贅述了,下面分享兩個臭臉君覺得不錯的例子。

左圖是微信預知引導發圖的功能,當檢測到相冊里有新增圖片時,一定時間內點擊微信的“+”,就會出現一個發圖的小浮層。此功能引導已成為很多應用模仿學習的對象。

右圖是支付寶的對話頁面。你是否遇到過這樣的情況,當你打開支付寶想給對方轉賬時,點擊“發送”后才發現發過去的是個文本信息= =。應該是支付寶的設計師也嗅到了這個痛點,將此問題優化為檢測到用戶輸入了純數字內容時,便在鍵盤的上方出現一個“給對方轉賬n元”的按鈕。

臭臉君最近一次腦袋短路時,看到此按鈕的瞬間就感動到內牛滿面?!澳愣摇钡恼J同感油然而生~~

操作引導類

操作引導分為強制性的和非強制性的。強制性的主要是登錄、注冊、安全認證、激活相關流程,需要身份驗證后才能繼續進行后續的操作;非強制性的則多是鼓勵用戶操作,例如完善的資料、關注更多好友、分享轉發等,這類引導最好給予一定的激勵。

從左到右依次為:閑魚引導用戶開通閑魚號,好處是可以看到sei在關注你;Facebook引導用戶授權訪問通訊錄,可以找到更多的好友;騰訊新聞引導用戶登錄注冊,可以查看更多有趣的個性化推薦。

內容推廣類

除了自身功能之外,產品中也會包含一些額外的推廣性引導,最常見的就是產品中植入的廣告。

引導的形式

引導頁

引導頁通常是APP下載/更新第一次打開后,來向用戶展現產品中的功能和操作方法。通常用戶對信息吸收的效率并不高,用戶更希望趕緊體驗產品而不是看這些教導。因此引導頁的數量一定不要過多,頁面簡明扼要、中心明確才是王道。

toast提示

toast是一種極為輕量的提示方式,通常作為功能操作后的反饋。toast出現的時間都很短,不要指望用戶能真正注意到你在講什么。因此不要將其用作重要對象的引導形式,大多是可有可無或是會反復出現的,其次語言精練也是必要的。頁面遮罩遮罩式引導為一種比較強勢的引導,通過直接蓋住界面來強調當前需要引導的內容。一般遮罩層為半透明,在此圖層上,通過各種圖形來結合被蓋住的界面內容,引導用戶聚焦到重要的信息。遮罩式浮層無法自動消失,而是需要用戶操作(指定操作/非指定操作)后才能隱掉。氣泡/浮層

氣泡/浮層式引導是一種量級輕但是目的性很強的引導方式,一般是半透明浮層結合文案的設計模式。大部分浮層模式帶有指向性的箭頭,可以用來提示重要功能或者隱藏操作。通常是非模態的,顯示3-5秒后自動消失,對用戶的干擾較小。也有一些重要功能使用模態浮層,需要用戶明確操作后才能隱掉。

嵌入式(局部嵌入/整體嵌入)

嵌入式引導分為局部嵌入和整體嵌入。局部嵌入就是在當前頁面內容上增加引導提示。為了保證對象不埋沒在信息流中,有效地引起用戶注意,需要從視覺上做處理。整體嵌入則是將引導做為一個整體代替頁面內容的顯示,多使用在“空狀態”的情況下。

操作示意

操作示意較常采用簡短的動畫向用戶展示操作方法,也不乏靜態圖片配以描述的方式。這種方法的好處是很直觀,用輕松淺顯的手法,就能傳達給用戶新鮮的功能和趣味的用法,比生硬的文字來得體貼。

互動式引導

互動式引導通常比較隱蔽,是在用戶與產品之間互動的過程中引導用戶完成操作。常見的如下拉刷新、底部上拉等手勢互動?;邮揭龑б步洺0l生在語音操作中,例如用戶使用麥克風的過程中,界面隨著用戶的聲音的輸入而產生互動。

彈窗

與遮罩式相同,彈窗也能達到很強的引導效果且對當前操作具有很大的阻斷力。通常以文案配具體操作的形式呈現,可輔助搭配圖片烘托主題。需要用戶有明確的選擇后才能關閉彈窗。

激勵引導(任務激勵/榜樣激勵)

激勵引導常見的有任務激勵和榜樣激勵。任務激勵是通過讓用戶做特定的任務從而獲得相應的好處,是APP拉新、促活慣用的方法。榜樣拉新則更偏向心里戰術,比如給自己的偶像打榜,激發起人性的好勝心通過購買數量的多少來表達對TA的熱情。

自體變形

自體變形是元素自身發生改變,可以是純視覺上的也可以配合動畫效果。它沒有額外增加其他元素,也不會像膏藥一樣覆蓋在頁面上,只是通過效果變化達到與同組的其他元素作區分。如上圖淘寶首頁中天貓國籍的動畫形式。

引導的強弱與頻率

根據出現時是否有阻斷、消失時是否需要操作,我們可以劃分出不同強弱的引導提示。

弱提示通常情況下它的出現不一定能讓每一個用戶都注意,或者不需要讓所有用戶都完整的了解。這樣的提示不會阻礙用戶當前的閱讀和操作行為,還可以自動消失;強提示需要用戶一定注意到的,它會阻斷用戶當前的使用且需要有明確的指定操作才能消失。

頻率,是指單位時間內完成周期性變化的次數。是確定了引導的觸發點和類型后,另一個不可忽視的思考要素。

引導的形式太強會干擾用戶當前操作,太弱又可能被忽略。即使用戶真的看到了,也可能遺忘掉。為了能讓引導的存在不只是滿足一下設計師自己的心理訴求,我們也需要把握好它出現的頻率,尤其是類似toast、浮層這種很容易被忽略的引導。

在云音樂的最新版我們引入了截屏分享功能。雖然分享浮層出現后3秒會自動消失,但為了防止每次截屏都出現浮層給用戶帶來干擾,我們在設置頁里加入了功能開關。那么問題來了,如何告訴用戶有開關這個事情呢?

我們的做法是:功能上線后針對所有用戶,首次手動取消浮層時(點擊浮層右上角的“×”、點擊半透明遮罩)即toast提示“可在設置中取消截屏分享提示”,之后每累計手動取消3次提示一次。

注意事項

  • 保證引導的有效性

用戶引導是對產品內容以及形式的輔助說明,存在即要有意義。

  • 觸發場景準確

用戶在瀏覽/操作時都有一定的使用場景,根據場景觸發相應的用戶引導,保證在用戶需要的時候出現引導,才能達到接受度的最大化。

  • 簡單易懂,突出核心

不論什么類型的引導,它們的目的都是為了讓用戶更好地去使用產品、減低認知和摸索學習的門檻。復雜繁瑣的內容會給用戶帶來壓力進而失去耐心,也很容易就被遺忘。

  • 與產品基調一致

用戶引導的視覺風格、語言表達要與產品定位、產品理念相一致。因地制宜的前提下保證全局的一致性,切記沒有克制地隨意發揮。這樣的好處是可以讓用戶在看到引導的時候對產品有一個大致的基調認識和感受。

啰嗦了這么多,文章的末尾臭臉君突然想感慨一下

用戶引導是什么:是在對的時間遇到對的你~~

歡迎關注網易UEDC的微信公眾號:


本文鏈接:http://www.casaleticia.com/user-guide-design-guidelines.html
本文標簽: , , , ,