實用干貨！如何利用「空白狀態」提升用戶留存率？

@墨刀_MockingBot?：通常我們會對有大量內容和數據的頁面進行精心設計，而空白狀態則是常常容易被忽視的一部分。然而，空白狀態對于留存用戶、提升用戶活躍度也起著至關重要的作用。今天這篇好文，總結了利用「空白狀態」提升用戶留存率的5個要點，附上大量實例，一起來收。

3個容易被人忽視界面設計：

1. 引導頁：《騰訊實戰干貨！怎么讓引導頁不再是無用小透明？》
2. 彈框設計：《超全面！騰訊設計師做了100個彈框后總結的設計經驗》
3. 空狀態設計：《超多干貨！什么樣的空狀態設計才能留住用戶？》

空白狀態是什么？

「空白狀態」，英文 Empty State，通常是指 App 或者網頁上沒有任何數據顯示時所呈現的狀態，它產生的原因可能是以下 3 種：

首次登錄

用戶首次啟動該 App 或網頁，并完成注冊后顯示的頁面。

△ 第一次使用Gmail ，完成注冊后顯示的「空白狀態」示例

錯誤頁面

這時候往往是用戶遇到了問題，比較常見的狀態是「404頁面」、「網絡中斷」。

內容清空

內容被用戶清空或沒有添加任何數據時所顯示的頁面狀態。

「還沒有添加任何項目，點擊+號開啟吧！」

空白狀態的作用不僅僅是裝飾那么簡單。它不僅應該告訴用戶這個頁面是什么，作為引導流暢用戶體驗的一部分，它還需要告訴用戶下一步該怎么操作。

一個合格的「空白狀態」引導頁面，至少需要滿足以下任意一個條件：

• 能夠幫助和培育用戶正確使用你的產品
• 能夠引導用戶，提示用戶進行下一步的正確操作
• 能夠給用戶帶來愉悅感

數據表明，平均每個應用會在安裝后的 3 天之內流失掉 77% 的日活躍用戶。一個月之內，這個數字幾乎達到了 80%。這么低的留存率真的是因為應用不夠好么？

不完全是。

「試用期」間，你的產品是否獲得用戶的青睞是留存用戶成功的關鍵。

真實情況是，用戶會同時下載市面上的多款同類應用，之后就會選擇其中最好用的一款，而刪掉其他的。而在這個「試用期」間，你的產品是否獲得用戶的青睞是留存用戶成功的關鍵。

想要獲得用戶的青睞，第一眼印象很重要，這個時候，當用戶注冊完畢后，呈現的空白狀態頁面的重要性就凸顯出來了。

在這個用戶初始登錄頁，應該盡可能地引導用戶嘗試產品的各種功能，最好是喜歡上你的應用。而在這之前，需要做的就是，讓用戶在第一次使用的時候就喜歡上你的應用。

「空白狀態」的一個基本作用是順利引導用戶創建內容

「空白狀態」的一個基本作用是順利引導用戶創建內容，以簡明扼要的文字、標識告訴用戶是什么，如何創建內容，創建內容后有哪些好處。第一次使用的用戶如果能很快上手使用這個產品的功能，才有可能成為回頭客。

△ 錯誤示例，第一次登錄頁面時，沒有任何提示和幫助引導，可能會讓新用戶感到不知所措。

△ 正確示例，第一次登錄頁面時，增加了引導性提示，告訴用戶進行下一步操作，引導用戶創建第一個應用。

錯誤頁面的「空白狀態」，應該為用戶帶來有用的提示信息

在發生錯誤的時候，「空白狀態」頁面應該能夠為用戶帶來有用的信息。你遇到了什么問題，為什么會遇到這個問題，以及給與提示要如何解決這個問題，引導用戶進行下一步操作。

△ 錯誤示例，Spotify 操作出現錯誤時顯示的空白狀態，只顯示錯誤發生了，然而對于用戶來說，這沒有任何幫助。

△ 正確示例，Azendoo錯誤出現時展示的「空白狀態」頁面，這個頁面不僅告訴用戶掉線了，而且提供了有用的建議。

促使用戶響應行為召喚，促成轉化

你還可以把空白狀態頁面看成是一個微型的登錄頁面。優秀的登錄頁面首先設計上是簡潔的，其次是提供具體的功能信息，并促使用戶響應行為召喚，進行下一個動作。

為此，你必須：

激勵你的用戶

用勸導性的語氣和設計，比如：「了解更多，現在就開始吧！」這樣的語句。

告訴用戶進行下一步操作的好處

提醒用戶使用了這個功能可以達成怎樣的結果，這個功能有什么益處

使用行為召喚的按鈕引導用戶開始操作之旅

使用「行為召喚」（call to action）按鈕，以適當的操作引導用戶離開空白狀態的頁面，進行下一步更有意義的操作：

給用戶帶來愉悅的驚喜，錦上添花之舉

「空白狀態」除了告訴用戶這個頁面是什么，如何進行下一步操作之外，如果還能讓用戶感覺到有趣好玩，帶來愉悅的驚喜，能讓用戶感受到你的產品有那么一點點不一樣，就會給用戶留下深刻的印象。

Google Hangouts?，「空白狀態」頁面上展示了一個孤獨的淚人兒的畫面，沒有邀請是一件讓人悲傷的事情。

觀察以下這些應用的空白狀態頁面，通常包含以下這些特點：

• 品牌展示（以一種有趣的方式差異化自己的產品）
• 有一種幽默感，給人愉悅感，（使用了情感元素，給用戶帶來意外的驚喜）
• 展示品牌或產品人性化的一面

如何利用「空白狀態」提升用戶留存率？

總結下來，就是以下幾個要點：

• 空白狀態的設計，簡潔明了，用戶一眼就能看出要做什么
• 視覺上保持簡潔，通常簡潔明了的文案+不錯的圖標或者有趣的插畫 + 一個CTA按鈕即可
• 最好一個頁面呈現完畢，文字不用太多，呈現的內容太多可用圖片或動畫代替
• 聯結產品/服務的功能和人類的情感，傳達產品和品牌的個性，讓用戶產生愉悅感，更加能記住你的產品。
• 最高境界是好的「空白狀態」頁面設計幾乎讓用戶感受不到它的存在，覺得它本來就應該在那里，像一個方向導航儀，引導用戶走出「網絡荒原」。

總之，千萬不要忽略空白狀態頁面的重要性，它是用戶設計體驗中的一部分，對用戶的留存至關重要。

歡迎關注作者微信公眾號：

「優設八月份人氣最高的好文」

1. 一個常見問題：《為什么你的設計作品看上去不夠專業？》
2. 自學的正確姿勢：《光臨摹可不行！平面設計師在空余時間應該怎樣自學？》
3. 大家最喜歡的中文字體：《超實用！有哪些免費的中文字體可以下載？》

【優設網 原創文章 投稿郵箱：yuan@uisdc.com】

================關于優設網================
"優設網uisdc.com"是國內人氣最高的網頁設計師學習平臺，專注分享網頁設計、無線端設計以及PS教程。
【特色推薦】
設計師需要讀的100本書：史上最全的設計師圖書導航：http://hao.uisdc.com/book/。
設計微博：擁有粉絲量150萬的人氣微博@優秀網頁設計 ，歡迎關注獲取網頁設計資源、下載頂尖設計素材。
設計導航：全球頂尖設計網站推薦，設計師必備導航：http://hao.uisdc.com