用可視化分析的方法優(yōu)化首次登錄體驗

原文鏈接:http://www.smashingmagazine.com/2014/11/20/refining-your-mobile-onboarding-experience-using-visual-analytics/

作者:Alon?Even??翻譯:石洋

許多用戶在成千上萬移動應用的世界里經(jīng)受著ADD(app deluge disorder:應用泛濫)的騷擾。開發(fā)者中廣泛流傳著一句格言,“你只有一次獲得第一印象的機會”。一旦大批用戶下了你的APP,你已經(jīng)完成了首要目標并贏了這場戰(zhàn)役的一半。現(xiàn)在,保證他們下載后的情況是你的下一個目標。在這里首次登錄占據(jù)了重要位置。

我就職于移動分析公司,非常清楚地看到APP開發(fā)者所經(jīng)歷的挑戰(zhàn)。在這篇文章里,我們將回顧通過移動視覺分析測量用戶體驗的重要性,并提供案例和其他思考,從而優(yōu)化你的首次登陸體驗,增加留存率。

我必須強調(diào),這里并沒有創(chuàng)造完美的首次登錄體驗的魔法棒,保持監(jiān)控首次登錄體驗的專注度和決心將會比其他策略更有效。無論你是開發(fā)者還是移動應用發(fā)布者,這篇文章將提供可以應用在你自己APP上的相關知識。


請用戶留下


應用下載后的首次登錄包含了許多技術,以保證用戶第一次使用你的APP時能夠盡快融入。把首次登陸當成建立人們使用你APP的入口。將第一次使用的用戶轉化為活躍和留存的用戶是創(chuàng)造終極首次登錄體驗的核心。

針對基于互聯(lián)網(wǎng)的APP有用的方法常對混合和原生的APP沒用,反之亦然。考慮這些會浪費很多時間。舉個例子,原生APP邀請用戶通過他們設備中的細節(jié)用Facebook(一鍵注冊)創(chuàng)建賬戶,從而提供流暢的首次登錄體驗。基于網(wǎng)站的APP,則會重新將用戶推送到Facebook頁面,不過界面不同,如果用戶沒有登錄,將要求他們輸入郵箱地址和密碼,然后返回APP頁面。顯然基于網(wǎng)站的APP用Facebook首次登錄比較低效。

當設計首次登錄體驗的時候你有非常多的的因素要考慮。核心是在將心理學與設計相結合,并且要確定目標受眾,根據(jù)他們使用的設備,還有像年齡和語言等詳細的人口統(tǒng)計特征進行設計。


首次登錄的正確方式


讓我們看看幾個APP首次登錄體驗的例子,還有如何攫取用戶并且讓他們回來的技術。

內(nèi)聯(lián)(inline)提示

YouTube Capture的首次登錄體驗始于一個快速教程。然后通過內(nèi)聯(lián)提示讓用戶了解APP的UI。因為這個APP簡單,所以指出下一步一步怎樣做對于帶入用戶非常有效。

YouTube Capture的首次登錄體驗用到了內(nèi)聯(lián)提示。

把用戶第一次使用想象成在其他星球登錄,他們喜歡探索。內(nèi)聯(lián)提示是一種給他們自由的這樣做的技術,逐步展示各種各樣的產(chǎn)品特征。通過探索階段教會他們,從而通過不突兀的形式將他們和你的APP聯(lián)系更緊密。這些用戶本質上就像新生兒,需要在每一次變化中引導。

教程設計

Mailbox用了一種靈活的教程快速告訴用戶APP的獨到之處和如何使用它們。

Mailbox用了一種靈活的教程快速告訴用戶APP的獨到之處以及如何使用它們。

上面的教程用一種有序和漸進的交互形式指導用戶。它包括了易于用戶理解的簡短直接的信息。保證在首次登陸進程中用戶存留,指導他們了解產(chǎn)品的關鍵特征,然后向前推進。這樣使體驗沒有阻礙并極大地降低了跳出率。


首次登錄的錯誤方法


看過了優(yōu)秀案例,我們再看看不太有效的案例。

不好的App流程

看看下面索契(Sochi)冬季奧運會官方APP。這是一個不恰當?shù)氖状蔚卿涹w驗案例。當你開始使用APP,屏幕顯示正在加載。這個有七個步驟設置APP的過程是低效設計的反面教材。還不止這些,當你的將它設置好,APP將你帶到一個文本和圖片都很小的頁面。這個APP像迷宮,對于你應該去哪里和該怎樣操作沒有一點兒提示。

毫無疑問的是它有很多用途并且使很多用戶感到泄氣,但如果它只是一個在APP市場上隨意的APP而不是冬奧會官方APP,缺憾會小一些。它是低效的、首次登錄體驗不佳的設計案例。或許把它稱作“登出”更好些。

Sochi的APP的七步首次登陸設計的不合適。

?當用戶啟動你的APP,最不適宜的是讓用戶去等。如果他們不得不等,就要想辦法吸引他們,或許在完成進程時提供一些他們可以讀的內(nèi)容。可能設置過程實在太長了,將進程設計的盡可能短,以最快速度給給用戶他們要的。

給他們通過Facebook賬號點擊即可的簽到的選項,并且設置他們的偏好。這幾屏需要5秒以上時間的完成。當他們接觸到APP的核心內(nèi)容時,確保字號與內(nèi)容重要程度成正比以便這些文本被讀到。

通過可視化分析,你將看到用戶使用APP時是否遇到阻礙。除非你已經(jīng)開發(fā)了索契冬奧會那樣用戶沒有的其他選擇的官方APP。

壓倒用戶

一個叫Project的雜志APP的首次登錄體驗前以幾個足夠簡單的介紹頁面開始,然后把用戶帶到這個頁面:

Project顯示出壓倒用戶是個非常嚴重的錯誤(尤其對于第一次使用的訪客)。用戶會看到太多內(nèi)容需要消化而后選擇跳出。

給用戶展示大量的信息將只會壓倒他們(尤其是第一次使用訪客)。用戶會看到太多內(nèi)容需要消化后選擇跳出。這就像去吃晚餐,腦子里什么想法都沒有卻拿到上百選項的菜單,將需要很久的時間去決定。這里沒有晚餐,你只有幾秒的時間。你的用戶很餓,請快速喂飽他們!

我們可以從這個例子中學到很多,它恰恰與漸進展開相反。

壓到用戶是個非常嚴重的錯誤。移動屏幕嚴重限制了UI和UX。不要提供太多選項。選項少一些,使用率會增加一些。首次登陸設計的訣竅是僅僅展示用戶在開始時需要的知道的東西——不要多,也不要少。


首次登錄最好的實例


1.提供概述

看這個下面展示的雜志應用Zinio。它展示了APP最重要的區(qū)域并且保證了APP的內(nèi)容可見。這樣使用戶可以看到他們要找的區(qū)域。


盡可能保證首次登錄中提供的信息和用戶的日常經(jīng)驗之間聯(lián)系清楚。

2.展示價值

這是可以閃光的機會,你沒有第二個創(chuàng)造第一印象的機會,所以告訴他們你的APP有什么。準確地描述你APP的價值并且用幾屏頁面來解釋。展示你的APP將帶給用戶他們想要的。沒有什么比這更重要。一旦你帶領他們進入應用,今后你可以優(yōu)化體驗留住他們。

用戶首次登錄的末尾,占用四屏,讓用戶清楚的知道他們將獲得什么并且受到鼓勵開始使用APP。


Uber將APP的價值精簡為四屏,因此用戶可以清楚地了解到它提供的服務。

3.展示他們下一步需要做什么

為用戶呈現(xiàn)他們下一步需要在APP中做的。這將成為他們的使用指南帶給他們流暢的登錄體驗。看下面兩張Birdhouse的截屏。把它放在前面告訴用戶APP是用來做什么的以及使用它需要知道什么。


Birdhouse準確的向用戶展示;餓開始使用時需要知道什么,如何進行下一步操作。

第一屏(左邊)見識了用戶開始使用需要的信息。第二屏適合時宜的說明“歷史”功能如何使用,恰恰這時用戶可能需要用到它(用戶第一次發(fā)送推特后)。


不同類型APP的教程策略


下面是幾個常用在不同類型APP中的教程。

步進式教程:游戲

在游戲世界里,這種教程貫穿其中指導玩家,讓他們知道怎樣操作以及游戲規(guī)則。

步進式教程由內(nèi)到外詳細的指導用戶,對于游戲來說是完美的。它代替了令大部分玩家討厭的指南,或者大多數(shù)玩家為了開始游戲所看但并不想堅持看完的視頻。畢竟,與其它相比玩家更喜歡互動的形式。

步進式互動教程強化了玩家對的每一步的操作的印象。當玩家通過互動的方式被一步一步引導,被“真了不起!”或者“加油!”這樣的信息鼓勵,他將很樂意去玩。


Soccer Stars的步進式互動教程非常好理解,并且允許用戶反饋。

習慣養(yǎng)成式教程:社交分享

在圖片分享APP中,Pinterest率先通過教程引導用戶發(fā)現(xiàn)圖片創(chuàng)建自己的第一個pin(譯者注:可以理解成組)。這種形式教程的目標是讓用戶第一次嘗到成功的滋味,并且讓他們沉浸在pinning的習慣里。


Pinterest在它的教程里介紹了pinning

如果用戶不理解一個APP的概念,他們就不會再來。這就是為什么Pinterest在首次登錄教程中介紹pinning的概念,完成教程之前不會讓用戶自己離開。對于圖片分享APP來說這是最好的方式。

價值展示教程:移動電子商務

對于移動電商APP,你不只想教用戶如何使用APP,而是展示從中衍生出的價值。當用戶通過教程探索你的APP提供什么的時候,你可以通過這樣說來展現(xiàn)它的價值,“您好,顧客!我們非常在乎您。您來訪幾次后我們將會知道您喜歡什么。”進一步講,你可以在教程中解釋如何通過授權推送他們喜歡的產(chǎn)品的通知來提高移動電子商務體驗。向用戶展示他們喜歡的產(chǎn)品的推送通知將會通過像這樣的應用內(nèi)消息的形式,“您最喜歡的品牌鞋正在促銷中!”實施這個策略將會使你的首次登錄更加有效。

這種價值導向教程不只向用戶展示如何使用APP,并能傳遞APP的價值吸引他們。


這個移動電商APP通過一個價值導向的教程向用戶展示如何使用APP,通過推送通知的形式吸引用戶參與。


你的的首次用戶體驗有效嗎?


一旦你覺得做到了終極的首次用戶登錄體驗,如何評估它成功與否?如何知道你的技術有效?

用戶是否在享受一個月免費內(nèi)容后注冊?怎樣保證他們參與互動教程?他們會放棄你的APP嗎?流失率是多少?用戶第一次在屏幕上導航的時候是什么樣子的?他們是否在某一屏上花費了太多時間?用戶是否在到達某一頁面后退出?哪里有羈絆?

這些問題還有更多其他問題的答案可以通過移動可視化分析工具得到解答。真正的深入研究“why”,而并不只是“what”。當研究用戶行為時,要洞察他們的移動體驗。你希望不只發(fā)現(xiàn)像Google分析這樣的傳統(tǒng)工具提供的百分率和數(shù)字。

讓我們看看這種特征的工具如何使你能夠優(yōu)化。監(jiān)控用戶在現(xiàn)實生活中如何使用你的APP,并且透過他們的眼睛看問題。

觸摸熱力圖

這個特性為你提供了一種內(nèi)部視角可以了解到在APP中用戶被哪些地方吸引。可視化觸摸熱力圖幫助你了解用戶行為及其成因,還有他們的注意力集中在屏幕的那些地方。

下圖是注冊頁面。它包括了3三個吸引用戶注意的元素(CTAs).。第二個幾乎沒有被敲擊。所以,你可能要考慮一下將它移開以免太多CTA使用戶感到困惑,使體驗更流暢。


一個觸摸熱力圖整合報告分解了你的APP的每一個手勢。

你將注意到許多用戶在這一屏退出。現(xiàn)在,具備了這些知識,你可以從頭開始消除這些阻力,繼續(xù)監(jiān)控。你可以看到在首次登錄過程你的流失率降低了。你可以在“用戶錄像”中看到視頻,了解當用戶嘗試通過Facebook注冊時發(fā)生了什么。

用戶錄像

通過回放用戶錄像,你可以看出來為什么用戶通過一條線路到達某頁面。你可能會發(fā)現(xiàn)用戶在花費相當一段時間在中間幾屏頁面上,卻在不久之后就離開了一些頁面。調(diào)查之后你發(fā)現(xiàn)這些頁面沒有給用戶帶來價值,應將他們從首次登錄流程中剔除。

通過Appsee的APP分析,展示了像彈框信息提示的那樣因為技術問題不能用Facebook創(chuàng)建賬號。告訴你為什么用戶放棄注冊且沒轉化為活躍用戶。你可以通過“觸摸熱力圖”模塊查看熱力圖。

實時可視化分析報告

這種實時特性對理解為什么用戶在某一特定的時間做什么非常重要。通過可視化報告,你可以提交所有用戶操作的集合,洞察移動用戶行為。你可看到用戶第一次開始使用APP,對某一屏UI感到疑惑,比如一個像CTA(吸引用戶注意的元素)但是實際上只是一張圖片。這將幫助你優(yōu)化首次登錄流程,最大程度提高可用性使UI符合用戶期待。

A/B測試

免費增值的第三方工具的出現(xiàn),就像OptimizelyApptimize,非常有必要改變一下。他們的優(yōu)勢之一是使你能夠不需要等App?store的許可改變視覺。你可以比較你的兩個首次登錄版本,平均分配兩個版本的流量,然后選擇表現(xiàn)最好的版本。


從視覺移動分析中提取數(shù)據(jù)優(yōu)化首次登錄體驗


分析首次登錄體驗時,你將焦點集中于新用戶第一步,看看他們?nèi)绾闻c介紹頁面互動。

優(yōu)化首次登錄體驗最好的方式是結合下面說明的自上而下和自下而上的方法。

自上而下的方法

觸摸熱力圖和即時嵌入式分析提供的所有用戶的聚合數(shù)據(jù)。通過分析下面幾個因素使你能夠優(yōu)化首次登錄流程:

① 流失率

看看首次登錄流程中哪幾屏流失率高。分析那幾屏的用戶行為,深入挖掘為什么用戶在這里離開你的APP。

② 用戶參與

研究新用戶花在每一屏的時間量。例如,花在教程頁面的時間超過幾秒鐘表明使用者不清楚下一步需要做什么。

③ 可用性問題

識別出哪些頁面沒有響應手勢(縮放,輕點,滑動)。面對沒有反應的APP,用戶不會繼續(xù)首次登錄流程并對APP感到失望。這可能是因為UI(用戶沒有在屏幕正確的位置操作)或者技術問題(APP對手勢無反應)。同樣的,響應時間過長可能會牽制首次登錄體驗。

④ 錯誤的彈出窗口

分析當彈框彈出錯誤信息時發(fā)生了什么(例如,“創(chuàng)建賬號錯誤”)。這將幫助你清除導致用戶在首次登錄流程中退出的技術問題。

自下而上的方法

視頻錄像提供了用戶級數(shù)據(jù)。通過觀察新用戶開始使用APP,你可以透過他們的眼睛看首次登錄體驗。你將看到他們遇到的可用性和技術問題,導致崩潰的操作順序,可被識別的某些導致崩潰的UI元素。然后優(yōu)化并重新發(fā)布。


行為的可視化移動分析


我們對一款日記應用進行移動分析識別出首次登錄體驗中的不流暢的地方。讓我們看看這個開發(fā)者的外包項目。

首次登錄體驗包括一屏注冊頁面,包括兩個區(qū)域,沒有通過社交網(wǎng)絡的自動注冊。一個強制性三屏教程頁面說明注冊之后如何使用APP。

傳統(tǒng)的移動分析僅僅顯示在訪客量中56%的用戶沒有完成首次登錄流程。用戶在點擊第三屏教程中離開。這一屏的流失率高達47%。但是,這并沒有說明為什么流失率如此高,為什么首次登錄體驗失敗。

通過分析錄像視頻,開發(fā)者發(fā)現(xiàn)第三屏的“下一步”按鈕沒有顯示。用戶到處點擊屏幕試圖完成教程,但是他們的點擊沒有作用。這些用戶離開APP,大多數(shù)都沒有回來。深入研究觸屏熱力圖記錄和UI報告顯示77%的屏幕點擊都沒有響應。

發(fā)布者重新開始,修正了技術問題,首次登錄體驗的用戶增長了39%,活躍用戶增長了27%。


移動分析入門指南


大多數(shù)傳統(tǒng)可視化移動分析工具都會要求你整合APP的SDK(譯者注:Software Development Kit——軟件開發(fā)工具包)。整合過程非常簡單,只需要幾分鐘。可視化移動分析需要自動監(jiān)測屏幕,所以按鈕及用戶行為這些預先確定的不是必需的。觸摸熱力圖中自動記錄訪問者數(shù)量并統(tǒng)計所有手勢(點擊,滑動,縮放),所以你只需整合SDK。

大多數(shù)移動分析工具有免費試用版。只有極少幾個有免費包(比如,傳統(tǒng)的Google?Analytics)。它們的價格通常由訪客數(shù)量和數(shù)據(jù)點來決定。

可視化綜合移動分析可以通過兩個簡單的步驟來完成。對于iOS應用,首先解壓縮文件且將Appsee.framework文件直接拖到Xcode項目中的“Frameworks”文件夾中。


可視化移動分析結構目錄。

第二步,將下面的幾行代碼加到你的應用中。

didFinishLaunchingWithOptions:method?with?your?API?key:

[Appsee?start:@"YOUR?API?KEY"];

許多工具有類似的功能(比如用來監(jiān)控用戶體驗),但是主要用于桌面瀏覽器。Crazy?Egg用熱力圖記錄顯示哪里用戶點擊最多。Inspectlet通過細致的記錄用戶行為走得更遠些。

移動端因為屏幕尺寸的約束,操作系統(tǒng)和即時聯(lián)系用戶的潛力,使用這些工具是非常有必要的。

首次登錄體驗是你APP能否成功的關鍵中的關鍵。沒有有效的首次登錄體驗你所有的努力將會幾秒鐘的時間里付諸東流。

通過內(nèi)聯(lián)提示技術,你已經(jīng)看到如何為首次登錄體驗賦予價值,以此吸引用戶并教他們?nèi)绾问褂媚愕腁PP。你也看到了太多的信息壓到用戶導致他們離開。我們評估了一些最好的實踐案例并思考了如何選擇最能匹配你APP的教程。

鑒于首次登錄、緊密監(jiān)控用戶體驗的重要性,可視化移動分析非常有必要。這些工具從一開始整合就很簡單,他們將幫助你洞察如何優(yōu)化APP并最大程度發(fā)揮它的潛能。

可視化移動分析對你施高壓以驅使你深入洞察首次登錄階段的用戶體驗。你將會發(fā)現(xiàn)可以武裝自己的寶藏,最大程度優(yōu)化首次登錄體驗。

最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,578評論 6 544
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 99,701評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,691評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經(jīng)常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,974評論 1 318
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,694評論 6 413
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 56,026評論 1 329
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,015評論 3 450
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,193評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 49,719評論 1 336
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 41,442評論 3 360
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,668評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,151評論 5 365
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發(fā)生泄漏。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 44,846評論 3 351
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,255評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,592評論 1 295
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,394評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,635評論 2 380

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,775評論 25 708
  • 發(fā)現(xiàn) 關注 消息 iOS 第三方庫、插件、知名博客總結 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,180評論 4 61
  • 沒有潛心力, 何言攀高峰。 君不見, 趨炎附勢菟絲子, 狗茍蠅營。 百川匯海, 不棄征程。 風馳電掣, 一劍橫空成...
    春雪伊人閱讀 202評論 0 3
  • 老天是照顧我的:每次去學習都有收獲,啟用ipad,聽到歐的課,糾結是否告訴時,或者顧慮考試在一個考點住一起不便怎么...
    勁汶閱讀 205評論 0 0