[译文] 为什么空白状态值得设计

文章来源 <Why Empty States Deserve More Design Time>
进入译文

一个空白状态，或者无数据状态，一般都是设计师最后才产出的「附属品」。仅因为它们常被误解的「临时」性质，或者大家觉得它们只属于体验的一少部分，因此不受重视，被放到最后才做——如果真的做。

别被它们的名字所误导。在用户下载 apps、清除内容、出现不明状况的时候，空状态是提升体验、愉悦用户的一大法宝。

人们一般认为空状态就是用于首次使用、用户清空内容或者出错状况。现在让我们想想下面这些被忽略的用户真实感受到的场景：

• 第一印象
• 成功的一刹
• 失败的瞬间

这些用户感受的触发点，可以引发以下两个结果：

1. 短暂或者永久地放弃产品

2. 更牢固的关系和更高的忠诚度

你想得到哪个结果？这就取决于你花多少心思去设计空白状态这个细微却重要的元素。

第一印象的持续影响

要让用户在经过你精心设计的 UI 界面填满数据，不能仅靠运气。最首要也是最重要的任务就是，确保用户在应用内停留得足够久，而且执行了足够多的任务，他们才会欣赏到你的精美设计。

这是一个关于那些变化无常的用户的贴心提醒，特别是那些首次使用你家产品的用户。

数据显示，app 的平均日活跃用户（DAUs 日活）在头 3 日下降 77%。（可以理解为第 3 日留存仅有 23%）

更糟糕的是，30 天内，DAUs 流失 80%。

这么低的留存率，难道是因为糟糕的产品设计？某些情况下，是这样的。

但不是全部。

用户不断尝试大量的 apps，但都在头 3-7 天内停止试用并作出选择。对于那些「优秀」的 apps，大部分留存用户在 7 天内保持高活跃度。关键就是在这 3-7 天内把用户留住。
—— Ankit Jain

那么问题来了，如果你知道用户在一周内不断寻找一个离开你的理由，你怎样才能利用空白状态来提高早期的留存率？

如何处理空白状态

用户「首次使用」你的产品时会遇到空白状态的页面，这也是用户由浅入深接触你的产品的必经之路。在这个过程中，一个优秀的空白页面应该达成三个目标：

• 教育 Educate
• 取悦 Delight
• 引导 Prompt

1. 教育你的用户

空白页的首要目标就是教育用户如何使用你的产品。如果他们不明确产品的功能，就会轻易放弃。

不要依赖视频教程或者引导流程来教育用户，不要指望用户认真观看并完全理解。因此更需要认真对待你的第一个空白页。

空白的回收站页面——回收站里的东西将在60天后被删除

一个优秀的空白页面应该解决如下问题：

• 何物（What）：解释这个页面在说什么
• 何地（Where）：告知用户当前的位置，以及接下来可以干什么
• 何时（When）：解释此处空白在什么情况下进什么操作将出现怎样的数据

空白的共享链接页面——你分享的东西会出现在这里

通过「画中话」达到教育目的。「画」是通过填充数据样本来告诉用户这个页面将会是什么样子，或通过文案——「话」来传达这些信息。

数据样本可以是完全虚构的，可以把 CEO 或者名人的真实数据代入其中。当然，能够为用户提供有实质帮助的内容建议就最好了。这些「已完成」的真实任务或部分流程数据，会帮助新手用户建立可见的预期，增加他们参与其中的欲望。

2. 取悦你的用户 Delight your user

Bitbucket 的 Commit 记录空白页面「我没有任何 commits，显得我很无用，让我很难过（搞定它）」

也许，教育型空白页引导最多只能让你留住用户。用户的时间是宝贵的，他们不会毫无目的地多花一秒钟在你的产品身上。所以对于设计师来说，每一个细节都是获得用户信任的机会。

良好的第一印象不仅与可用性有关，还与「个性」有关，试问自己以下问题：

• 有啥让人出乎意料的新招？
• 能否让用户发自内心地笑出来？
• 能否给用户传达出品牌的「个性」品味？

收藏夹空白状态

满大街都是免费使用或体验，用户倾向于尝试和比较可以解决同一问题的不同产品。

你怎样才能鹤立鸡群？

如果你的空状态有那么一点与众不同，用户就会感觉到你整个产品体验的不同之处。

因此，你需要对比一下竞品是如何处理空白状态的。如果无法找出合适的竞品，最好的方法就是直接问你的用户他们在使用什么产品。

在空白页取悦用户的方法有：

• 突出品牌：介绍和强化品牌元素
• 与众不同：制造创意，或秀一下小幽默
• 产生共鸣：展示产品人性化的一面

3. 引导行动

Webflow 的空白任务页面

营造良好的第一印象固然重要，但真正牛逼的是能驱动用户去执行任务，让用户有填满屏幕的冲动。

试着把这个空状态当作一个缩小了的着落页。在保持最简设计的前提下，好的空状态可以传达出一个特殊功能，不断诉说着这个功能可以给用户带来什么价值，从而驱动用户迈出下一步。

以下方法可帮助你在空白页引导用户去行动：

• 动机：用激励性的语言或设计来刺激你的目标用户，例如「不要犹豫了，赶紧拨打电话订购吧！」
• 游说：价值诱惑不仅用与着落页，也可以在用户执行任务的过程中，适时地展示。
• 直接：在任务一开始就向用户展示最优的唯一路径。向他们提供一个「行为召唤」按钮，或者用小箭头指向行动入口。这时候不适合向用户提供选择，而且越简单越好。如果一开始就需要用户创建内容，最好提供一些可供他们借鉴的初始化内容。

重视空白页

最好的界面设计通常也最具挑战性，它要求在界面信息与交互上取得微妙的平衡。但是，一个简单的空白页可能就会成为用户与精美界面之间的屏障。难道空白页不值得你投入更多时间和关注？