Agent Skills
返回列表
🎨

应用引导优化

设计多媒体 更新于 2026.08.29

将以下提示词粘贴到你的 AI 对话框中:

请根据 https://skillhub.cn/install/skillhub.md,安装 @kunlungrowth/onboarding-ux。

技能介绍

解决什么问题

新用户首次打开 Web 应用时,常常面对空白仪表盘或零数据的表格页,不知道下一步该做什么。列表为空时只剩表头,核心功能藏在侧边栏深处无人发现,复杂表单字段没有任何解释,术语让新人一头雾水。这些不是 bug,而是引导设计缺失导致的体验断裂。

技能如何工作

本技能以全新用户视角逐页审计应用,识别四类典型引导缺口:

  • 空状态:列表/表格在零数据时是否给出说明和行动按钮,而非一片空白
  • 首屏印象:登录后 10 秒内能否理解应用用途并找到首要操作
  • 功能可发现性:导航是否清晰,标签是否自解释,高级功能是否隐藏过深
  • 上下文帮助:表单字段有无提示,术语是否易懂,破坏性操作是否说明后果

审计完成后,技能读取项目代码以匹配现有组件模式,生成可落地的解决方案:封装包含图标、标题、说明和主行动按钮的 EmptyState 组件,根据应用复杂度选择合适的欢迎流程(横幅、分步导览或交互式产品导览),为复杂字段补充工具提示和上下文帮助,将校验错误改写为修复指引。

适用边界

本技能专注引导内容生成,不处理纯视觉美化——那是 ux-audit 的领域。产出方案可交由前端直接实现或经 ux-audit 复核,但仍需真实用户测试验证效果。

使用场景

  • 新功能上线后用户不会用
  • 列表没数据时引导下一步
  • 首屏不知道做什么
  • 表单字段帮助不足

适合人员

  • 初创产品负责人设计欢迎流程
  • 前端工程师实现空状态组件
  • SaaS 产品经理优化功能发现性
  • 设计系统维护者补充引导模式