新手引導設計,這樣改善太棒了!

新手引導,又可稱為新手幫助。對於新手引導使用最多的就是電子遊戲行業,特別是國內的網路遊戲行業,作用就是將規則以簡單易懂的方式,在較短的時間內傳達給娛樂活動的參與個體。主要形式有圖片、文字、音效、視頻、互動操作。

今天想用5W1H的方法來分析下新手引導頁面的設計。5W+1H:是對選定的項目、工序或操作,從原因(何因Why)、對象(何事What)、地點(何地Where)、時間(何時When)、人員(何人Who)、方法(何法How)等六個方面提出問題進行思考,串起來將就是何人在是何時何地因為什麼原因做了何事,是怎樣做的

發現在分析問題的時候,5W1H它能幫助自己理清頭緒。如果不知道從哪裡入手就將這些因素羅列出來一個個進行分析。

一般情況下,在APP主功能設計完成之後,我們會花很一些精力去做新手引導,一方面是將APP的功能介紹給用戶,另一方面是想教會用戶使用APP或者展示出某些功能的入口等。在工作中聽到一位資深的開發人員說到一句話深感贊同,就是,最好的APP設計就是不需要新手引導。也許這種說法偏了極端了一點,很少有人能在自己沒有多少經驗的前提下就做到這樣完美,所以合適的新手引導還是有它存在的必要。

不得不承認在現在市面上各種新手引導中,除了極個別的能讓自己停下來逗留一會,自己的第一反應不是好好看它,二是馬上、快速、厭煩地跳過或者叉掉,更多的是覺得多此一舉。而那些極個別的當然也有它的能跳出來的特點,待會一一細講。

新手引導的常見做法

1.黑色蒙版overlay在app最頂端,highlignt出來視線集中的地方,用白色的字進行標註和解釋。

2.一小卡片的方式進行簡單的提示,這個程度上比第一種要親切,讓用戶接觸到真實的APP的界面更多。

3.在合適的時候彈出的popup(彈窗)

以上三種做法是最常見的新手引導,效果是有的,但咱們在此基礎上如果能改善一些,效果會更好~

改善方法:還是從5W1H的原則出發,一個個點進行擊破

1.何人Who。在設計的時候經常聽到一句話叫做「從用戶出發」。首先我們需要分清楚用戶是哪些人,是一類人還是多類人。一類人的話就開始分析這些人有什麼特點,能接受什麼樣的APP設計風格,多類用戶的話怎樣進行分類。

最常見的多類用戶就是個人與團隊,VIP與非VIP的身份不同。用戶群分開之後,針對性就更強。咱們在這一點需要討論的是,要有這個分類的步驟,如下圖。

2.何時When。需要的時候才進行引導,不在不恰當的時候給用戶添麻煩,也不完全不吭聲進行隱藏。

比方說,咱們在用某寶進行購物的時候,選東西和找東西是一個步驟,期間花費的時間可能是幾分鐘,幾小時,甚至是幾天,而填寫收貨地址又是另一個任務,倘若一股腦在APP打開的瞬間全部拋來,用戶沒有精力看,就算看了也記不住,還會引起反感。可當用戶在選完商品之後填寫收貨地址時,這個時候再進行引導,不僅新手引導起了作用幫助用戶完成任務,同時也能讓用戶感到貼心,增加用戶對產品的好感。

同一件事,在不同的時間去做會產生兩種完全不同的效果,重點在於,在當時的場景下,用戶真正需要的是什麼,跟談戀愛是不是也是一個道理?

3.何地Where。APP的新手引導除了首次打開APP,以及上一條所說在合適的需要的原則下,還有地方可以利用就是空狀態。空狀態的情況下,也可以給予用戶提示去做一些任務,滿足用戶的需求。如下圖。

4.何因Why。解釋清楚為什麼要做這一步,這一步可以為用戶帶來什麼樣的好處,而不是給企業或者APP本身帶來什麼樣的好。文字進行簡潔,控制在一句話之內。如下圖。

5.何事What。即用戶所要做的事情,在前面幾條都鋪墊完全之後,用戶就會更滿意地進行這個操作了。

6.何法How。除了使用圖片加步驟的引導之外,方法可以朝其他方面進行擴展。比方說弄個小型的常駐機器人或者客服窗口,進行問題回答,需要的時候再用;用趣味性的遊戲的引導方式,讓用戶做旅客地圖;或者用潮流的酷炫的視頻進行引導等等。

解決問題的方式有很多種,5W1H只是比較常見的其中一種。在工作中,怕的不是問題如何艱巨,怕的是自己沒有理清楚思緒,不知道如何下手,像這樣用拆分的法則將問題進行拆分,進行一個個地解答,未嘗不是一種好的思路。希望有一天,能設計出不需要新手引導的APP~望共勉~

敬請期待下篇更新landing page的設計方法~

其它文章

《設計背後的思維能力》

要在最快樂的年紀 活的精彩且迷人

職場設計教程搶先看~一枚愛折騰、愛健身的設計師妹紙~

詳情請關注微信公眾號:Sophia的玲瓏閣,獲取更多有關交互、健身及其它相關信息。

推薦閱讀:

新年特輯 | 設計師如何"有品質"的保存發量?
PC端聊天窗口的「 視覺&交互 」設計參考
友愛·海游城農貿市場設計
一個設計師,對這個世界的恨意是有多大……
帶你領略詩意居住空間的春夏秋冬

TAG:新手引導 | 設計 | UI設計師 |