新账号还没有项目、搜索没有结果、网络加载失败和链接不存在，画面上都可能出现一大片留白，但它们不是同一种问题。把这些页面一律写成“404空状态”，会让用户不知道该创建内容、调整条件还是重新加载，也会让研发难以确定正确的返回与恢复逻辑。
空状态设计首先是状态判断，然后才是插画和文案。下面以协作项目列表为例，分别处理首次使用、搜索无结果、加载失败、无权限和404。每一种都说明触发条件、建议文字、主要动作与验收方法，方便设计师直接补齐产品中缺失的状态。
1. 先分清产品内容为空，还是资源不存在
项目列表已经正常加载，只是用户尚未创建项目，属于正常的产品空状态。页面和功能都存在，只是当前数据集合为空。404则是HTTP响应状态，表示服务器没有找到所请求的资源，具体语义可参考MDN的404说明。两者可能采用相似的简洁布局，却不能因此使用相同的技术处理。
再区分“数据还没回来”和“确认没有数据”。请求处理中展示加载反馈，请求成功且结果为空才展示空状态；请求失败则进入错误状态。如果列表加载时先闪出“暂无项目”，几百毫秒后又显示项目，用户会误以为内容丢失或账号不正确。渲染顺序本身就是状态设计的一部分。
可以在设计文件旁写下简单的判断链：请求是否完成；是否成功；是否有访问权限；目标对象是否存在；当前筛选结果是否为空。具体先后要与后端约定一致，不能仅凭前端看到空数组就推断全部原因。
2. 首次使用：告诉用户这里能做什么
首次打开项目空间时，用户需要知道这块区域的用途和第一步操作。标题可以是“还没有项目”，说明写“创建项目后，可以在这里整理设计文件并邀请成员协作”，主要操作是“创建项目”。如果产品支持导入，也可以作为次要入口，但不要同时放六个同等醒目的按钮。
这里的价值介绍要与下一步有关。用一整屏功能广告解释产品有多强，会推迟用户真正开始任务。Carbon空状态模式强调利用空状态说明情况并提供适合的行动。可以保留标题、简短说明、一个主操作和必要的帮助链接，不必每个空列表都配置大型插画。
区分没有项目与没有创建权限同样重要。访客或只读成员不应该看到一个点击后才报错的“创建项目”按钮。对他们更合适的说明可能是“当前空间还没有可查看的项目，请联系管理员添加”。验收时分别用新建管理员、普通成员与访客账号测试，而不是只看设计师自己的完整权限。
3. 搜索无结果：保留条件，帮助用户调整
有内容的空间在筛选后变为空，不能继续显示首次使用的“创建你的第一个项目”。用户此时的目标是找到已有内容，应该看见“没有找到符合条件的项目”，并能确认自己用了哪些关键词和筛选条件。主要动作可以是“清除筛选”，同时允许直接修改关键词。
例如搜索“支付”，又限定负责人为小林、更新时间为近七天，没有结果时应保留这些条件。可以把关键词与筛选标签显示在结果上方，逐个取消。不要点“重试”之后悄悄清空条件，也不要直接把用户送回首页，让他从头记忆刚才的搜索。
若提供拼写建议或相近结果，需要确保系统确实具备该能力。没有实现智能纠错，就不要在设计稿里承诺“已为你智能匹配”。搜索范围也应说清楚：是当前项目还是整个空间，是否包含归档内容。很多无结果问题来自范围误解，不是用户打错字。
验收时建立一条确定存在的内容，用不同范围与筛选条件分别搜索。确认清除条件后能找到它，关键词不会被无故修改，结果数与当前列表一致。这样能把文案、筛选逻辑和数据状态一次校验完整。
4. 加载失败：说明未能取得内容，提供安全恢复
网络断开或服务异常时，准确的标题是“暂时无法加载项目”，而不是“没有项目”。前者承认当前不知道内容，后者会把失败误报为空。可以提供“重新加载”，在有必要时保留已缓存内容，并明确它可能不是最新结果。
重试动作不能清除用户已经输入但尚未提交的数据。比如项目创建表单提交后超时，服务器可能已经创建成功，只是响应没有到达；再次点击不能无条件再创建一条。这个问题需要研发确认请求去重和结果查询，设计则负责说明“结果待确认”、保留输入，并提供明确下一步。表单部分可结合移动端提交状态设计。
错误提示需要与影响范围一致。只有评论区域加载失败时，不必把整张设计文件替换成全屏错误；可以保留文件和其它操作，在评论区域提供重试。反过来，关键数据完全不可用时，也不能用角落里短暂消失的提示代替主要反馈。
验收时分别模拟离线、超时、接口错误以及恢复网络，确认重试只影响对应区域，已输入内容按约定保留，成功恢复后错误提示会消失。不要只在设计稿里画一个“加载失败”的静态画面就结束。
5. 无权限：解释如何获取访问，不泄露额外信息
用户打开存在但无权访问的项目时，重点是账号与授权关系。若产品允许申请访问，可以提示“你暂时没有访问权限”并提供“申请访问”；若当前账号可能错误，可以提供切换账号。没有审批机制的产品，就不要显示一个提交后无人处理的申请按钮。
权限提示中的项目名称、拥有者或组织信息是否允许公开，需要由业务与安全规则决定。有些系统会对未授权资源统一展示“无法访问”，避免泄露资源是否存在；因此设计不能强制要求所有无权限请求都返回某一个状态码或完整项目详情。与后端明确对外信息边界，再设计可见文案。
同时画出申请已发送、申请被拒绝与权限已获得后的状态。待审核、通过、驳回和权限过期的后续动作，可按权限不足与申请访问的完整路径进一步细化。按钮点击后至少应该让用户知道是否成功提交、是否能重复申请、之后如何继续。验收使用两个不同权限的账号交叉测试，确认没有把管理员画面直接暴露给普通成员。
6. 404：帮助找回路径，也保留正确的响应状态
链接拼错、内容删除或路由不存在时，可以用“找不到这个页面”作为主标题，提供有意义的返回入口。GOV.UK页面未找到模式建议使用清楚、简洁且不责怪用户的说明。幽默插画可以服务品牌，但不能挡住原因和下一步，也不能要求用户读懂内部错误代码。
回到首页不是唯一选择。文章链接失效可以提供文章目录，项目链接失效可以提供工作台入口；站内确有搜索功能时，再考虑搜索入口。不要展示实际上不可用的搜索框，也不要把“返回上一页”当作唯一出口，因为用户可能从搜索引擎或外部分享直接打开页面。
技术上，页面画了“404”并不代表服务器真的返回404。对于不存在的公开页面，如果仍返回200并只展示错误内容，Google可能将其判断为软404。Google抓取文档解释了这类响应处理。这里不能推导出“404插画设计得好就会提升搜索排名”；用户路径和HTTP语义需要分别做好。
已有明确等价新地址的内容迁移，可以由网站维护者配置合适重定向；真正不存在的页面则正确表达不存在。不要把所有坏链接强行跳到首页，这既没有帮助用户找到原内容，也掩盖了需要维护的链接问题。
7. 在设计稿中建立状态表，而不是复制五张插画
在Pixso中新建“项目列表状态”页面，将默认列表与五种状态放在一起。每张画板旁写明触发条件、标题、说明、主操作、操作结果和恢复后去向。复用相同间距与按钮样式，但不要复用含义不匹配的文案。
组件可以包含图标、标题、说明与操作区，允许紧凑和完整两种布局。表格内没有结果时使用紧凑版，首次进入整个工作区时使用完整版。这样能保持一致性，又不会让一个小区域的空状态把整个页面向下撑开。
8. 用触发条件完成设计与研发联合验收
- 新账号、清空列表与筛选无结果是否进入正确分支？
- 加载中是否会闪出虚假的“暂无内容”？
- 每个主要操作是否能够恢复任务，而不是只关闭提示？
- 无权限提示是否符合信息披露边界，申请访问是否有结果？
- 直接访问不存在URL时，文案与真实HTTP响应是否一致？
- 键盘、文本放大和小屏幕下，说明与操作是否仍能完整访问？
把这些用例放进UI评审与验收记录，由设计、产品和研发共同确认。好的空状态不只是填满空白，而是在内容暂时缺席、条件不匹配或系统出错时，仍然让用户知道发生了什么，并且有下一步可走。
