UX Walkthrough Skill
以资深用户体验专家的视角，系统性走查产品中的体验问题，并生成详细的问题报告。
核心能力
- 阅读 PRD 理解产品目标和核心用户流程
- 以用户视角模拟完整的使用流程
- 识别 UI/UX 问题（一致性、可用性、可访问性）
- 识别功能流程中断点和错误处理问题
- 生成结构化的问题报告
适用场景
- 产品上线前的体验质量检查
- 新功能开发后的走查验收
- 定期的产品体验审计
- 用户反馈问题的系统性排查
使用方法
基础用法
"帮我做一次 UX 走查"
"检查一下这个产品的体验问题"指定范围
"走查评测到课程的完整流程"
"检查仪表板页面的体验问题"指定重点
"重点检查错误处理和边界情况"
"关注移动端的体验问题"实现流程
Step 1: 理解产品
- 阅读 PRD（
docs/PRD.md）
- 理解产品目标和核心价值 - 识别目标用户群体 - 梳理核心用户流程
- 阅读项目结构
- 了解页面结构（app/ 目录） - 了解组件结构（components/ 目录）
- 输出理解摘要
产品目标：[一句话概述] 目标用户：[用户画像] 核心流程：[流程1] → [流程2] → [流程3]
Step 2: 定义走查范围
根据产品结构，确定走查的页面和流程：
| 流程 | 涉及页面 | 优先级 |
|---|---|---|
| 新用户引导 | 首页 → 评测 → 结果 | P0 |
| 日常学习 | 仪表板 → 课程 → 完成 | P0 |
| 进度查看 | 仪表板 | P1 |
Step 3: 执行走查
按以下维度检查每个页面/流程：
3.1 页面加载体验
- 加载状态是否清晰？
- 加载失败是否有友好提示？
- 加载时间是否在合理范围？
3.2 视觉一致性
- 颜色使用是否一致？
- 字体大小层级是否清晰？
- 间距和对齐是否统一？
- 图标风格是否一致？
3.3 交互体验
- 按钮状态（hover/active/disabled）是否清晰？
- 表单输入是否有适当反馈？
- 点击区域是否足够大？
- 操作结果是否有反馈？
3.4 流程连贯性
- 流程中断时是否有挽回机制？
- 步骤之间的衔接是否自然？
- 用户是否知道当前在哪里、接下来做什么？
- 是否有不必要的步骤可以省略？
3.5 错误处理
- 错误信息是否清晰易懂？
- 错误发生后是否有恢复路径？
- 网络错误是否有重试机制？
- 是否有防止用户犯错的设计？
3.6 边界情况
- 空状态是否有引导？
- 数据过多时是否有分页/加载更多？
- 极端数据（很长的文字等）显示是否正常？
- 首次使用和重复使用体验是否都顺畅？
Step 4: 汇总问题
按以下格式整理发现的问题：
## UX 走查报告
### 📊 概览
- 走查范围：[范围描述]
- 发现问题：共 X 个（P0: X / P1: X / P2: X）
- 走查日期：[日期]
### 🔴 P0 严重问题（必须修复）
影响用户完成核心任务的问题
#### 问题 1: [问题标题]
- **位置**: [页面/组件]
- **现象**: [问题描述]
- **影响**: [对用户的影响]
- **建议**: [修复建议]
- **截图/代码**: [如有]
### 🟠 P1 重要问题（应该修复）
影响用户体验但不阻塞任务的问题
#### 问题 X: [问题标题]
...
### 🟡 P2 建议优化（可以改进）
体验优化建议
#### 建议 X: [建议标题]
...
### ✅ 做得好的地方
- [好的设计1]
- [好的设计2]
### 📝 后续建议
- [建议1]
- [建议2]Step 5: 验证修复
如果用户修复了问题，可以帮助验证：
- 检查修复是否解决了原问题
- 检查修复是否引入了新问题
- 更新问题状态
本项目走查指南
核心用户流程
根据 PRD，本产品的核心流程是：
首页 → 评测 → 结果/仪表板 → 课程学习 → 完成需要重点关注的体验点
- 评测流程
- 题目加载是否顺畅？ - 答题交互是否清晰？ - 提交后是否有明确反馈？ - 结果展示是否有价值？
- 课程学习流程
- 课程生成等待体验？ - 词汇/句型练习交互？ - 进度感知是否清晰？ - 完成后的成就感？
- 数据持久化
- 用户档案是否正确保存？ - 刷新后数据是否还在？ - 跨页面数据是否一致？
- 错误恢复
- API 失败时的处理？ - 用户数据丢失时的处理？ - 网络断开时的体验？
能力边界
✅ 此 Skill 擅长
- 基于代码阅读识别潜在的 UX 问题
- 系统性的体验检查清单
- 结构化的问题报告
- 提供修复建议
⚠️ 限制
- 无法实际操作页面（需要浏览器工具配合）
- 无法测试真实的加载性能
- 无法测试真实的移动端体验
❌ 不支持
- 视觉设计评审（颜色搭配、美感等主观判断）
- 用户研究（需要真实用户参与）
- A/B 测试分析
Skill 协作
配合使用
- 浏览器工具（如有）：实际访问页面进行验证
- AGENTS.md：参考开发规范确保修复质量
工作流示例
用户请求走查 → [ux-walkthrough-skill] 分析代码
→ 生成问题报告
→ 用户修复
→ [ux-walkthrough-skill] 验证修复测试用例
测试场景1: 完整走查
触发条件: "帮我做一次完整的 UX 走查"
预期输出:
- 阅读 PRD 并输出理解摘要
- 按流程逐步检查
- 生成结构化问题报告
验证点:
- 报告包含问题分级
- 每个问题有位置、描述、建议
- 包含正面反馈
测试场景2: 指定范围走查
触发条件: "走查评测页面"
预期输出: 仅针对评测页面的问题报告
验证点:
- 只检查相关页面
- 问题聚焦
元信息
版本: v1.0 作者: AI Agent 创建日期: 2026-01-28 最后更新: 2026-01-28 依赖:
- docs/PRD.md（产品需求文档）
- AGENTS.md（开发规范）
更新日志:
- v1.0 (2026-01-28): 初始版本