By name: visual-check description: 视觉检查技能，用于验证UI修改后的实际效果。在完成UI相关修改后，使用 read_image 工具获取截图并分析，确保修改效果符合预期。适用于文字工具栏位置、图片工具栏位置、元素对齐、样式调整等UI验证场景。
Visual Check — 视觉检查
核心用途
交付前必须进行视觉检查！
当修改涉及以下内容时，必须在调用 done 工具前执行视觉检查：
- 工具栏位置调整
- 元素位置/尺寸变化
- 样式修改（颜色、字体、间距等）
- 布局调整
- 动画效果
- 响应式适配
检查流程
1. 确认检查目标
明确需要验证的内容：
- 元素位置是否正确
- 是否有遮挡/重叠
- 对齐是否准确
- 缩放后是否正常
- 不同状态下是否一致
2. 获取截图
用户提供的截图通过 read_image 工具分析：
read_image(
urls: ["截图URL"],
prompt: "详细描述图片中[具体元素]的位置、状态、是否存在遮挡或对齐问题"
)
3. 分析检查项
根据修改内容，检查以下维度：
| 检查项 | 验证内容 |
|---|---|
| 位置准确性 | 元素是否在预期位置 |
| 无遮挡 | 是否遮挡其他元素或被遮挡 |
| 对齐一致性 | 与参考元素是否对齐 |
| 缩放适配 | 放大/缩小后位置是否正确 |
| 状态一致 | 不同交互状态下是否正常 |
4. 输出检查结果
## 视觉检查结果
| 检查项 | 结果 | 说明 |
|--------|------|------|
| 位置准确性 | ✅/❌ | 具体描述 |
| 无遮挡 | ✅/❌ | 具体描述 |
| 对齐一致性 | ✅/❌ | 具体描述 |
| 缩放适配 | ✅/❌ | 具体描述 |
**结论**: 通过 / 需要修复
常见检查场景
工具栏位置检查
prompt: "分析工具栏位置：
1. 工具栏水平中心是否对齐元素中心
2. 工具栏是否遮挡元素内容
3. 工具栏与元素间距是否合理
4. 放大/缩小后位置是否正确"
文字元素检查
prompt: "分析文字元素：
1. 文字位置是否正确
2. 选择框是否完全包围文字
3. 工具栏是否跟随文字位置
4. 是否有异常显示（如重复、错位）"
缩放适配检查
prompt: "分析缩放状态：
1. 当前缩放比例（放大/缩小/正常）
2. 元素位置是否随缩放正确调整
3. 工具栏是否正确跟随
4. 是否有元素跑到屏幕外"
注意事项
- 必须使用 read_image 分析截图，不能仅靠代码逻辑推断
- 检查失败必须修复，修复后重新检查
- 输出完整的检查表格，不能省略检查项
- 结论必须明确，通过或不通过
与 AGENTS.md 验证清单的关系
本技能是 AGENTS.md 中「真人模拟验证」的视觉检查部分补充：
- AGENTS.md 要求类型检查、服务存活、日志检查等
- 本技能专注于 UI/视觉层面的验证
- 两者都需要在交付前完成