顶尖产品Slack如何做好空状态界面？我总结了5个要点！

编者按：我们所熟知的「空状态」大多是新打开某个APP或者某个APP刚刚开始加载的时候，实际情况下的「空状态」还覆盖有很多其他的情形。出自资深设计师 Rosie Hoggmascall 的这篇文章拿知名的在线协作工具 Slack 的成长和设计细节，详细阐明了空状态设计的几个要点。

更多空状态设计干货：

以下是正文：

你是否见过Chrome的「孤独霸王龙」？

或者是Windows系统的「蓝屏死机」界面？

苹果系统的「死机风火轮」图标？

在自动保存功能普及前，这些空状态意味着世界末日：文件丢失、系统重启、画面冻结。正如其名所示，这类界面会引发挫败与恐惧情绪。同时，这类场景也被定义为空状态（Empty States）。

空状态指界面中可能呈现空白区域的显示状态，例如未输入前的搜索框、未发送消息的聊天窗口、错误提示或新打开的文档。这类技术层面的非显示区域，常被产品设计忽视，却对构建积极体验至关重要，原因在于：

• 缺乏空状态会导致用户困惑（常误判为系统错误）
• 能够呈现系统状态以增强用户的控制感
• 可隐晦展示后续操作步骤与产品的使用方法

NNGroup研究表明：

完全空状态会引发系统运行状态疑虑。用户会产生系列疑问：请求是否完成处理？内容是否仍在加载？是否出现错误？过滤参数是否设置错误？空状态的核心目标是建立产品可靠性认知，展现系统控制力并指引后续操作。

探索这类用户体验设计的冷门领域的最佳案例当属 Slack。我们将解析其四类空状态如何优化引导流程、促进产品采用并降低使用困惑：

• 功能默认状态 🕺 促进参与
• 首次使用状态 🐣 引导激活
• 完成状态 🎉 给予成就激励和多巴胺刺激
• 错误状态 ⛔️ 承认问题并提供解决方案

在深入分析前，先回顾 Slack 从初创到独角兽（2013-2025）的发展历程：

Slack 2013至2025年的坎坷历程

Slack是初创企业领域的标志性成功案例，仅用8个月便达成10亿美元估值。其前身为2009年开发的多人线上游戏 Glitch，因复杂度与运行速度问题，一直未能成功。开发团队发现游戏内通讯工具更有发展潜力。

由此 Slack 便诞生了。

2013 年发布后首年实现每周 5-10% 的增长，2014年即达到独角兽公司的地位。2019年在我首次使用时，Slack日活用户已突破 1000 万。增长驱动因素有很多， 包括：远程办公趋势、差异化品牌形象（替代传统企业工具）、硅谷资本支持与产品导向增长策略（易用性与分享机制）。2021 年 Salesforce 以 277 亿美元收购Slack后增速放缓，TechCrunch报告显示年增长率从 2023Q3 的 46% 降至 2024Q4 的 16%。

截至2025年，Slack在150个国家拥有20万付费客户，覆盖77%财富百强企业。

搜索框的空状态 🔎

我对 Slack 搜索框的动态搜索文案记忆犹新。首次输入时出现「Surely that’s around here somewhere」(肯定就是在这附近了)，二次点击的时候显示「Search high and low」（周围瞅瞅）。

它给人的感觉是精心制作，而非仅仅只是设计出来的，这套系统通过轮换趣味文案实现双重效应：

• 可变奖励机制 🧠 每次访问获得新鲜体验（类似街机当中的随机奖励）
• 好奇心缺口营造 🧠 通过谜题与非常规体验激发探索欲

该策略将平凡 UI 元素转化为参与机会与记忆触点，而这也是 Slack 在红海市场脱颖而出的关键：为功能模块注入个性与趣味。

首次使用是提供 🐣 引导状态

最近，我第一次创建了自己的 Slack 工作区。我需要使用 Slack 连接，因此创建了「Rosie Hogggmascall」工作区来接受新客户的邀请。

创建个人工作区时，精心设计的空状态可以避免冷启动困境：

请注意，他们没有直接放置一个空白页。相反，我看到的是活动（我自己加入）、模板、欢迎消息和输入内容的方向。

Slack频道内引导状态（含加入动态、模板与操作指引）

系统为我自动创建了三个频道，并为我提供以下功能：

• 被动式引导提示（非侵入式）
• 可视化引导，帮助我理解当前情形
• 核心价值重申文案
• 默认就有对话和沟通建议（「👋 大家好！」、「签到！谁在线？」）

推荐操作包含「分享GIF」、「咖啡时间休息一下」、「个性化欢迎」等低门槛行为，实质上它们都是在引导关键激活动作（发送首条消息、创建频道）。

甚至私信界面还存在一个空状态：

私信界面也预设「✍️ 给自己留言」、「明天我应该...」等贴合实际使用场景的提示，消除面对空白页面的思维阻滞：

这类设计通过预判摩擦点实现：

1. 降低认知负荷
2. 创建初始活跃氛围
3. 提供结构化引导
4. 避免侵入式弹窗干扰
5. 辅助采取措施，先人一步

帮用户抵达 ✅ 任务完成状态

移动端「消息速览」功能（类似Tinder滑动机制）用户完成之后，用户将获得动态变更的鼓励文案：

• 😎 全部清除
• 💥 搞定！已更新
• ✌️ 处理完毕，接下来想作什么？
• 🍏 已阅读所有内容，稍作休息吧！

Slack移动端完成状态示例

这些区别于其他品牌的差异化文案，旨在强化品牌调性（相较竞品Microsoft Teams更随性）的同时，通过多巴胺奖励机制，来强化用户使用产品的习惯。

提示 ☠️ 错误状态

断网测试时，系统显示骨架屏状态（Skeleton State）：

Slack断网加载状态示意图

该设计通过渐进加载效果，减轻界面跳转的突兀感，营造后台在努力加载的假象（Labour Illusion Effect）。具体错误提示包含：

加载您的工作区时遇到问题
我们此刻不确定到底是哪里出了问题，但我们确实有一些可能有帮助的建议提供给您：
- 重启 Slack。有时这就能解决所有问题
- 检查 Slack 服务，确保这不是 Slack 问题
- 尝试查看我们针对连接问题建议的解决方案

当我搜不到东西的时候，我们看到的是：

什么都没找到
- 您可能需要尝试使用不同的关键字，检查拼写错误或调整过滤器。了解有关搜索的更多信息
- 结果不符合您的预期？给我们提供反馈吧

Slack搜索错误状态示例

区别于陈旧的「糟糕」「出错了」等表述，这类系统采用对话式语言并提供多出口路径，将潜在挫折场景转化为信任建立机会。

总结：空状态的战略价值

Slack案例给了我两大启示：

• 保持人性化：承认未知、注入品牌个性、规避陈词滥调
• 保持在场感：避免绝对空白，避免让用户操作进入鬼打墙的空转状态

在具体设计落地上，我建议包含五步流程：

• 审查并关注产品旅程中的空白触点
• 注入品牌调性相符的可变奖励
• 预判用户需求，降低认知负荷
• 通过空状态引导关键激活动作
• 问题发生时，保持信息透明并提供明确解决路径

请尝试实践并分享你的体验 👀