空状态设计不是把内容区留白,而是让用户知道当前为什么没有内容,以及怎样继续。首次使用需要引导创建第一条记录;主动筛选无结果要能清除条件;请求失败则要保留上下文并提供重试。把这三种情况拆开,页面才不会用一句“暂无数据”覆盖不同任务。
可以先在墨刀设计中搭建空状态界面,用同一个“项目任务列表”案例分别走完首次进入、筛选无结果和加载失败,再让产品、设计和研发按状态逐项对照。

先判断用户为什么看到空白
首次使用时,用户还没有创建数据;“还没有任务,创建第一条任务”比“暂无数据”更能推动任务。筛选无结果时,数据可能存在,只是条件过窄;提示应复述条件,并允许一键清除。加载失败则是系统没有拿到结果,不能暗示数据不存在。
| 状态 | 必须说明 | 主要动作 | 次要出口 |
|---|---|---|---|
| 首次使用 | 还没有创建记录 | 创建任务 | 查看模板 |
| 筛选无结果 | 当前条件没有匹配 | 清除筛选 | 修改关键词 |
| 加载失败 | 结果暂时无法取得 | 重试 | 产品支持时查看离线草稿 |
判定顺序比插画风格更重要
同一个任务列表里,“没有任务”“没有权限”和“还没加载出来”看起来都可能是一片空白,但不能共用一个业务状态。先判断是否有访问权限,再判断请求是否完成、是否成功;只有成功拿到结果后,才能判断列表是否为空。请求尚未结束时应显示加载反馈,不要先闪出“暂无任务”,随后再出现数据。
还要区分整个空间为空和当前视图为空。比如团队已有任务,但“分配给我”里没有记录,标题应写“还没有分配给你的任务”,出口可以是“查看全部任务”,而不是诱导用户重复新建。没有创建权限的成员,则应看到管理员联系方式或申请入口,不能得到一个点了也无效的“新建任务”按钮。
局部失败也不必清空整页。如果只有统计卡片加载失败,保留正常的列表,在卡片范围内提示重试;用户已有可读的旧数据时,可以保留内容并注明更新失败。空状态的占位范围,应和实际无法完成的任务范围一致。
文案、插图和按钮要共同解释任务
标题先说事实,补充句说明影响,按钮使用动作动词。插图可以帮助识别场景,但不能把唯一操作写在图片里。首次使用可展示一条已完成的示例任务;筛选无结果不宜使用庆祝插画,以免和成功状态混淆。失败状态保留查询词、筛选和已输入内容,避免用户重来。
三组可以直接改用的空状态文案
下面以“项目任务”为同一个对象,分别说明标题、解释和按钮之间的关系。文案中的名称、权限和恢复能力应随实际业务替换,按钮不要承诺尚未设计的功能。
| 出现条件 | 标题与解释 | 按钮及点击结果 |
|---|---|---|
| 新项目没有任何任务 | 还没有任务 创建第一条任务,分配负责人并约定完成日期。 | 创建任务 → 打开创建表单;提交成功后回到列表并显示新记录 |
| 筛选负责人“小林”和标签“本周”后无结果 | 没有找到符合条件的任务 当前筛选:负责人小林、标签本周。可以调整条件后再试。 | 清除筛选 → 去掉筛选条件,保留当前项目位置 |
| 任务列表请求失败 | 任务暂时无法加载 你的筛选条件已保留,请重新加载列表。 | 重新加载 → 使用同一条件再次请求,成功后展示结果 |

“清除筛选”也要约定到底清除什么。若搜索词与筛选面板相互独立,可以保留搜索词,同时在按钮旁提供“重置全部条件”。不要把用户看到的“清除筛选”实现成跳回首页,更不要顺便切换空间或清空未提交表单。
常见反例是给失败状态写“这里空空如也,快去添加吧”。用户可能因此重复创建数据。另一种反例是三个状态都放“立即体验”,它既没有说明将去哪里,也没有修复当前问题。把按钮改为“创建任务”“清除筛选”“重新加载”后,读者不必先理解产品术语就能继续。
空状态应该占多大空间
整页首次使用可以保留一幅适度的插图,旁边或下方放一组文案与一个主动作;表格内无结果应保持表头、筛选栏和所在项目可见。不要为了放大插画把操作推到首屏之外。移动端优先保住标题、说明和按钮,插图可以缩小,不能让用户滑过半屏装饰才找到恢复入口。
如果只是一个下拉选项没有结果,就在下拉面板内解释;如果用户刚完成全部待办,“今天的任务已完成”属于任务完成反馈,可以提供查看历史记录的次要入口。它和首次使用虽然都没有列表项,语气与下一步却完全不同。
把边界状态放进可点击原型
为案例准备三份页面:任务列表、筛选面板、创建任务页。默认进入首次使用,点击新建后回到有数据列表;输入“负责人=小林”再选择没有同时匹配结果的标签,进入筛选无结果;模拟接口失败后,点击重试仍保留筛选。验收时记录每次操作后文案、按钮和返回位置是否一致。
重试以后,必须回到正确的地方
- 创建第一条任务后,检查列表是否更新,而不是仍停在首次使用画面;返回操作不应再次打开创建表单。
- 在筛选无结果页修改一个条件,检查其余条件是否按约定保留;结果仍为空时,不出现重复堆叠的提示。
- 在失败页连续触发重试,检查加载反馈是否明确,并防止同时出现多个相同请求结果。
- 恢复网络后重新加载,检查负责人、标签、滚动位置是否符合保留规则;若仍失败,继续保留可恢复的输入。
- 用没有新建权限的账号走同样路径,确认按钮和说明没有泄露无权查看的项目名称或数据数量。
可以把一条验收要求写成:“当小林筛选本周任务且返回零条时,显示筛选无结果;点击清除筛选后仍留在当前项目,列表按默认条件刷新。”这比“空状态正常显示”更容易让开发与测试达成一致。
交付物至少包括状态清单、触发条件、展示文案、主次动作和恢复结果。若接口错误码、权限或缓存会改变状态,需在说明中标出负责人和待确认项。完成状态映射后,进入工作区制作并评审空状态原型。