SuperAPI AI 工具集

designing-interaction-states

设计与创作

查看项目

更新于 10-16 06:44

技能介绍

用途:用于在界面设计与评审中补齐那些用户实际最常遇到的状态,而不只设计“数据齐全、请求成功”的理想状态。

主要能力:提供状态清单,要求每个界面在设计完成前覆盖首用/空状态、加载、部分数据、全部/溢出、错误、成功、离线或权限不足等状态,并建议为每种状态准备本地种子数据并截图,让评审者看到全部状态。

使用方式:空状态要说明此处会出现什么,并提供一个真正的主按钮(如导入联系人、创建首个项目),可附次要路径;区分因新建、因筛选、因出错而空。加载方面:约300ms内不显示;内容区用形状一致的骨架屏避免布局跳动;操作按钮禁用并显示进行中状态;超过约10秒或多步操作给真实进度与离开选项;所有请求都要有超时并转为可重试的错误状态。表单方面:标签常显在字段上方,帮助文字在标签下方而非占位符;多在失焦或提交时校验;提交出错时保留输入、顶部显示可跳转的错误摘要、聚焦首个无效字段,错误文字紧邻字段并用aria-describedby关联;使用合适的输入类型和autocomplete。错误信息要说明发生了什么、原因(若已知)和下一步,不向终端用户展示堆栈、原始异常或状态码。成功反馈按改动大小用内联提示、toast或完整成功页;toast约5秒自动消失,但错误和带操作(如撤销)的除外。破坏性操作优先提供撤销,不可逆的用写明对象与后果的对话框,高危删除要求输入名称。微文案要求用平实词语、句子大小写、第二人称和主动语态,按钮用动词点明结果,同一事物用同一术语。

限制:这是设计流程指南,未提供具体代码实现、框架适配、性能数据或工具集成方式。