SuperAPI AI 工具集

loading-states

设计与创作

查看项目

更新于 10-15 21:12

技能介绍

用途:为界面设计加载反馈,兼顾真实等待与用户感知速度。

主要规则:等待 200ms 以内不显示任何加载提示;200ms 至 2s 显示骨架屏或轻微指示器;超过 2s 显示带有上下文的进度条或确定性指示器。

主要能力:骨架屏需匹配真实内容布局而非通用转圈,使用从左到右的微光动画,最多展示 3 至 5 个骨架项,并平滑过渡到真实内容;进度指示器按场景选择——已知时长或步骤用确定性进度条(如文件上传 45%),时长未知的短暂等待用不确定进度条,小区域且时长未知用 spinner,页面或区块加载用骨架屏;乐观更新可先展示结果再后台同步,如开关立即翻转、失败回退,点赞或收藏立即显示已选状态,消息即时进入聊天并标注发送中,仅适用于失败罕见且可逆的场景。

限制与反模式:避免全屏 spinner 阻断交互;避免仅出现 100ms 的加载动画(可先延迟 300ms 再显示);不要没有加载状态;同一页面不要混用不同加载模式;避免无上下文的“Loading...”文字。资料未提供具体代码、安装命令、平台或收费信息。