空状态Empty
内容与数据展示在没有数据时说明原因和下一步
空状态不只是留下一块白屏，它应该告诉用户这里原本会出现什么、为什么现在是空的，以及接下来可以创建、搜索还是调整条件。
还没有任何项目创建第一个项目，开始协作吧
什么时候用
- 列表 / 表格还没有数据，告诉用户这里本来有什么名称状态这里还没有任何数据
- 顺手放个引导按钮：新建项目、添加成员还没有项目新建项目
- 搜索无结果，提示换个关键词试试狼人杀没有找到相关内容，换个关键词试试
- 文案说人话：为什么是空的 + 能干嘛收件箱是空的——邮件都处理完了 🎉
什么时候不用
- 只写「暂无数据」四个字，用户不知道怎么办暂无数据用户：然后呢？我该怎么办？
- 页面还在加载中就显示空状态 → 用 骨架屏 Skeleton加载中，请稍候…
- 明明是加载出错也当空状态 → 用 结果页 Result 报错暂无数据其实是网络错误，却被当成空的
- 插画做得比内容还花哨，喧宾夺主空空如也～插画比内容还抢眼
组成结构 · Anatomy
还没有任何项目创建第一个项目，开始协作吧
1空状态Empty整个空白区域的容器
2插画Illustration视觉缓冲，别太空也别太花
3文案Description说清为什么是空的
4引导按钮Action可选，推用户往前走一步
常见变体 · Variants
简单文字Simple
暂无收藏收藏的内容会出现在这里
次要区域，说清是空的就够了
带引导按钮With Action
还没有任何项目
想推用户一把，引导创建第一条数据
自定义插画Custom
回收站是空的删除的文件会在这里保留 30 天
重品牌感的页面，插画贴合业务场景
典型使用场景
空列表 / 空表格
成员列表
搜索无结果
共找到 0 条结果
没有找到相关内容
换个关键词试试，比如「桌游」
引导创建第一条数据
还没有任何项目
项目用来组织你的设计稿和文件
回收站为空
回收站文件保留 30 天
回收站是空的，已删除的文件会出现在这里