design-reviewcommit ed10791 · v2.0.0SKILL.md · UI 与交互

设计审查

以设计师视角审查线上页面的视觉一致性、间距、层级和 AI 痕迹，再逐项修复并复验。

每项修复都会 git 提交（开始前可能提交或暂存你未提交的改动），并用你已登录的浏览器会话访问网站。

npx skills add garrytan/gstack --skill design-review

权限: read-repo
write-files
shell
network
兼容工具: Claude Code, Codex, Cursor, Copilot
GitHub: 138.5k
来源: 社区 · Garry Tan
状态: 扫描通过
许可证: MIT
分类: UI 与交互
代码仓库: github.com/garrytan/gstack/design-review

核心规则

每个问题只做最小修复并单独提交，一旦引发回归就立即回滚。

执行阶段

阶段 01准备
确定目标 URL（功能分支无 URL 时按 diff 限定范围），读取 DESIGN.md 或代码中的设计令牌，并要求 git 工作区干净。
阶段 02设计审计
通过浏览器截图记录第一印象、提取实际设计系统、逐页按清单检查，再审查交互流程和跨页一致性，每个问题都附截图。
阶段 03分级与修复
按影响排序，优先改 CSS 做最小修复，每项单独提交并复测；风险超过20%时暂停询问，最多修复30项。
阶段 04终审与报告
重新审计受影响页面并计算前后评分，写出含修复状态与截图对比的报告，并更新 TODOS.md。

权限说明（据 SKILL.md 整理）

能力	是否需要	说明
文件写入	部分需要	只修改与问题直接相关的源文件，可新建回归测试、报告和经同意的 DESIGN.md；不改 CI 配置和已有测试。
命令执行	需要	运行 git、浏览器驱动脚本（Aside 或 gstack 浏览器）、gstack 辅助工具和测试命令。
网络外发	需要	访问目标网站，可使用 WebSearch，并可请求 Codex 提供外部意见。

SKILL.md 头部信息（YAML）commit ed10791 · v2.0.0

---
name: design-review
preamble-tier: 4
version: 2.0.0
description: "Designer's eye QA: finds visual inconsistency, spacing issues, hierarchy problems, AI slop patterns, and slow interactions — then fixes them. (gstack)"
allowed-tools:
  - Bash
  - Read
  - Write
  - Edit
  - Glob
  - Grep
  - AskUserQuestion
  - WebSearch
triggers:
  - visual design audit
  - design qa
  - fix design issues
---

核心规则

执行阶段

阶段 01准备

阶段 02设计审计

阶段 03分级与修复

阶段 04终审与报告

权限说明（据 SKILL.md 整理）

SKILL.md 头部信息（YAML）

相关技能