UX 审计

技能文档

---
name: ux-audit
title: UX 审计
category: 开发工具
description: 以真实用户身份走查在线应用，发现静态审查遗漏的可用性和行为缺陷。要求交互证明（输入、点击、发送、观察）后才出结论。当用户需要 UX 审计、走查测试、QA 扫描、应用审计或压力测试 UI 时触发。触发词：UX审计、走查、QA扫描、应用审计、压力测试UI。
---

# UX 审计

以真实用户身份走查在线应用。审计以**交互为先**——输入、点击、发送、观察、截图。静态 DOM 扫描无法得出结论。

## 结论状态

审计结论为以下之一：

- **通过** — Critical = 0, High = 0，所有硬门禁绿色，交互清单完整
- **有条件通过** — Critical = 0, High = 0，硬门禁绿色，但存在 Medium/Low
- **不通过** — 至少一个 Critical 或 High 发现，或硬门禁红色
- **不完整** — 交互清单缺项、阶段未执行、或审计元检查触发

## 硬门禁

以下自动判定不通过，不可降级：

| 门禁 | 阈值 | 严重级别 |
|------|------|---------|
| 控制台错误 | > 0 | Critical |
| 控制台警告 | > 0 | High |
| 网络 5xx | > 0 | Critical |
| 认证页面 403/404 | > 0 | High |
| 布局崩溃 | > 0 | High |
| axe-core Critical 违规 | > 0 | Critical |
| axe-core Serious 违规 | > 0 | High |
| LCP | > 4.0s | High |
| CLS | > 0.25 | High |
| INP | > 500ms | High |

## 技能工作流

### 步骤1：预检

五项门禁，任一失败则停止：
1. **角色锁定** — 确定审计用户角色
2. **浏览器工具** — 确认 Chrome MCP 或 Playwright 可用
3. **URL** — 优先使用已部署/线上版本
4. **视口** — 初始固定 1440×900
5. **能力测试** — 截图、控制台读取、网络请求、元素查询各一次

### 步骤2：发现

- **站点地图** — 构建完整页面清单
- **线程清单** — 识别 3-5 个核心用户任务
- **元素清单** — 列出每个路由的交互元素

### 步骤3：走查（审计核心）

**交互清单（必须）**：每次走查生成清单，记录每个交互操作的时间戳、选择器和结果。

**线程遍历**：
1. 从应用入口开始
2. 以角色身份走查
3. 每次状态变化截图
4. 跟踪操作成本（点击数、决策点、死胡同）

**元素穷举**：对每个路由遍历元素清单。

**多面板压力测试**：测试不同视口宽度和面板组合。

**首次用户视角（必须）**：以首次使用应用的用户视角评估每个页面。

**实时交互验证**：对每个交互控件——点击、观察网络、检查 DOM 变化。

### 步骤4：打磨

- **视觉打磨** — 逐页微观优化
- **组件完美清单** — 6 类组件级检查

### 步骤5：压力测试

**场景电池（11 个场景）**：
1. 首次接触
2. 中断工作流
3. 错误路径恢复
4. 回访用户
5. 纯键盘操作
6. 大量数据
7. 破坏性操作确认
8. 受限角色
9. 生命周期位置
10. 往返工作流完整性
11. 数据时间分布

### 步骤6：结论

生成结论块，包含：
- 结论状态
- 硬门禁计分卡
- 发现统计（Critical/High/Medium/Low）
- TOP 5 优先修复项
- 完美路线图（快速胜利/结构性改进/高级打磨）

### 步骤7：修复验证

修复发现后，重新走查受影响区域，更新报告。

## 30秒自测流程

在每次 UI 变更标记「完成」前：
1. 打开受影响页面
2. 在任意输入框输入
3. 点击主要操作按钮
4. 观察下一个状态 2 秒
5. 打开相关视图（线程、弹窗、详情）
6. 读取控制台

任何步骤出现异常行为，变更未完成。

使用说明

# UX 审计

以真实用户身份走查在线应用，发现交互层面的可用性问题。

## 使用

```text
对这个应用做 UX 审计
走查测试所有页面
```

## 工作原理

以交互优先的方式走查应用——输入、点击、发送、截图。通过交互清单证明真实操作，配合硬门禁（控制台错误、网络错误、布局崩溃、无障碍违规、性能指标）自动判定审计结论。

如何安装此技能？

访问技能市场，点击「安装」按钮，按提示将技能包放入 AI 编程助手的 skills 目录即可。