您現在的位置是:首頁 > 網路遊戲首頁網路遊戲

使用者體驗之如何設計一個完美的新手引導流程?(附帶案例)

簡介新手引導流程是將新使用者融入到產品中的設計,優質的引導設計可以讓訪客與你的網站應用程式數字產品進行深入互動

如何做新手引導

以下內容由摹客團隊翻譯整理,僅供學習交流,

摹客iDoc是支援智慧標註和切圖的產品協作設計神器。

如何設計一個完美的新手引導流程?設計之前,不妨想想你最近一次下載新應用程式或登陸新網站的場景。你知道該怎麼操作嗎?它們的新手引導流程是否幫助你迅速完成互動了呢?很多時候,一個簡單的新手引導流程能給使用者留下良好的第一印象。

所以在網站和應用程式設計中,新手引導流程設計也十分重要,設計師需要從訪客的角度來設計互動體驗。此類設計一般包含幫助訪客在網上商店找到商品、瞭解如何購物、玩遊戲或註冊電子郵件等互動。

新手引導流程是將新使用者融入到產品中的設計,優質的引導設計可以讓訪客與你的網站/應用程式/數字產品進行深入互動。接下來小編將介紹如何設計這樣一個優質的引導流程,並附帶一些例子幫助大家理解。

一、視覺流程設計

使用者體驗之如何設計一個完美的新手引導流程?(附帶案例)

一個好的新手引導流程可以讓訪客一眼明白如何開始、進行和結束產品的註冊和體驗流程。

當用戶需要幫助或獲得資訊時,他們至少應該知道從哪裡入手。這裡的設計通常可以用一個大圖,附帶一段介紹文字呈現。(可以自行腦補下)

接著需要設計一些簡單的互動,比如填寫表格,點選下一步學習指南或新手教程影片等對訪客進行引導。最後,彈出使用者完成所有操作的通知,新使用者就成功地結束註冊/登入流程。(這種成就感可以幫助使用者保持線上狀態。)

最後的通知還應該包含引導使用者進行正式體驗產品的互動,比如“現在你可以開始遊戲了”或者“點選這裡開始”。

二、向用戶展示你希望他們做什麼

使用者體驗之如何設計一個完美的新手引導流程?(附帶案例)

切記:

新手引導流程一定要簡單易懂!如果你的網站或應用程式使用使用者不常見的模式/流程,那麼使用者的第一印象往往不會太好。

直接向新使用者展示他們應該做什麼操作,藉助文字提示或簡短的影片告知應該如何進行。清楚地表達互動目標和預期結果,以及使用者如何達到目標。

上面的Milanote在網站主頁上就做得很好,在主介面有一個電腦螢幕顯示正在使用的應用程式。無論訪客是短暫停留還是迴圈播放,這個簡短的影片都能向網站訪客展示如何與這個網站及相關應用程式進行互動。

三、不要陳述顯而易見的事情

使用者體驗之如何設計一個完美的新手引導流程?(附帶案例)

當你開始思考指令和註冊流程時,很容易就會忘乎所以,請一定要保持理性。

提供的說明儘可能簡單明瞭,並且只在必要時才會出現。僅為不熟悉的操作或導航提供指示和資訊。

沒有必要去解釋明顯的互動,這樣反而會以冗餘的方式拖沓了註冊流程,從而使使用者感到沮喪。操作說明越簡單越好,且只在必要時會出現。

伊麗莎白•泰勒網站(見上圖) 在頂部有一個輪播圖,上面有關於如何使用它的視覺指導。這使得使用者更容易按照自己的節奏來處理內容。

四、提供一份吸引眼球的文案

使用者體驗之如何設計一個完美的新手引導流程?(附帶案例)

平淡無味的文案往往無法吸引訪客眼球。每個小對話方塊——甚至是那些僅有幾個單詞的對話方塊都必須生動有趣。與此同時,注意與網站其他部分或應用程式設計的語言保持一致。

技巧提示:友好地使用主動動詞和直接指示。Slack在這方面做得很好,它的機器人服務讓人感覺非常逼真(即使你明白它並不是真人)。

不確定從如何著手文案設計?小編這裡有10個不錯的文案撰寫技巧可以參考。將此作為編寫對話方塊和資訊指南,可以幫助訪客獲得更佳的登入使用者體驗!

五、明確使用者是否必須註冊

使用者體驗之如何設計一個完美的新手引導流程?(附帶案例)

新使用者是否必須註冊你的網站或應用程式?如果不註冊,他們是否還能繼續使用?這些需要明確地告訴使用者,不要讓使用者去猜。

首先,要非常明確使用者註冊的期望是什麼,以及註冊會給使用者帶來什麼好處。接著免費提供他們一個“試用”,讓他們對你的應用程式或網站產生興趣。

然後,要求新使用者註冊去解鎖更多的功能或內容。使用一些只需要填寫基本資訊的表單,儘可能讓註冊或者流程保持簡單。

六、提供一個新手教程

使用者體驗之如何設計一個完美的新手引導流程?(附帶案例)

從第一次登陸你的網站或應用程式到成功註冊的過程。如果必要的話,可以自己先畫一個流程圖。

建立一個新手教程也可以幫助你確定流程設計是簡單的還是複雜的。

這不僅幫助你確定流程設計是否簡單,它還可以為潛在的教程提供一個方向。該教程向用戶確切地展示應該做什麼以及如何與網站/應用程式互動。

Ryan Osilla對常見的網站如何設計完美的新手引導流程進行了深入研究。最後決定對於建立帳戶的步驟,直接使用流行的工具舉例,如LinkedIn、GitHub、UpWork和Twitter。(你很難找到比這更好的方案來展示註冊流程了。)

雖然Osilla列出的所有示例都很簡單,你也可以使用這些資訊建立一個教程,其中對特殊操作需要具體說明。一旦構建了流程圖,再建立教程就容易多了。

七、一次展示一個特性

使用者體驗之如何設計一個完美的新手引導流程?(附帶案例)

一個註冊登入流程,提供或者跳過簡單易懂的步驟指示時,往往能給使用者留下良好印象。請記住,創造使用者能對數字產品的興奮感和理解的互動設計,這樣他們才能高效地完成這個註冊登入流程。

提供一個關於註冊教程播放時長的線索。頁面顯示多螢幕教程或資訊的進度欄,可以包含跳過或返回的按鈕。

同時,不要忘記關注使用者的利益。怎麼才能讓你的網站或應用程式變得有趣? 為什麼訪客要完成註冊登入流程並繼續體驗? 把其中的好處展示給每一個訪問你網站設計的人。

結論

登入體驗的目的是為使用者提供資訊,幫助他們更好地理解和使用你的網站或應用程式。記住,要堅持提供有效的資訊,向用戶展示在可能的情況下應該做什麼,並提供導航。

保持流程簡單流暢,使用優質的影象和有趣的文案,並獎勵使用者完成登入任務。

註冊登入流程中一定要包括你讓訪客與你的網站保持互動的所有操作。它可以是一款遊戲或一種活動形式;但也可以深入地挖掘內容,設計一些他們喜歡的東西,讓引導流程帶來最好的體驗。

原文作者:Carrie Cousins

學習工具,但不受限於某種工具。

摹客iDoc,高效協作,從產品到開發,只要一個文件,讓你的團隊高效協作!

Top