h5-demo-review

name	h5-demo-review
description	H5交互Demo多视角评测技能。当用户提供H5交互Demo文件路径并要求进行体验评测、 生成修改建议、输出修改指令文档时使用此技能。 调用agent-squad小队从视觉、交互、用户旅程、逻辑一致性四个维度并行评测， 每轮生成结构化问题清单，并自动追加到项目修改指令md文件中。 支持增量迭代：每次修改后重新体验，只记录新增/残留问题，不重复已修问题。 触发关键词：体验下demo、帮我看下这个h5、评测交互、看下修改效果、 demo体验、再体验一遍、小队体验、交互评测。

H5 Demo 多视角评测 — SOP

定位：本技能是 agent-squad 的专项联动场景。 agent-squad 提供持久人格数据，本技能提供评测 SOP 和输出规范。

---

一、前置准备

Step 1 — 读取 Demo 文件

读取用户提供的 HTML 文件全文（CSS + HTML 结构 + JS 逻辑全部读取）。 关键关注点：

• CSS 变量定义（色板/间距/字号）
• 页面结构（有多少个 page，导航逻辑）
• 状态管理（state 对象，各模块的数据结构）
• 渲染函数（renderXxx，了解每个视图怎么生成）
• 交互函数（点击/完成/领取等所有用户操作）
• 工具函数（toast/modal/动画等）

Step 2 — 读取设计基调（如有）

如果项目有设计基调文件，读取它作为视觉评测的对照基准。 2KOL3 项目默认路径：C:\Users\tiannuoxie\2kol3\H5交互demo\2kol3设计基调.md

Step 3 — 读取 agent-squad profiles

读取 C:\Users\tiannuoxie\AgentSquad\profiles\ 下所有 8 个 Agent profile。

Step 4 — 确认修改指令文档路径

询问或推断本次评测对应的修改指令 md 文件路径。 本次默认路径：C:\Users\tiannuoxie\2kol3\designer-llm-wiki\doc\raw\design\pending\活动\demo\修改指令-活动Demo.md

---

二、评测阵容分配

根据评测重点选择合适的 Agent 子集。标准阵容如下：

Agent	本次职责	核心关注维度
Instinct（炽锋）	第一印象 + 手感	视觉廉价感、控制感缺失、操作节奏
Trace（拾墨）	细节与代码核对	文案精确性、实现完整度、逐条核对上轮问题
Deduce（墨隐）	逻辑一致性	状态机完整性、规则与实现的裂缝、代码漏洞
Gambit（棋落）	用户旅程全局	旅程断点、跨模块联动、长线价值
Throne（摇光）	成就感与激励	完成后的展示/反馈、成就仪式感
Toxin（蚀心）	信息结构漏洞	信息不对等、决策成本、可被优化的路径
Anvil（铁戟）	经验实证对比	同类产品对比、基本功检查、数据节奏
Tradeoff（灰弦）	投入产出比	奖励感知值、付出与回报比

精简阵容（快速迭代轮，重点看修复效果）：Trace + Instinct + Deduce 三人组，其余补充观察。

---

三、评测执行 SOP

阶段一：逐条核对上轮修复（仅第二轮起）

Trace 主导，逐条核对修改指令 md 中上一轮的问题清单：

• ✅ 已修复：确认 + 注明代码行
• ❌ 未修复：标注「仍存在」
• ⚠️ 修复方式有误：标注「修复方式待调整」+ 说明

阶段二：新问题发现

各 Agent 按自己的认知风格进行体验，覆盖以下检查点：

视觉层检查点

• 色值是否对齐设计基调
• 字号层级是否清晰（主文/次文/弱文三层）
• 图标/图形是否垂直居中、不与文字重叠
• 深色背景下文字对比度是否足够
• 动效是否因 DOM 重建而失效
• 毛玻璃层数是否合理（不超过两层）

交互层检查点

• 所有按钮的 hover/active/disabled 状态是否完整
• 已完成状态的可点击元素是否有 pointer-events:none
• 弹窗开关是否有过渡感（不能瞬间消失）
• Toast 时长是否足够（建议 2800ms+）
• 动画是否正确触发（transition 在新增 DOM 元素上需要 rAF 延迟）
• 积分/数值变化是否有动效反馈

用户旅程检查点

• 入口页是否有进度摘要（无需点进去就知道自己在哪）
• 活动完成后是否有「然后呢」的下一步引导
• 跨模块是否有联动（完成A模块能否影响B模块）
• 关键信息（刷新时间/规则说明）是否在用户需要时就能看到
• 翻页/切换视图是否有「出不去」的陷阱

逻辑一致性检查点

• 规则文案与代码逻辑是否一致
• 状态机是否完整（所有状态组合都有处理）
• DOM id 是否唯一，选择器是否会误匹配
• 初始化时状态是否正确（updateDots/updateProgress 是否在 init 时调用）
• 子视图完成操作后，返回父视图时数据是否同步更新

阶段三：汇总输出

格式：

## 第N轮评测（YYYY-MM-DD HH:MM）

### ✅ 本轮已修复确认
| 条目 | 状态 |
|------|------|
| [上轮编号] 描述 | ✅ 已修复 · L行号 |

### 🐛 Bug
| # | 位置 | 问题 | 代码行 |
|---|------|------|-------|

### 🎨 视觉
| # | 位置 | 问题 |
|---|------|------|

### 🔁 交互
| # | 位置 | 问题 |
|---|------|------|

### 🗺️ 旅程
| # | 位置 | 问题 |
|---|------|------|

---

四、修改指令写入规范

评测完成后，增量追加到修改指令 md 文件末尾。格式：

## 第N轮评测补充（YYYY-MM-DD）

> 上轮X条问题已全部/部分修复。以下为本轮新发现，共X条。

### 🐛 Bug 修复

**BX｜[简短标题]**

[问题描述]

[修改方案 + 代码片段]

---

### 🎨 视觉问题 / 🔁 交互问题 / 🗺️ 旅程问题
...

*第N轮补充共X条。优先处理：BX > VX > IX。*

原则：

• 每条问题带完整可用的代码片段，CC 可直接复制
• 优先级在末尾注明，最高优先级的原因简要说明
• 不重复已在之前轮次中完整写过的内容，只写增量

---

五、Profile 写回规则

评测完成后，必须写回参与 Agent 的成长日志（C:\Users\tiannuoxie\AgentSquad\profiles\）。

写回内容：

• 活动类型：游戏活动UI交互评测
• 角色定位：本次承担的评测维度
• 关键输出：本次发现的最有价值的问题
• 经验教训：这种评测场景下该认知风格的有效策略

写回时机：在输出最终报告之前完成写回，不是之后。

---

六、迭代节奏建议

阶段	评测深度	推荐阵容
首轮（初版体验）	全量 8 人	全员
修复后复查	核对修复 + 新问题	Trace + Instinct + Deduce
精修轮（接近冻结）	只找遗漏细节	Trace + Deduce
冻结确认	走完整流程验证	Instinct（手感最敏感）

---

七、「本次」快速上下文

以下为当前活跃项目的具体信息，每次调用时可用这些路径和约定。

项目	2KOL3 赛季限时活动 Demo
Demo 文件	C:\Users\tiannuoxie\2kol3\designer-llm-wiki\doc\raw\design\pending\活动\demo\index-standalone.html
修改指令 md	C:\Users\tiannuoxie\2kol3\designer-llm-wiki\doc\raw\design\pending\活动\demo\修改指令-活动Demo.md
设计基调	C:\Users\tiannuoxie\2kol3\H5交互demo\2kol3设计基调.md
历史评测轮次	已完成3轮（见修改指令 md）
当前状态	核心 Bug 已清，视觉方向对齐，可演示