SuperAPI AI 工具集

empty-states

编程与开发

查看项目

更新于 10-15 21:12

技能介绍

用途:empty-states 用于在对话中应用空状态设计约束,把零数据页面、无结果、错误恢复、加载状态和留存微文案处理成有意图、能引导用户下一步的界面,而非空白或“死胡同”。

主要能力与规则:每个空状态必须解释“为什么为空”,给出一个明确的下一步操作,并显得是有意设计而非故障;禁止在没有上下文时只说“No data found”。

按类型处理:首次使用引导完成第一个动作,并展示该页面未来会是什么样;无结果时建议替代方案,如“换个搜索词”或展示相关项;错误状态说明发生了什么以及用户能做什么;成功清空(如“全部处理完”“收件箱清零”)应像奖励;加载使用与最终布局匹配的骨架屏,而非转圈。

文案规则:必须贴合具体场景(如“还没有项目”而非“这里什么都没有”);应使用人话而非系统语言;CTA 面向动作(如“创建你的第一个项目”而非“添加项”);不得把空状态归咎于用户。

视觉规则:应包含简单插画或图标(非图库照片);即使为空也必须保持页面布局,不折叠容器;加载骨架必须匹配真实内容尺寸;加载转圈超过 3 秒必须给出进度提示。

使用方式:在对话中输入 /empty-states 即可应用这些空状态约束。

适用场景:产品界面中的零数据页、搜索无结果、错误页、任务清空页和加载态设计。

限制:资料未提供具体平台、收费、价格或效果数据;以上为技能自身声明的约束,实际落地需结合具体产品上下文。