淺析:APP使用的指引模塊和使用的組件和技術

編輯導讀:用户在使用新的一個產品時,最先遇到的就是引導界面,幫助用户更好更快地熟悉產品。本文將從四個方面,對引導功能進行深入分析,希望對你有幫助。

淺析:APP使用的指引模塊和使用的組件和技術

引導是讓用户熟悉新界面的過程。它可以包含以下一個或多個組件:功能升級、自定義和説明。

想象一下,你突然接到一份新的工作任務,卻沒有解釋你的主要工作任務或如何完成它們。你可能不會很成功(無論如何衡量)或花費了很長時間,對嗎?有效的入職流程是新員工成功的關鍵。此外,每次引入一個新流程時,都需要再次進行培訓,以便讓每個人都採用它。

用户界面也是如此,尤其是當界面是要重複使用的時候。在本文中,我們將重點介紹移動應用程序的引導。

我們將” 引導”定義為讓用户熟悉新界面的過程——學習使用不屬於常規應用程序界面的專用流程和UI元素的過程。這不僅包括教用户如何與界面交互(常見的誤解),還包括完成任何必要的設置。此外,引導不僅限於首次使用的用户——在發佈新功能或重新設計時,現有用户也可能會收到引導。因此,引導可以在用户生命週期的多個點發生,而不僅僅是首次啓動。

一、儘量跳過引導

一般來説,引導是有問題的,原因如下:

  • 交互成本更高。引導流程需要用户的關注與嘗試。即使用户決定跳過您的引導,他們仍然需要單擊或點擊才能這樣做,從而增加了用户在應用程序中完成任務的交互成本。
  • 內存壓力。引導通常用來幫助用户記住界面的某些東西(比如圖標的含義或者如何做某事),但是人類的記憶是有限的。與其讓用户記一些關於應用的內容來消耗他們的內存,不如在現有的思維模型上構建,花點時間讓你的應用更容易被使用。
  • 可能無法提高用户性能。我們知道引導的一些缺點,但好處有時不太明顯。然而,我們對紙牌教程(一種指導性培訓方法)的研究表明,這些教程並不能提高任務績效。

因此,我們建議專業人士在任何可能的情況下避免創建應用程序的引導,而應該將您的資源用於UI上,使其更加好用。

二、移動應用程序何時需要引導

用户總是需要(通常時間做到最短的)時間來學習一個新的應用程序,但這並不意味着所有的應用程序都需要單獨的引導流程或冗長的解釋。

對於大多數移動應用程序,用户應該能夠通過使用程序來學習界面,因此不需要指導性的引導流程。即使是對於相當複雜的移動應用程序,通過在情境中向用户展示提示,而不是向他們提供解釋應用程序UI的教程,這樣對於學習通常更有效——人們根本不可能(甚至試圖)記住很多信息,尤其是當他們不確定是否真的必須使用這些信息時。

此外,雖然錯誤消息是用户體驗的一個負面元素,但錯誤消息可以在“可教的時刻”向用户傳授更多關於應用程序的知識,在這個時刻,人們有很小的動力去閲讀一些關於如何解決問題的單詞。

在移動應用程序中,只有少數情況下,引導頁面是有用的:

  • 您需要用户信息才能開始。例如,銀行應用程序可能需要用户在使用該應用程序之前創建一個帳户並確認其身份。
  • 應用程序功能根據用户的情境和偏好進行了高度定製。例如,一個節食應用程序可以從瞭解用户當前的體重中獲益。
  • 重要的應用程序特性或工作流對於應用程序來説是相當獨特的,可能與標準的UI模式不同,或者是比較新穎的和不熟悉的。例如,當移動支票存款首次作為個人自動取款機存款的替代品推出時,這種新穎的功能值得使用正式的引導流程。

如果你還不確定你的應用是否需要引導,那麼在投入費用去增加額外頁面之前,可以先測試沒有的引導頁面的情況。你的用户在第一次使用這個應用程序(或一個新功能)時是否表現出困難?

如果是,首先考慮是否可以對應用程序設計進行一些更改,使其更易於學習。如果這無法解決問題,試着建立一個引導流程的原型並進行測試。它能解決你的問題嗎?人們能更流暢地使用這個應用嗎?只有在答案是肯定的情況下,才值得在UI中添加專門的引導流程。

三、它有哪些內容:引導組件

在移動引導流程中有三個經常遇到的組件:功能提升、定製和引導説明。引導流程可能包含一個或多個這些組件。

淺析:APP使用的指引模塊和使用的組件和技術

在引導流程中有三個常見組件:功能提升、定製和説明,引導流程可以包含一個或多個這些組件。

在接下來的內容中,我們將研究移動應用程序中的每一個組件,並討論它們是否實踐有用。

四、功能推廣

基於功能的引導流程可以使用户瞭解該應用程序可以做什麼,因此,它往往被視為營銷。

淺析:APP使用的指引模塊和使用的組件和技術

Productive是一款習慣追蹤應用程序,它提供了入門培訓,展示了該應用程序可以執行的一些操作,比如設置提醒和查看統計信息。

避免在首次啓動時啓用功能推廣。用户很少無緣無故地下載應用程序;因此,他們很可能會跳過冗長的引導流程。該規則的一個例外是真正的新功能或是高級功能,例如前面提到的移動存儲示例。

不過請記住:這項技術已經不是什麼新技術了,因此現如今的應用程序不應該在首次發佈時對其進行推廣!一個功能從新奇到廣為人知的速度各不相同,這取決於它的使用頻率和其步驟的可記憶性。

在應用商店頁面上展示這些類型的推廣界面,而不是將這些信息提前告知用户,因為在這裏用户可以瀏覽新應用並比較功能。

淺析:APP使用的指引模塊和使用的組件和技術

Productive應用程序還在其蘋果應用程序商店頁面的預覽部分提供了推廣內容。在應用程序商店和應用程序中都包含這些內容是多餘的。

除了在應用商店中突出顯示功能外,另一個解決方案是通過情境幫助用户在應用程序中突出顯示功能。與其在用户有辦法使用它之前推廣這個功能,不如在對用户來説可行的情況下對其進行突出顯示。例如,當用户記錄了7天的習慣數據後,應用程序可能會提供一個視覺提示(比如突出顯示該應用程序的統計信息部分),並簡要提示用户如何處理這些數據。

儘管這種類型的入門功能在應用程序首次發佈時不太有效,對首次使用的用户也沒有幫助,但是在發佈新功能時顯示功能入門可以對現有用户有所幫助。 例如,Chase使用了一種卡片流程來介紹新的預算功能。

淺析:APP使用的指引模塊和使用的組件和技術

大通銀行應用程序通過卡片組功能的入門流程提示現有用户,以突出顯示新的應用程序功能(例如信用卡消費彙總)。流程很短,甚至允許用户完全跳過它。

將引導流程的使用限制在對用户來説是真正新的功能上,而不是在應用程序中已經使用了一段時間並且利用率較低的功能。持續地突出顯示用户可能已經熟悉但並不相關或不需要的現有功能可能會讓用户感到厭煩,並使他們忽略所有新功能,甚至是那些合理的新功能。

五、定製

許多應用程序請求用户數據以便定製用户體驗。例如,用户可能會自定義應用程序的內容或視覺設計。然而,並不是所有的自定義都應該在引導期間完成。

特別是,視覺設計定製,如選擇配色方案,不應該在引導流程中。在真正使用之前,人們很難知道他們會喜歡這個應用程序的外觀,或者為什麼某種視覺設計會比其他的更好。

而且,一般來説,很多研究表明人們通常會堅持默認設置。與其讓他們做出選擇並增加認知負荷,不如做你的功課,進行一項研究,然後找出哪種設計最好。

淺析:APP使用的指引模塊和使用的組件和技術

Reflectly應用程序包括了視覺設計定製。該應用程序強迫用户在不知道UI外觀之前就選擇一個配色方案。

這並不是説您不應該提供自定義視覺設計的功能,但是您可以將其保存以備以後使用。在你的引導流程中,它不值得優先考慮。

淺析:APP使用的指引模塊和使用的組件和技術

Any.do允許通過應用程序設置進行視覺設計定製,並且在第一次啓動時不會提示用户選擇主題。

內容定製可以創建相關的體驗,而且更適合初始應用的引導。在應用程序中有很多內容定製的例子。例如,對於一個語言學習應用程序來説,選擇一門語言並確定你對這門語言的精通程度對於這個應用程序的使用是至關重要的。

淺析:APP使用的指引模塊和使用的組件和技術

Fitplan對新用户進行了一個簡短的調查,以便根據推薦的鍛鍊方式量身定製應用體驗。該應用程序還提供了一個簡短的説明,説明它需要什麼信息以及為什麼需要。此外,雖然這個調查是自動顯示的,但是有一個跳過它的選項,以及一個進度指示器。

當提示用户定製他們的體驗時,保持簡潔。解釋為什麼需要這些數據以及如何使用這些數據(如上面的Fitplan示例)。考慮你是否真的需要這些信息來幫助用户開始並在APP中取得成功。如果你不能解釋為什麼在啓動時收集這些數據是有益的,那麼這些信息應該稍後收集,用户能夠更好地理解為什麼需要這樣做。

六、説明

説明的目的是教用户如何使用界面,引導流程不應該被用來補充糟糕的設計。與創建教學內容相比,將資源花在UI的可用性上更好。也就是説,在某些情況下,説明是必須的。

例如,應用程序的特性或工作流是獨特的,與標準UI模式不同,或者對用户來説是新的或不熟悉的)或預期的(手機遊戲)。

引導流程有多種形式:卡片教程、上下文幫助、交互式演練等等。無論採用何種形式,引導説明都應該簡潔、可選,並且應該只突出用户使用APP需要知道的最小部分。

下面是一些在移動應用中使用引導説明風格的例子。

七、卡片組

卡片組教程通常會在應用啓動時立即顯示,並提供有關如何以卡片組格式(類似於輪播)使用其界面的説明。這種類型的引導,尤其是在相對簡單的移動應用程序中,往往會使界面看起來比實際界面更加複雜,並會佔用用户的內存。

因此,我們不建議您在紙牌遊戲中使用。就是説,如果您仍然選擇實施它們,請對您的用户好些,並確保有一個高度可見的“跳過”選項,將卡的數量減少到僅關注需要了解的信息,並且只關注每張卡的一個概念。

淺析:APP使用的指引模塊和使用的組件和技術

什麼預測?!使用卡片組教程來提供指導性入門信息,並告知用户某些控件在應用程序中的位置。標準圖標的解釋是無用的,只會浪費用户的時間。

八、引導疊加

引導文字和引導標記共同使用是另一種引導方式,用於向用户顯示UI中一些核心功能的位置以及這些元素的作用。

實施引導疊加時,請確保內容及時(例如在用户第一次接觸某個功能時)且內容不引人注目。這種類型的引導方式在用户第一次嘗試完成任務時會很好地配對,因此,隨着用户的前進,它會提供額外的信息。

因此,説明性疊加層通常是很好的元素,而不是不需要的元素。

淺析:APP使用的指引模塊和使用的組件和技術

NOAA Weather應用程序通過在一個屏幕上突出顯示所有可能的交互來使用户超載。對於標準UI元素(如“共享”和 “設置”圖標),此實現非常麻煩且不需要。

淺析:APP使用的指引模塊和使用的組件和技術

Checklist使用説明性疊加層向用户顯示一些核心功能,例如如何對裝箱單進行分類和標記。但是,該説明性副本用於解釋不熟悉的字詞(左:在這種情況下,是討論裝箱單時的“類別”)和未標記的圖標(右:橙色大標籤)。在這種情況下,針對教學內容的較不引人注目的解決方案將是彈出提示,因此,如果用户需要清晰度,則可以輕按(甚至更好:改進UI而不是在一個不好的情況下提供清晰度)。

九、交互式引導

如果您的應用程序比以前的示例更復雜,並且您認為由於設計新穎或不熟悉而需要使用説明,請考慮進行交互式引導。交互式引導使用户可以邊做邊學(最好是在低風險的環境中)。成功完成之後(例如,簡短並僅強調新內容或不熟悉的內容,如上所述),交互式引導將更像是練習,而不是教程。

淺析:APP使用的指引模塊和使用的組件和技術

目標跟蹤應用程序Fabulous使用交互式引導來使用户熟悉相對簡單且熟悉的工作流程,是不必要的。

淺析:APP使用的指引模塊和使用的組件和技術

Temple Run 2提供了一個交互式引導,可讓用户在玩簡單級別的遊戲時及時獲得屏幕指示。例如,在接近障礙物之前,先給出瞭如何避開障礙物的説明。本演練向用户介紹了遊戲控件,併為他們提供了在情境中多次練習的機會。

淺析:APP使用的指引模塊和使用的組件和技術

MindNode是一個思維導圖和頭腦風暴應用程序,它使用交互式引導來使用户加入不太熟悉的工作流程。在本教程中,用户創建了一個非常簡單的思維導圖工件,因此熟悉了交互式引導環境中的控件和術語。還提供了跳過教程的選項。

十、結論

保證引導儘可能簡單。對於大多數移動應用程序而言,這意味着將用户直接置於界面中。

另一方面,具有獨特交互模式的複雜應用程序或希望用户信息定製體驗的應用程序可能會受益於引導流程。通過引導,您可以專注於哪些用户需要在您的應用程序中取得成功,突出顯示新內容或不熟悉的內容,並保持引導流程簡短明瞭。

原文鏈接:

https://www.nngroup.com/articles/mobile-app-onboarding/

本文由 @喵吉斯蒂 翻譯發佈於人人都是產品經理,未經許可,禁止轉載。

題圖來自 Unsplash,基於CC0協議

版權聲明:本文源自 網絡, 於,由 楠木軒 整理發佈,共 4841 字。

轉載請註明: 淺析:APP使用的指引模塊和使用的組件和技術 - 楠木軒