等页面加载用这Skill设计反馈

设计加载状态和等待体验。

loading-states 是设计页面等待反馈的 Skill。它根据内容形状和进度是否可测,选择骨架、转圈、进度条或分批显示,让用户知道正在发生什么。

不知道完成量时,不应伪装成精确百分比。骨架最好对应真实布局,内容到达时保持滚动位置,长等待提供取消或返回;减少动效设置也要照顾。

它还讲先显示预期结果、再与服务器确认的乐观更新,失败时要恢复。给它等待场景和状态约定,可得到反馈方案;动画结束不是请求成功,原文时长区间是设计参考,是否有用仍要在慢网络与实际内容下看。

分类:商业财务

来源仓库:owl-listener/designer-skills

适合用来做什么

  • 设计一个带有旋转器动画的加载状态界面。
  • 如何实现一个骨架图来显示内容加载进度?

安装 loading-states

npx skills add https://www.iskills.cc/skills/owl-listener/designer-skills/loading-states/SKILL.md

在本机终端执行安装命令。安装前请阅读原始说明,确认所需工具、账号和权限。

查看安装步骤 · 查看常见问题

查看 loading-states 的用途与原始说明

浏览全部 Skill 指南