Ux Skill

English · العربية · 简体中文 · 繁體中文 · 日本語 · 한국어 · हिन्दी · Bahasa Indonesia · Tiếng Việt · ไทย · Français · Deutsch · Español · Português · Italiano · Русский · Türkçe

ux-skill：面向 Claude Code、Cursor 及所有其他 AI 编码工具的设计智能引擎

设计智能引擎，让 AI 生成的 UI 呈现鲜明个性，而非千篇一律。 将它安装到 17 种 AI 编码工具中的任意一种，生成的内容就不再带有 AI 制作的感觉。免费、MIT 许可、离线运行、不需要大模型。

pip install uxskill

如果觉得它有用，在 GitHub 上为 ux-skill 点星，这是支持项目成本最低的方式。刚接触这个项目？可以从一分钟速览开始，或访问 uxskill.laithjunaidy.com 查看实际演示。

之前：泛泛的图库照片，充斥着低质 SEO 内容。之后：深色遮罩下的真实施工照片主视觉、带琥珀色强调色的编辑风格标题，以及主视觉中的报价表单。同样的 AI 编码工具、同样的提示词，由 ux-skill 提供约束后，结果截然不同。

v3.1.0，THE BRAIN，现已忠于品牌并支持响应式设计。 最强大的 AI 编码 UX 插件。包含 Python 推理核心、确定性的 7 轴合成器、12 个可查询的 JSON 清单（84 种风格、176 个调色板、70 组字体搭配、148 个组件、184 个行业、35 种图表类型、57 个动效预设、112 条 UX 法则、152 条反模式规则、25 种技术栈、160 份品牌规范）、25 个斜杠命令、5 个子 Agent、18 个 MCP 工具，以及确定性的反 AI 套路检查器。支持跨 IDE 使用：可安装到 Claude Code、Cursor、Windsurf、GitHub Copilot、Gemini CLI、Codex、Kiro、Cline、Continue、Aider、Zed、JetBrains AI、Pieces、Tabby、Tabnine、CodeWhisperer 和 Roo Cline。

品牌名称为 ux-skill。 PyPI / npm 包名仍为 uxskill。GitHub 仓库位于 Laith0003/ux-skill。

作者： Laith Aljunaidy，安曼的设计师兼 CTO · 网站： uxskill.laithjunaidy.com · 与所有 Claude UX 插件对比： compare.html · GitHub： Laith0003/ux-skill · PyPI： uxskill · npm： uxskill

v3.1 新功能：忠于品牌、响应式、鲜活生动

• 严格落实品牌一致性，而非寄希望于此。 主色取自 LOGO 的像素（而非 CSS 中使用最多的颜色）；如果默认字体不符合 LOGO 的字形风格，就会被拒绝。提取出的品牌信息会从 recommend 传递到 synthesize；evaluate 中的硬性底线会让任何丢失品牌颜色或 LOGO，或没有实际图片的输出直接 FAIL。与开放的 brand.md 约定实现双向互操作（渲染 + 导入）。
• 移动优先，设有门槛。 新增设计基础规范（responsive.md、component-behaviors.md），以及一个能检测并阻止横向滚动、导航栏／字标／按钮标签换行，或粘性页眉过高的门槛。
• 惊艳体验层。 引擎会为每个页面设计 2-3 个相互协调的标志性亮点，推翻了“惊艳体验只能由用户带来”的理念。
• 更精准的代码检查器（152 条规则）：强制使用图片 + 检测仅图标元素，新增占位符标记和 100vw 规则；保留预置的 picsum 图片，移除随机图片。

310 项测试全部通过。 离线运行。结果确定。绝不调用 LLM。完整说明见 CHANGELOG.md。

v3 新功能

• 品牌规范成为训练数据，而非模板。 160 份品牌规范不再是推荐器从中挑选的目录，而是合成器提炼学习的词汇。每次调用都会生成新颖的输出。
• 7 轴合成器（温暖度、对比度、密度、几何感、正式度、动效、字体个性）。简介会确定性地映射为各轴取值；这些取值会编译成全新的调色板、字体、间距、圆角和动效标记。
• 三种自动分派模式：strict_brand（100% 使用单一品牌）、brand_anchor（70% 使用单一品牌 + 30% 使用经轴向适配的同类品牌）、pure_synthesis（不指定品牌，从 8 个轴向匹配的范例中提炼）。
• 决策记录推动推荐器运行。 .ux/decisions.jsonl 会根据同一 (industry, ui_type) 分类中过往的成功记录，对候选项重新排序。可安全用于冷启动。仅统计 lint_score >= 80 且 user_accepted = true 的决策。
• 轴交互矩阵：明确解决相互竞争的轴之间的冲突（密集 + 企业风格 → 4px，轻盈 + 企业风格 → 12px，柔和 + 活泼 → 18px 圆角）。不再有隐式的临时规则。
• /ux-evolve 自动循环：代码检查 → 润色 → 重新检查，直到得分 ≥ 90、分数趋于平稳或完成 5 轮。质量门槛为 65。
• 新增 3 个 MCP 工具（15 → 18）：ux_synthesize、ux_decisions_query、ux_decisions_stats。
• 本地统计信息仪表板：uxskill stats --html 会生成 .ux/stats.html，展示你的安装版本学到了什么。无遥测数据，也不进行全局汇总。
• 223 项测试全部通过。 离线运行。结果确定。绝不调用 LLM。

完整详情见 CHANGELOG.md。

Star 历史

---

什么是 ux-skill

ux-skill 是面向 AI 编码工具的设计智能引擎。它既可作为 Python 软件包运行（pip install uxskill），也可作为 Claude Code 插件运行，还提供适用于 17 款 IDE 的多合一安装程序。该引擎会读取项目简介（行业、受众、基调、必备项、禁用做法、技术栈、地区），并返回一套完整的推荐设计系统：风格、配色、字体组合、动效预设、组件、可供研究的品牌范例，以及必须遵守的反模式防护准则。推荐结果具有确定性：相同输入始终产生相同输出。

该插件位于你与 AI 编码工具之间。当你要求 Claude Code、Cursor 或其他 AI 助手“构建一个金融科技落地页”时，助手通常会临场发挥，结果不到五秒就会显出 AI 生成的痕迹（紫蓝渐变、三个尺寸相同的卡片、用于大标题的 Inter 字体、用户评价里的“John Doe”、默认 300ms 过渡效果、居中的主视觉区、弹跳箭头 CTA）。ux-skill 用结构化约束取代临场发挥：先运行 /ux-discover 收集简介，再运行 /ux-recommend 选择设计系统，接着运行 /ux-design 生成代码，最后运行 /ux-lint，在提交前验证代码是否通过 152 条确定性的反 AI 套路规则。

本 README 是权威参考文档。所有命令、子 Agent、数据清单、安装路径、品牌规范和反模式类别都在这里记录。如果你正在寻找 Claude Code 设计插件，或比较适用于 Cursor、Windsurf 或 Codex 的 AI 设计工具，请从头到尾阅读本文，并对照查看 compare.html。

---

目录

1. 核心引擎：v3.0 是什么
2. 快速安装
3. 数据对比：与排名前 8 的 Claude UX 技能实时比较
4. 架构：各部分如何协同
5. 25 个斜杠命令：详细参考
6. 5 个子 Agent
7. 11 份数据清单
8. 152 条反 AI 套路规则：检查器
9. 160 份品牌 DESIGN.md 规范：按类别划分
10. MCP 服务：差异化优势
11. 适用于 17 款 IDE 的安装程序
12. 使用场景：具体示例
13. 与其他方案的比较
14. 路线图
15. 参与贡献
16. 许可证、作者与致谢

---

大脑：v3.0 是什么

v3.0.0 是 ux-skill 历史上最大的一次架构转变。推荐器不再从目录中挑选模板，引擎会根据每份需求简报合成全新的设计语言。相同的需求简报始终生成相同的输出（完全确定），而每份不同的需求简报都会生成各自独特的系统。品牌规范不再是模板，而是引擎学习词汇的训练数据。系统能审视自身历史，在本地闭合反馈环路，并且绝不调用大模型。

编译器是一个确定性的 7 轴合成器：温度、对比度、密度、几何、正式度、动效、字体个性。每份需求简报都会映射到各轴的取值；轴取值会编译成全新的调色板、字体、间距、圆角和动效令牌。模块化字体比例会根据对比度选择比例（1.200 安静 / 1.250 均衡 / 1.333 醒目）。布局基元从设计之初就具有响应式特性（auto-fit minmax(min(N, 100%), 1fr) + 容器查询）。无法生成损坏的布局，因为这种布局无法表示。

系统会自动分派三种模式：strict_brand（reference_brands=[stripe] strict=True → 100% Stripe 令牌，最快路径）；brand_anchor（reference_brands=[stripe] → 70% Stripe + 30% 根据 4 个同类品牌调整的轴）；以及 pure_synthesis（未指定品牌 → 无限空间，将 8 个轴匹配的范例提炼为一种全新的设计语言）。冲突的轴会通过有文档说明的轴交互矩阵解决：密集 + 企业风格编译为 4px（密度优先，Bloomberg 风格），疏朗 + 企业风格编译为 12px（正式度优先，奢华风格），柔和 + 活泼编译为 18px 圆角，锐利 + 企业风格编译为 2px。实现中没有不透明的临时规则。

决策台账（.ux/decisions.jsonl，架构 _v: 1 已锁定）闭合了反馈环路。推荐器现在会根据相同 (industry, ui_type) 分组中以往的成功记录重新排列候选项。它能安全处理冷启动，先验记录少于 3 条时会跳过。它只统计 lint_score >= 80 且 user_accepted = true 的决策。此外，/ux-evolve 会运行 lint → 润色 → 再次 lint，直到分数 ≥ 90、达到平台期或完成 5 轮；质量门槛为 65 分，低于此分时会拒绝输出，除非使用 --force。最终效果是：每次安装都会根据自身语料库不断改进，每次运行在不同机器上都可复现，而且引擎始终完全离线。

---

快速安装

有三种安装方式。请选择适合你环境的方式。

方式 1：Claude Code marketplace（规范方式）

如果你使用 Claude Code，可通过插件市场安装：

/plugin marketplace add Laith0003/ux-skill
/plugin install ux@ux-skill

这会将全部 25 个斜杠命令和 5 个子 Agent 接入你的 Claude Code 会话。安装后，运行 /ux-init 来设置项目级 .ux/ 状态目录，并验证 Python 引擎是否可访问。

方式 2：pip（通用）

如果你在 Claude Code 之外使用（Cursor、Windsurf、CLI、CI），请安装 Python 软件包：

pip install uxskill
uxskill init                       # auto-detects your IDE, installs the right artifact
uxskill stats                      # print manifest counts to verify install
uxskill lint .                     # run the linter against the current directory

该软件包会将 ux 和 uxskill 都作为 CLI 入口点公开，它们是同一个二进制文件。

方式 3：npx（无需 Python）

如果你不想直接管理 Python，npx 封装程序会通过 pipx 引导安装所有内容：

npx uxskill init                  # downloads pipx + uxskill on first run
npx uxskill recommend --industry=fintech-neobank --tone=warm --stack=nextjs-15-app-router

验证安装

ux stats
# {
#   "version": "3.0.0-stable",
#   "counts": {
#     "styles": 84,
#     "palettes": 176,
#     "type-pairs": 70,
#     "components": 148,
#     "industries": 184,
#     "chart-types": 35,
#     "tech-stacks": 25,
#     "ux-guidelines": 112,
#     "motion-presets": 57,
#     "anti-patterns": 145,
#     "brands": 160
#   }
# }

如果任何计数结果为 0，说明 JSON 文件缺失，请在 github.com/Laith0003/ux-skill/issues 提交问题。

---

数据：与排名前 8 的 Claude UX 技能实时对比

星标数最后于 2026-05-28 通过 gh api 核实。ux-skill（Laith0003/ux-skill）是最新加入者，知名度远不及对手，但架构更深入。以下对比力求客观：我们的短板与优势。

插件	星标数	架构	斜杠命令	代码检查器（适用于 CI）	品牌规范	组件	动效预设	支持的 IDE
nextlevelbuilder/ui-ux-pro-max-skill	83,958	Python BM25 + CSV，单个技能	1	-	,	0	0	18
nexu-io/open-design	54,406	Node.js + 19 个技能 + 预览	19	-	,	0	0	1
Leonxlnx/taste-skill	25,202	Bash + 基于研究的品味指导	1	-	,	0	0	1
alchaincyf/huashu-design	15,455	单个 62 KB 的 SKILL.md + 脚本	1	-	,	0	0	1
google-labs-code/stitch-skills	5,762	接入 MCP 的技能库	多个	-	,	0	0	1
dominikmartn/nothing-design-skill	2,391	单一美学风格技能	1	-	,	0	0	1
Nutlope/hallmark	2,164	反劣质设计技能	1	-	,	0	0	1
hamen/material-3-skill	955	MD3 组件 + 审查	1	-	（仅 MD3）	0	0	1
Laith0003/ux-skill（ux-skill）	14	Python 引擎 + 12 个清单 + 25 个命令 + 5 个子 Agent + CI 代码检查器	22	152 条正则规则	160	148	57	17

我们的短板

• 知名度。 他们有数十万颗星标，而我们只有 14 颗。给我们点个星标吧，这是帮助我们的最简单方式。
• 品牌认知度。 ui-ux-pro-max 和 open-design 领先了几个月，而不是几天。
• 营销包装。 他们有截图、演示视频和易于发现的落地页。我们有一份详尽的 README 和一个内容不多的落地页。

我们的优势

• 组件库： 148 个文档齐全的组件，包含结构、状态、所用令牌和动效规范。其他 8 个项目都没有提供组件清单。
• 动效预设： 57 个可直接用于技术栈的条目（Framer Motion、GSAP、CSS），并提供减少动态效果的后备方案。其他项目都没有提供动效清单。
• 反模式代码检查器： 152 条确定性正则规则，可在 CI 中运行，遇到 Critical/High 级别问题时以非零状态码退出。其他项目都没有提供确定性代码检查器。
• 品牌规范： 160 份真实的 DESIGN.md 规范（Apple、Stripe、Linear、Figma、Tesla、BMW、Notion、Spotify、Airbnb、Vercel、Supabase、Cursor、Raycast、Claude，以及另外 96 个品牌）。其他项目都没有提供品牌库。
• 支持 17 款 IDE： 使用相同的引擎，并针对不同 IDE 配置不同的适配层。
• 25 个斜杠命令： 涵盖发现、生成、审查、代码检查、润色、修复循环、案例研究、研讨会、文案、动效、无障碍、仪表板、协调器等，并已全面集成。

查看完整的逐表并排对比：uxskill.laithjunaidy.com/compare.html。

---

架构：各部分如何协同

ux-skill (package name: uxskill)
│
├── data/                              The brain, queryable JSON manifests
│   ├── styles.json                    84 design styles + when/skip + tokens
│   ├── palettes.json                  176 palettes (light/dark, contrast verified)
│   ├── type-pairs.json                70 display × body × mono triplets
│   ├── components.json                148 components (anatomy, states, motion)
│   ├── industries.json                184 industry rules + audience signals
│   ├── chart-types.json               35 chart types (when/skip, encoding)
│   ├── tech-stacks.json               25 stacks (Next, Astro, SvelteKit, Blade...)
│   ├── ux-guidelines.json             112 named UX laws (Hick, Fitts, Miller...)
│   ├── motion-presets.json            57 motion presets (entry, exit, hover...)
│   ├── anti-patterns.json             152 regex rules (CI-safe linter source)
│   └── brands/*.json                  160 brand DESIGN specs + _index.json
│
├── engine/                            Python, the reasoning
│   ├── synthesizer/                   v3-7-axis deterministic compiler
│   ├── decisions/                     v3, .ux/decisions.jsonl ledger + recommender re-rank
│   ├── recommender/                   5-parallel-search merge engine (re-ranked by decisions)
│   ├── linter/                        Deterministic anti-slop scanner
│   ├── discovery/                     10-field forcing protocol
│   ├── generator/                     Token + manifest emitter
│   ├── installer/                     17-IDE multi-installer
│   └── cli/                           `ux` / `uxskill` entry point
│
├── commands/                          22 Claude Code slash commands (.md)
│   ├── ux-init.md                     bootstrap
│   ├── ux-stats.md                    inventory snapshot
│   ├── ux-discover.md                 10-field intake (gate)
│   ├── ux-recommend.md                FLAGSHIP, 5-parallel search
│   ├── ux-lint.md                     deterministic linter
│   ├── ux-design.md                   generate frontend code
│   ├── ux-component.md                generate one component
│   ├── ux-system.md                   generate full design system
│   ├── ux-dashboard.md                generate dashboard surface
│   ├── ux-motion.md                   motion treatment + audit
│   ├── ux-audit.md                    6-lens design audit
│   ├── ux-a11y.md                     WCAG 2.1 AA audit
│   ├── ux-critique.md                 taste critique (3 wins, 3 misses, 1 move)
│   ├── ux-copy.md                     microcopy review + rewrite
│   ├── ux-fix.md                      apply findings as atomic commits
│   ├── ux-polish.md                   cosmetic pass + AI-slop kill
│   ├── ux-frame.md                    4-field framing block
│   ├── ux-research.md                 research planning + synthesis
│   ├── ux-workshop.md                 5-phase design thinking workshop
│   ├── ux-case-study.md               publishable monochrome editorial case study
│   ├── ux-next.md                     workflow conductor (read-only)
│   └── ux-expert.md                   consulting hook
│
├── agents/                            5 sub-agents (.md)
│   ├── frontend-engineer.md           React/Next/Vue/Blade/Astro
│   ├── motion-engineer.md             Framer Motion / GSAP / CSS
│   ├── copy-writer.md                 microcopy in brand voice
│   ├── research-synthesizer.md        interviews + analytics + competitors
│   └── design-system-architect.md     tokens / components / foundations
│
├── references/                        Prose source for the data + demo pages
│   ├── foundations/                   anti-patterns.md, principles, taste
│   ├── laws/                          UX laws long-form
│   ├── process/                       discovery-protocol.md (load-bearing)
│   ├── styles/                        per-style prose (anti-slop.md, etc.)
│   ├── components/                    component long-form
│   ├── output/                        output rubrics
│   └── conditional/                   stack-specific guidance
│
├── bin/
│   ├── uxskill.mjs                    npx wrapper -> Python engine
│   ├── ux-lint.py                     v2 linter (preferred)
│   └── ux-lint.sh                     v1 fallback (bash + perl-PCRE)
│
└── .ux/                               (created per project)
    ├── last-discovery.json            brief snapshot
    ├── last-recommendation.json       picked system
    ├── last-frame.json                framing block
    ├── last-audit.json / last-a11y.json / last-copy.json / last-motion.json
    ├── last-design.json / last-component.json / last-dashboard.json
    └── last-critique.json / last-polish.json / last-research.json / last-workshop.json / last-case-study.json

引擎的实际工作方式

1. 输入。 你可以通过 /ux-discover（10 个字段）交互式提供简要说明，也可以通过 ux recommend 的标志以非交互方式提供。
2. 5 项并行搜索。 引擎会并发执行五项查找，搜索各个清单：
   • 行业 → recommended_styles（industries.json）
   • 风格 → 调色板 + 字体 + 动效兼容性（styles.json）
   • 语气 × 必备项 → 调色板筛选（palettes.json）
   • 技术栈 → 组件兼容性 + 动效预设（tech-stacks.json、motion-presets.json）
   • 禁用项 + 地区 → 防护规则 + 品牌示例候选列表（anti-patterns.json、brands/）
3. 合并。 确定性合并器会为候选项排序、解决冲突（例如，必备的深色模式会强制指定调色板模式），并生成单一的推荐系统。
4. 输出。 一个 JSON 文档，包含选定的风格、调色板、字体组合、前 5 个动效预设、前 12 个组件、前 5 个品牌示例，以及全部 152 条已启用的反模式防护规则。另附说明每项选择依据的理由区块。
5. 生成。 下游命令（/ux-design、/ux-component、/ux-system、/ux-dashboard）会使用该推荐，通过子 Agent 生成实际代码。
6. 验证。 /ux-lint 会根据 152 条正则规则重新扫描生成的代码。在 CI 中遇到严重或高危问题时以非零状态码退出。

v3 新增内容。 推荐器现在会使用 .ux/decisions.jsonl 对 engine/decisions/ 中的候选项重新排序（仅统计 lint_score >= 80 且 user_accepted = true 的决策；先验数据少于 3 条时可安全冷启动）。生成器路径可以调度至 engine/synthesizer/，这是一个确定性的 7 轴编译器，会根据每份简要说明生成全新的调色板、字体、间距、圆角和动效 token，而不是从目录中挑选模板。详情请参阅大脑：v3.0 是什么。

Python 思考。HTML 呈现。Markdown 串联。

---

25 个斜杠命令：详细参考

每个命令都以 .md 文件的形式存放在 commands/ 下，包含 description、allowed-tools、triggers、when to use、when to skip、input、process 和 output state file。下方的描述经过精简；完整源码才是规范依据。

命令分为五类：初始化与清点、发现与推荐、生成、审计与验证、修复与润色，以及协调器。

初始化与清点

/ux-init：初始化项目

• 内容： 检测你正在使用的 IDE（.claude/、.cursor/、.windsurf/ 等），安装相应的产物，验证 Python 引擎是否可用，并输出统计快照。
• 适用时机： 在新项目中首次安装时。克隆使用 ux-skill 的项目后。执行 pip install --upgrade uxskill 后。
• 跳过时机： 已在此项目中运行过，且没有任何变更。
• 调用方式： /ux-init（无参数），或通过 CLI 运行 uxskill init。
• 输出： 针对各 IDE 的产物（参见 17 种 IDE 安装器）+ .ux/ 目录 + stdout 摘要。
• 后续命令： 接下来运行 /ux-discover。

/ux-stats：输出数据清单

• 内容： 输出 11 个数据清单的版本和条目数，方便你确认已安装的内容。
• 适用时机： 安装后。升级后。当 /ux-recommend 返回的选择出乎意料，且你怀疑清单不完整时。
• 跳过时机： 无需跳过，这是一个耗时 50 毫秒的只读命令。
• 调用方式： /ux-stats 或 uxskill stats。
• 输出： 输出至 stdout 的 JSON（参见上文验证安装）。
• 后续命令： 仅用于诊断；不会为下游流程提供输入。

发现与推荐

/ux-discover：强制填写表单（10 个字段）

• **内容：**每个项目在运行任何生成命令前，都必须填写这份包含 10 个字段的表单：项目类型、受众、主要目标、语气、必需项、禁用项、参考品牌、技术栈、地区、成功指标。**不得自行发挥。**禁用词（如“现代”“简洁”）会要求用户具体说明。
• **使用时机：**运行任何 /ux-design、/ux-component、/ux-system 或 /ux-dashboard 之前。之前的项目简介已过时，需要更新时。
• **跳过时机：**正在修复 bug（使用 /ux-fix）。仅运行 lint 检查（使用 /ux-lint）。项目简介与上次会话相比没有变化。
• 调用方式：/ux-discover。插件提问，你来回答。
• **输出：**写入 .ux/last-discovery.json（包含 10 个字段的项目简介）。
• 后续操作：/ux-recommend → 根据发现结果选择风格、调色板、字体、动效和组件。/ux-design [extra brief] → 根据推荐生成前端代码。/ux-component <name> → 生成一个符合已发现约束的组件。

/ux-recommend：旗舰级 5 路并行搜索引擎

• **内容：**运行 Python 引擎的 5 路并行搜索，查询 12 份清单，并返回合并后的设计系统。行业 → 风格 → 调色板 → 字体 → 动效 + 组件 + 品牌范例 + 防护规则。
• **使用时机：**从零开始新项目。为风格陈旧的产品调整方向。在运行任何 /ux-design 或 /ux-component 之前进行准备检查。
• **跳过时机：**已运行 /ux-discover 并保存项目简介；在该流程中会自动运行 /ux-recommend。只修复一个 bug（使用 /ux-fix）。仅需运行 lint 检查（使用 /ux-lint）。
• 调用方式（Claude Code）：

  /ux-recommend
  

  调用方式（CLI）：

  ux recommend \
    --project-type=landing \
    --industry=fintech-neobank \
    --tone=warm --tone=editorial \
    --must-have=dark-mode --must-have=a11y-AA \
    --forbidden=brutalism --forbidden=purple-gradients \
    --stack=nextjs-15-app-router \
    --region=mena
  

• **输出：**写入 .ux/last-recommendation.json，包含选定的风格、调色板、字体组合、排名前 5 的动效预设、排名前 12 的组件、排名前 5 的品牌范例、全部 152 条已启用的反模式防护规则，以及选择理由。
• 后续操作：/ux-design [brief] → 使用推荐的设计令牌生成前端代码。/ux-system → 根据推荐生成完整设计系统。/ux-component <name> → 使用推荐风格生成一个组件。/ux-lint → 验证生成的代码。

生成

/ux-design：根据项目简介生成精美、避免千篇一律的界面

• **内容：**根据发现结果和推荐，生成完整的生产级前端成品（落地页、营销网站、应用框架）。调用 frontend-engineer，并采用 anti-slop 和 arsenal 参考资料提供的创意指导。
• 使用时机：“设计一个”“帮我构建一个”“生成一个落地页”“创建一个仪表板”“制作一个组件”，以及任何自由形式的视觉交付请求。
• **跳过时机：**需要的是评审而非构建（使用 /ux-audit 或 /ux-critique）。只需要一个组件（使用 /ux-component）。后端或基础设施工作。
• 调用方式：/ux-design generate a fintech landing for a MENA neobank, warm editorial tone, dark-mode AA, no purple gradients。
• **输出：**生成的代码（HTML / Blade / JSX / Vue / Astro），以及 .ux/last-design.json。
• 后续操作：/ux-lint → 根据防护规则进行验证。/ux-polish → 进行外观优化。/ux-a11y → 进行无障碍审计。/ux-copy → 评审微文案。/ux-fix → 将检查结果作为原子提交应用。

/ux-component：生成单个组件

• 用途： 根据规范生成一个可用于生产环境的组件（按钮、模态框、导航栏、侧边栏、卡片、表格、表单、图表）。包含全部四种交互状态，兼顾无障碍性并符合品牌风格。首先在 .ux/last-recommendation.json 中查找该组件，找不到时则直接查询清单。
• 适用场景： 任何单元素请求，例如“构建一个按钮”“创建一张定价卡片”“制作一个模态框”“添加一个导航栏”“设计一个侧边栏”“我需要一个数据表格”“构建一个表单”“制作一个图表组件”。
• 不适用场景： 完整页面或包含多个区块的界面（使用 /ux-design）。后端或基础设施相关任务。
• 调用方式： /ux-component pricing-card-trio --brief="fintech, dark, monospace numbers"。
• 输出： 生成的组件代码，以及 .ux/last-component.json。
• 后续命令： /ux-lint → 验证。/ux-polish → 精修。

/ux-system：生成完整的入门设计系统

• 用途： 为尚无设计系统的项目提议一套完整的入门设计系统，包括设计令牌（颜色、字体、间距、动效、圆角、阴影）、基础文档、组件契约、暗色模式搭配和主题切换器。调度 design-system-architect。
• 适用场景：“我们没有设计系统”“为我们构建一套系统”“提议一些设计令牌”“我们的主题应该是什么”“为我们搭建 DS”。
• 不适用场景： 项目已有设计系统时，应使用 /ux-component 并基于现有系统进行开发。后端或基础设施相关任务。
• 调用方式： /ux-system（如果尚未完成发现流程，则会先执行该流程）。
• 输出： tokens.json、foundations.md、components/*.md 契约，以及可选的 Tailwind / vanilla / SCSS 输出。写入 .ux/last-system.json，以供后续命令使用。
• 后续命令： /ux-component → 基于新系统构建。/ux-design → 使用新令牌生成界面。

/ux-dashboard：专用仪表板生成

• 用途： 生成仪表板，注重数据密度管理、便当盒布局、表格用等宽数字、迷你图样式、避免过度使用卡片、语义化状态颜色和克制的动效。不是把图表贴上去的营销网站。
• 适用场景：“构建一个仪表板”“设计管理面板”“制作一个指标页面”“运营控制台”“分析视图”“KPI 看板”“监控界面”。
• 不适用场景： 带有统计数据的营销落地页（使用 /ux-design）。仅需一个组件（使用 /ux-component）。后端或基础设施相关任务。
• 调用方式： /ux-dashboard。
• 输出： 生成的仪表板代码，以及 .ux/last-dashboard.json。
• 后续命令： /ux-lint、/ux-audit、/ux-a11y。

/ux-motion：动效处理

• 用途： 生成界面的动效层，包括持续时间、缓动、编排、减少动态效果的回退方案和性能管理。还会根据 5 个维度（时序、缓动、含义、减少动态效果、性能）审查现有动效。
• 适用场景：“检查动效”“动画效果好吗”“修复动效”“审查动画”“动效审计”“检查动效性能”。
• 不适用场景： 界面没有动效（使用 /ux-audit 或 /ux-polish）。后端或基础设施相关任务。
• 调用方式： /ux-motion path/to/component.tsx（审查模式），或 /ux-motion --generate hero-entry（生成模式）。
• 输出： 更新后的代码（生成模式），或 .ux/last-motion.json 报告（审查模式）。
• 后续命令： /ux-fix → 应用动效审查结果。/ux-polish → 精修。

审查与验证

/ux-lint：基于正则表达式的确定性检查工具（不调用大模型，可安全用于 CI）

• 功能： 对代码运行 152 条正则规则。不调用大模型。在 CI 中发现严重 / 高严重性问题时以非零状态码退出。来源：data/anti-patterns.json。规则涵盖无障碍（23 条）、内容（15 条）、布局（13 条）、排版（10 条）、颜色（9 条）、质量（9 条）、视觉（9 条）、动效（8 条）、性能（4 条）。
• 适用场景： 提交前钩子。CI 门禁。在运行 /ux-audit 之前，先快速检查大型代码库。在 /ux-design 或 /ux-component 之后验证生成结果。
• 不适用场景： 需要修复循环（检查工具会报告问题，但不会编辑；可接着运行 /ux-polish --fix 或 /ux-fix）。需要审美判断（使用 /ux-critique）。
• 调用方式（斜杠命令）： /ux-lint src/。
• 调用方式（CLI）： uxskill lint . 或 python3 bin/ux-lint.py . 或 bash bin/ux-lint.sh --ci --fail-on high。
• 调用方式（CI）：

  - name: ux-lint
    run: bash bin/ux-lint.sh --ci --fail-on high
  

• 输出： 将检查结果输出到 stdout（位置、规则 ID、严重性、证据）。检查通过时退出码为 0；设置 --fail-on high 后，发现严重 / 高严重性问题时以非零状态码退出。
• 后续命令： /ux-polish --fix → 使用大模型驱动的对应工具处理相同模式。/ux-fix → 按严重性排序并将检查结果作为提交应用。/ux-audit → 进行完整的 6 个视角推理检查。/ux-next → 由指挥器决定下一步。

/ux-audit：6 个视角的设计审查

• 功能： 从六个视角（清晰度、层级、无障碍、语气、动效、审美）进行结构化且有明确立场的审查，并生成带严重性标签的问题。报告采用 Polaris 风格。首先读取 .ux/last-frame.json；每项问题的严重性都以受众和目标为依据。
• 适用场景： 界面已存在，且需要有理有据的评审。“审查”“评审 UX”“这个做得好吗”“有什么问题”“彻底批判一下”。
• 不适用场景： 界面尚未创建（使用 /ux-design）。用户只需要一个视角的审查（使用针对性命令：/ux-a11y、/ux-copy、/ux-motion、/ux-polish）。用户想听审美意见（使用 /ux-critique）。后端或基础设施。
• 调用方式： /ux-audit https://example.com/pricing 或 /ux-audit src/components/Pricing.tsx。
• 输出： 写入 .ux/last-audit.json，包含 findings 数组，元素格式为 {lens, severity, title, principle, evidence, fix}，以及 severity_counts、dominant_lens、strategic_moves。
• 后续命令： /ux-fix → 应用检查结果。/ux-polish → 进行外观优化。/ux-design → 需要结构性重新设计时使用。

/ux-a11y：WCAG 2.1 AA 审查 + 基本礼貌检查

• 功能： 进行结构化的 WCAG 2.1 AA 审查，并检查一些自动化工具虽能通过、却仍会给真实用户造成困扰的基本礼貌事项（焦点可见性、错误信息的具体程度、动效偏好、键盘陷阱、对颜色的依赖）。
• 适用场景： 发布前的无障碍门禁。重新设计之后。“无障碍检查”“WCAG 审查”“这个界面无障碍吗”“无障碍评审”“屏幕阅读器测试”“键盘导航检查”。
• 不适用场景： 非面向用户的内容。后端或基础设施。尚在进行中的草图。
• 调用方式： /ux-a11y https://example.com（优先使用在线 URL；自动化工具和键盘测试仅适用于在线页面）。
• 输出： 写入 .ux/last-a11y.json，包含 findings 数组，元素格式为 {wcag_sc, sc_name, severity, title, evidence, fix, category}，以及 beyond_wcag 数组、severity_counts。
• 后续命令： /ux-fix → 将检查结果作为提交应用。/ux-copy → 在文案处理过程中修复替代文本和表单错误关联。

/ux-critique：品味评判（3 个亮点、3 个不足、1 个战略性举措）

• **内容：**设计师的主观看法，不是结构化审查，也不是严重程度评分，只是简洁且有鲜明观点的评价，指出哪些地方做得好、哪些地方不尽如人意，以及最能带来改变的一项战略性举措。
• 适用场景：“你怎么看”“这个好吗”“评判一下这个”“说实话”“感觉对吗”“这符合我们的风格吗”“我们该发布这个吗”。
• **不适用场景：**用户明确要求结构化审查（使用 /ux-audit）。后端或基础设施。
• 调用方式：/ux-critique https://example.com。
• **输出：**写入 .ux/last-critique.json，包含 3 个亮点、3 个不足、1 项战略性举措，以及一段文字说明。
• **后续衔接：**如果评价建议重新设计，则转到 /ux-design。如果建议进一步打磨，则转到 /ux-polish。

/ux-copy：微文案审查与改写

• **内容：**根据语气规范评估所有可见文案，并提供改写前后的对照。可发现的问题包括：“表单包含错误”（泛泛而谈）、“John Doe”（占位内容）、AI 式欢快庆祝文案、泛化的 CTA、空洞的空状态、无用的错误提示。
• **适用场景：**结构正确，但文案不够好。“审查文案”“改进微文案”“错误消息写得不好”“重写这个”“精简这些字符串”“按钮文案太普通”“这个空状态很空洞”。
• **不适用场景：**布局问题（使用 /ux-audit 或 /ux-polish）。无障碍相关的文案问题，例如替代文本（使用 /ux-a11y）。后端或基础设施。
• 调用方式：/ux-copy src/views/checkout.blade.php。
• **输出：**写入 .ux/last-copy.json，包含 strings 数组，元素格式为 {location, severity, before, after, notes}，以及规范和需要翻译的区域设置。
• 后续衔接：/ux-fix → 应用改写。/ux-a11y → 文案修复后重新检查。

修复与打磨

/ux-fix：将发现的问题作为原子提交应用

• **内容：**读取 .ux/ 中最新的报告（审查、文案、无障碍、动效或打磨），验证工作树，然后通过合适的子 Agent 将发现的问题作为原子提交应用。通过重新运行源命令进行复核。
• **适用场景：**运行审查类命令并查看结果后。“修复发现的问题”“应用这些修复”“运行修复循环”“修补这个界面”“进行这些更改”“去修复它”。
• 不适用场景：.ux/ 中没有先前的报告。工作树有未提交的更改，且用户未同意暂存或提交。修复需要设计判断，而非机械地应用（重新设计请使用 /ux-design）。
• 调用方式：/ux-fix（自动检测要修复的报告）或 /ux-fix --from=last-a11y.json。
• **输出：**针对每个发现的问题创建原子提交。重新运行源命令并更新 .ux/last-*.json 文件。打印摘要。
• 后续衔接：/ux-next → 由协调器选择下一步。

/ux-polish：外观打磨 + 消除 AI 味

• **内容：**调整间距节奏、强化层级、检测 AI 味、确保令牌一致性。这是由大模型驱动的 /ux-lint 对应工具，会根据你的品味判断来处理审美问题。
• **适用场景：**结构正确，但执行不够完善。“打磨一下”“再精炼一些”“去掉 AI 味”“做得更有质感”“让它看起来不那么像 AI 做的”“间距感觉不对”“看起来很普通”“需要更有品味”。
• **不适用场景：**界面缺少核心功能（先解决这个问题）。需要重新设计，而非打磨（使用 /ux-design）。文案问题（使用 /ux-copy）。动效问题（使用 /ux-motion）。无障碍问题（使用 /ux-a11y）。
• 调用方式：/ux-polish src/components/Hero.tsx。
• **输出：**更新后的代码，以及说明改动内容的 .ux/last-polish.json。
• 后续衔接：/ux-lint → 验证打磨效果。/ux-a11y → 重新检查无障碍情况。

探索与叙事

/ux-frame：4 字段框定模块

• **作用：**在结构化框定模块中记录目标受众、预期成果、假设和成功指标。不会进行设计工作，只收集这 4 项信息，将模糊的需求转化为可执行的简报。比 /ux-discover 更轻量（4 个字段，而非 10 个）。
• **适用场景：**任何项目、冲刺或一次性合作的开始阶段。对话偏离主题时，可在进行中使用。“框定一下”“简报是什么”“启动项目”“框定”。
• **跳过场景：**已经完成框定（检查 .ux/last-frame.json）。不涉及框定问题的一次性组件构建。后端或基础设施工作。
• 调用方式：/ux-frame "loyalty wallet for MENA Northwind pilot"。
• **输出：**写入 .ux/last-frame.json，包含 {audience, outcome, hypothesis, success_signal}。
• 后续衔接：/ux-discover → 将框定内容扩展为包含 10 个字段的简报。/ux-design → 以框定内容为依据生成设计。

/ux-research：研究规划与综合分析

• **作用：**规划模式：编写访谈脚本、问卷和招募筛选问卷。综合分析模式（--synthesize）：整理访谈、分析数据、竞品网站、A/B 测试结果和支持工单，形成建议。分派 research-synthesizer。
• 适用场景：“规划一项研究”“我需要访谈问题”“设计一份问卷”“如何招募用户”“用户测试计划”“日记研究”“偏好测试”“假门测试”“冒烟测试”“综合分析我的访谈笔记”。
• **跳过场景：**已有高置信度的答案。低风险且可撤销的决策。后端或基础设施工作。
• 调用方式：/ux-research --plan "loyalty wallet adoption in MENA" 或 /ux-research --synthesize interviews/*.md。
• **输出：**写入 .ux/last-research.json，包含研究计划，或综合分析得出的主题、证据和建议。
• 后续衔接：/ux-frame → 将研究发现整合到框定内容中。/ux-design → 根据研究发现生成设计。/ux-workshop → 将研究结果作为输入来开展工作坊。

/ux-workshop：5 阶段设计思维工作坊

• **作用：**端到端主持探索／设计思维工作坊。依次开展 5 个阶段（探索 → 热点图 → 利益相关方地图 → 解决方案草图 → 行动计划）。每个阶段都有时间限制，并产出具体成果。最终以决策收尾，而不是只留下“有趣的发现”。
• **适用场景：**有真实问题、真实参与者和实际时间预算时。“开展工作坊”“主持一次探索活动”“来做一次设计思维活动”“我有利益相关方可以参加一小时，我们该做什么”“启动项目”。
• **跳过场景：**简报已经明确且范围清晰。个人头脑风暴（使用 /ux-design 或 /ux-frame）。团队已进入执行阶段，而非探索阶段。
• 调用方式：/ux-workshop "loyalty wallet pivot" --participants="2 PMs, 1 designer, 1 eng lead, 1 customer rep" --minutes=90。
• **输出：**写入 .ux/last-workshop.json，包含行动计划和各阶段成果。
• 后续衔接：/ux-design → 执行行动计划。/ux-research → 补足工作坊发现的空白。/ux-case-study → 发布历程。

/ux-case-study：可发布的案例研究（单色编辑风格）

• **内容：**以纯单色编辑风格、超宽编辑字体、纤细分隔线、编号为 (A)–(G) 的章节代码和兼容双语的版式，生成项目案例研究。这是一份文档，而非营销宣传册。读取 .ux/last-frame.json、.ux/last-workshop.json、.ux/last-research.json、.ux/last-design.json、.ux/last-a11y.json、.ux/last-polish.json、.ux/last-recommendation.json、.ux/last-discovery.json。
• **适用时机：**产品上线后。完成一个明确的里程碑后。“撰写案例研究”、“为这个项目写案例研究”、“完成项目总结文档”、“发布这项成果”、“作品集项目”。
• **跳过时机：**项目缺少填充 (A)–(G) 章节所需的数据。用户想要的是营销落地页，而非案例研究（使用 /ux-design）。
• 调用方式：/ux-case-study --format=html --slug=northwind-loyalty。
• 输出：case-studies/<slug>.<ext> + .ux/last-case-study.json。
• **后续：**终端命令，通常是项目的最后一步。

Conductor

/ux-next：工作流指挥器（只读）

• **内容：**读取所有 .ux/last-*.json，并指出影响力最大的下一条命令。它负责指挥，而非构建。只读。
• **适用时机：**在各条命令之间。“我接下来该做什么”、“下一步是什么”、“替我决定”、“接下来该怎么做”。
• 跳过时机：.ux/ 中没有先前的报告。你已经确定了下一条要执行的命令。
• 调用方式：/ux-next（不带参数）或 /ux-next --focus=a11y。
• **输出：**标准输出，包括推荐的下一条命令及其理由。
• **后续：**它选择的命令。

/ux-expert：咨询联系入口

• **内容：**当用户寻求现实中的 UX 专家时，提供插件创建者的联系方式。简短、直接，不带营销内容。
• 适用时机：“这是谁开发的”、“我需要 UX 专家”、“你们提供咨询服务吗”、“我能请人来做这件事吗”、“这个插件背后有人吗”。
• **跳过时机：**用户询问的是插件功能，而非咨询服务。
• 调用方式：/ux-expert。
• **输出：**简短的联系方式卡片，包含 LinkedIn / 邮箱 / 仓库。

命令链路图

                  ┌──────────────────────┐
                  │  /ux-init            │
                  │  /ux-stats           │
                  └────────────┬─────────┘
                               │
                  ┌────────────▼─────────┐
                  │  /ux-frame           │  4-field framing block
                  └────────────┬─────────┘
                               │
                  ┌────────────▼─────────┐
                  │  /ux-discover        │  10-field intake (FORCING GATE)
                  └────────────┬─────────┘
                               │ writes .ux/last-discovery.json
                  ┌────────────▼─────────┐
                  │  /ux-recommend       │  5 parallel searches -> merged system
                  └────────────┬─────────┘
                               │ writes .ux/last-recommendation.json
            ┌──────────────────┼──────────────────┐
            │                  │                  │
   ┌────────▼───────┐ ┌────────▼────────┐ ┌──────▼──────┐
   │ /ux-design     │ │ /ux-component   │ │ /ux-system  │
   │ /ux-dashboard  │ │ /ux-motion      │ │             │
   └────────┬───────┘ └────────┬────────┘ └──────┬──────┘
            │                  │                  │
            └──────────────────┼──────────────────┘
                               │ writes .ux/last-<surface>.json
            ┌──────────────────┼──────────────────┐
            │                  │                  │
   ┌────────▼───────┐ ┌────────▼────────┐ ┌──────▼──────┐
   │ /ux-lint       │ │ /ux-audit       │ │ /ux-a11y    │
   │ /ux-critique   │ │ /ux-copy        │ │ /ux-motion  │
   └────────┬───────┘ └────────┬────────┘ └──────┬──────┘
            │                  │                  │
            └──────────────────┼──────────────────┘
                               │ writes .ux/last-<lens>.json
                  ┌────────────▼─────────┐
                  │  /ux-fix             │  apply findings as commits
                  │  /ux-polish          │
                  └────────────┬─────────┘
                               │
                  ┌────────────▼─────────┐
                  │  /ux-case-study      │  publishable artifact
                  └──────────────────────┘

                  ┌──────────────────────┐
                  │  /ux-next            │  conductor, read-only
                  │  /ux-expert          │  consulting hook
                  └──────────────────────┘

---

5 个子 Agent

子 Agent 是由命令调度的特定角色生成器。它们不会独立运行，而是由 /ux-design、/ux-component、/ux-system、/ux-fix、/ux-research 等命令调用。每个 Agent 都有明确的职责边界：它们不会决定需求，而是根据需求执行任务。

frontend-engineer

• **负责：**生产级前端代码（React、Next.js、Vue、Blade+Alpine、原生 HTML、Astro），并遵循反 AI 廉价感准则。
• 由以下命令调度：/ux-design、/ux-component、/ux-dashboard、/ux-fix。
• **输入：**需求 + 创意方向 + 设计令牌（来自 .ux/last-recommendation.json）。
• **输出：**能够与通用 AI 输出区分开来的可运行代码。不要使用紫色渐变、居中主视觉区、三张等宽卡片、用作展示字体的 Inter、“John Doe”、表情符号或默认的 300ms 时长。
• 工具：Read, Write, Edit, Bash, Glob, Grep。

motion-engineer

• **负责：**生产级前端代码中的动效，包括 Framer Motion、GSAP、CSS 动画，以及时长、缓动、编排、减少动态效果的回退方案和性能规范。
• 由以下命令调度：/ux-design、/ux-motion --fix、/ux-component。
• **输入：**动效需求 + 设计令牌 + data/motion-presets.json 中的 57 个动效预设。
• **输出：**让动效发挥其价值。始终包含 prefers-reduced-motion 回退方案。始终依据 Core Web Vitals 进行测试。
• 工具：Read, Write, Edit, Bash, Glob, Grep。

copy-writer

• 负责： 随产品发布的字符串、错误消息、空状态、CTA、加载状态、成功消息、Toast、辅助文本、表单标签和按钮文本。
• 由以下命令调度： /ux-copy --fix、/ux-design、/ux-frame、/ux-component。
• 输入： 语气风格档案（指定名称或粘贴内容）+ 界面中的字符串。
• 输出： 在界面的所有状态中一致应用的生产级微文案，让产品听起来像一个完整的产品，而不是十个产品。禁止使用：「表单包含错误」「John Doe」、带有 AI 式欢快庆祝意味的文案、泛泛的 CTA、毫无内容的空状态。
• 工具： Read, Write, Edit, Bash, Glob, Grep。

research-synthesizer

• 负责： 将研究输入（访谈、分析数据、竞品网站、A/B 测试结果、支持工单）提炼为可执行的设计建议。
• 由以下命令调度： /ux-research、/ux-workshop、/ux-frame。
• 输入： 原始研究资料、转录文本、导出文件、竞品 URL、支持工单分类。
• 输出： 主题、证据、建议。绝不直接设计解决方案，而是为设计师提供设计依据。
• 工具： Read, Write, WebFetch, Bash, Glob, Grep。

design-system-architect

• 负责： 完整的设计系统、设计令牌（颜色、字体、间距、动效、圆角、阴影）、基础文档、组件契约、深色模式配对和主题层。
• 由以下命令调度： /ux-system；当不存在设计系统时，由 /ux-component 调度。
• 输入： 品牌简介 + .ux/last-recommendation.json（风格 + 配色 + 字体组合 + 动效预设）。
• 输出： 连贯、具有明确主张且可用于生产的系统，下游 Agent 无需重新决定基础规范即可据此构建。包括令牌 JSON、基础规范 MD、组件契约和深色模式映射。
• 工具： Read, Write, Edit, Bash, Glob, Grep。

子 Agent 调度协议

当命令调度子 Agent 时，会传递：

1. 简介 / 建议（从 .ux/ 加载）。
2. 相关的清单片段（例如，frontend-engineer 会获取选定的风格 + 配色 + 组件；motion-engineer 会获取选定的动效预设）。
3. 152 条反模式防护规则（始终启用）。
4. 成功标准（产物必须实现的目标）。

子 Agent 返回：

1. 产物（代码、文档、系统）。
2. 理由说明（选择这些方案的原因）。
3. 根据防护规则进行的自检（已核验的规则）。

随后，调用命令会自动运行 /ux-lint，再宣布完成。

---

11 个数据清单

数据层是核心。每个命令都会读取数据层；引擎会合并其中的数据；检查器会依据这些数据进行扫描。所有文件都位于 data/ 下，并使用 {_meta, entries} 包装条目，以支持架构版本管理。

styles.json：84 种设计风格

字段	描述
entries	84
keys per entry	id、name、category、philosophy、when_to_use、when_to_skip、tokens、references、compatible_palettes、compatible_type_pairs、compatible_motion、compatible_industries、taste_score
categories	极简 / 瑞士风格、粗野主义、编辑风格、玻璃拟态、新拟态、Bento、拟物风格、工业风、极繁主义、AI 未来主义、中东北非现代风格、蒸汽波等
sample entry	swiss-international，「网格就是法则。字体承担主要表现力。装饰即失败。」

用于：/ux-recommend、/ux-system、/ux-design。架构：data/SCHEMAS.md。

palettes.json：176 种配色方案

字段	描述
entries	176
keys per entry	id、name、mode（浅色/深色）、tone、colors（画布、表面、墨色、正文、弱化、主色、主色激活态、分隔线、成功、警告、危险、强调色）、wcag_contrast_audit、compatible_industries
tones	温暖、编辑风、杂志风、临床风、活泼、粗野主义、单色、宝石色调、中东北非温暖风、开发工具深色风等
sample entry	claude-warm-editorial，浅色，温暖/编辑风/杂志风，画布 #faf9f5，主色 #cc785c

用于：/ux-recommend、/ux-system。对比度已通过 AA / AAA 验证。架构：data/SCHEMAS.md。

type-pairs.json：70 组字体搭配

字段	描述
entries	70
keys per entry	id、name、display（字体系列 + 字重 + 来源 + 许可证 + URL）、body、mono、compatible_styles、taste_score
sample entry	cormorant-inter-jetbrains，Cormorant Garamond × Inter × JetBrains Mono

所有字体系列均包含许可证和来源 URL。用于：/ux-recommend、/ux-system。

components.json：148 个组件

字段	描述
entries	148
keys per entry	id、name、category、purpose、anatomy、states、tokens_used、motion、accessibility、compatible_styles、compatible_industries、code_skeleton
categories	导航、表单、数据展示、反馈、浮层、布局、内容、营销、电子商务、身份验证、仪表盘、图表、空状态、加载状态、错误状态
sample entry	mega-nav-product-grid，大型导航、产品网格、6 部分结构、4 种状态

这是我们最大的竞争壁垒。其他 Claude UX 插件都没有提供结构化的组件清单。

industries.json：184 条行业规则

字段	描述
entries	184
keys per entry	id、name、category、characteristics、audience_signals、recommended_styles、recommended_palettes、recommended_type_pairs、recommended_motion、regulatory_notes、regional_notes
categories	金融服务、医疗保健、教育、电子商务、SaaS B2B、SaaS B2C、开发者工具、媒体、游戏、旅游、房地产、中东北非地区专属等
sample entry	fintech-neobank，高信任度、监管披露、余额/交易为主要 UI、移动优先的日常使用场景

用于 /ux-recommend，作为首个并行搜索维度。

chart-types.json：35 种图表类型

字段	描述
entries	35
keys per entry	id、name、category、when_to_use、when_to_skip、encoding、accessibility、data_shape、compatible_styles
categories	对比、时间序列、分布、构成、关系、流向、地理
sample entry	bar-vertical，比较 4–15 个离散类别。x 轴上的位置映射类别；高度映射数值。

用于 /ux-dashboard、/ux-component（图表实例）。

tech-stacks.json：25 种技术栈

字段	描述
entries	25
keys per entry	id、name、category、tier、languages、ssr、rsc、compatible_styling、scaffold_command、compatible_motion、gotchas
tiers	生产级、预发布、实验性
sample entry	nextjs-15-app-router，Next.js 15（App Router）、TS/JS、SSR、RSC，兼容 Tailwind 4 / CSS Modules / vanilla-extract / styled-components / panda-css

其他技术栈包括 Astro、SvelteKit、Remix、Nuxt 3、Solid Start、Qwik、Blade+Alpine、Hotwire、Phoenix LiveView、Hydrogen 2025。

ux-guidelines.json：112 条具名 UX 定律

字段	描述
entries	112
keys per entry	id、name、category、source、principle、application、examples、caveats、related_laws
categories	决策成本、注意力、记忆、动作控制、视觉感知、社交、情绪、形式、错误处理、引导入门、空状态等
sample entry	hicks-law，选择数量越多，决策时间的增长越接近对数关系

由 /ux-audit（6 维评分）和 /ux-critique（品味锚点）使用。

motion-presets.json：57 个动效预设

字段	描述
entries	57
keys per entry	id、name、category、tokens（duration_ms、easing、transform_from/to、opacity_from/to）、stacks（framer_motion、gsap、css）、accessibility（减少动态效果时的回退方案）、when_to_use
categories	进入、退出、悬停、聚焦、轻触、加载、空状态、成功、错误、滚动关联
sample entry	fade-up-12px、360ms、cubic-bezier(0.16, 1, 0.3, 1)、translateY(12px) → 0、opacity 0 → 1

每个预设都有减少动态效果的变体。提供可直接用于 Framer Motion、GSAP 和纯 CSS 的代码。

anti-patterns.json：152 条正则规则

字段	描述
entries	145
keys per entry	id、name、severity（critical/high/medium/low）、category、detection（type、pattern、flags、scope）、evidence_template、fix、references
categories	无障碍（23）、内容（15）、布局（13）、排版（10）、颜色（9）、质量（9）、视觉（9）、动效（8）、性能（4）

完整规则列表见152 条反 AI 套话规则。

brands/*.json：160 份品牌规范

字段	描述
entries	160（另有列出全部条目的 _index.json）
keys per entry	id、name、category、voice、tokens（颜色、字体、动效）、design_principles、signature_moves、anti-moves、references
categories	开发者工具（36）、消费品／生活方式／零售（19）、金融科技／加密货币（14）、出版／媒体（13）、AI／机器学习平台（12）、生产力／协作（8）、汽车（8）

完整列表见按类别划分的 160 份品牌 DESIGN.md 规范。

---

152 条反 AI 套话规则：代码检查器

ux-skill 自带一个基于正则表达式的确定性代码检查器。不使用大模型。 不调用 API。 不联网。 在 CI 中检查一个典型的 Next.js 应用约需 200ms。设置 --fail-on high 后，发现严重或高等级问题时会以非零状态码退出。

规则来源为 data/anti-patterns.json（优先使用 v2），并在其不可用时回退到 references/foundations/anti-patterns.md（v1 bash）。提供两种可执行文件：bin/ux-lint.py（Python，速度快且易于扩展）和 bin/ux-lint.sh（Bash + perl-PCRE，适用于没有 Python 的环境）。

按类别列出的规则

排版（3 条规则）

严重程度	规则 ID	名称
high	inter-as-display	将 Inter 用作展示字体
medium	hero-text-arbitrary-90px	Hero 区域使用任意字体大小
low	font-system-only	仅使用系统字体栈，没有选择指定字体

颜色（6 条规则）

严重程度	规则 ID	名称
high	purple-to-blue-gradient	默认的紫蓝 AI 渐变
high	dark-text-on-dark-card	卡片上的文本对比度低
medium	gradient-text-rainbow	多色阶渐变文本
medium	card-glow-purple-shadow	卡片上的紫色辉光阴影
medium	gradient-mesh-purple-pink	紫粉色网格渐变 Hero 区域
low	tailwind-color-named-vague	使用没有语义化令牌的 Tailwind 命名颜色

布局（5 条规则）

严重程度	规则 ID	名称
high	three-equal-card-grid	一行三个等宽卡片
medium	centered-everything-hero	居中的 Hero 构图
medium	avatar-stack-overlapping	通用重叠头像堆叠
low	pill-rounded-full-everywhere	对所有元素应用 rounded-full
low	nav-equal-hamburger-desktop	桌面端汉堡菜单

内容（5 条规则）

严重程度	规则 ID	名称
high	lorem-ipsum-leak	正式发布代码中残留 Lorem ipsum
high	emoji-in-ui	使用表情符号作为 UI 元素
high	icon-emoji-stamp	使用表情符号作为图标印章
high	testimonial-fake-five-stars	硬编码五星评价
medium	fake-name-john-doe	通用占位姓名

动效（3 条规则）

严重程度	规则 ID	名称
medium	cta-arrow-rightward-bouncing	CTA 上的弹跳箭头
low	timing-300ms-default	默认 300ms 过渡时长
low	cubic-bezier-material-only	到处使用 Material 默认缓动

A11y（6 条规则）

严重程度	规则 ID	名称
high	inline-svg-no-aria	SVG 缺少 aria-label 或 aria-hidden
high	img-no-alt	图片缺少 alt 属性
high	link-onclick-no-href	带有 onClick 但没有 href 的锚点
medium	button-no-type	按钮缺少 type 属性
medium	heading-skip-h1-h3	跳过标题级别
medium	infinite-scroll-no-pagination	无限滚动缺少键盘备用方案

质量（6 条规则）

严重程度	规则 ID	名称
high	console-log-leak	组件代码中存在 console.log
medium	inline-style-attribute	内联 style 属性
medium	any-type-leak	TypeScript any 类型
medium	arbitrary-z-index-9999	随意设置的 z-index 值
low	shadcn-default-everywhere	未修改的默认 shadcn 令牌块
low	todo-fixme-comment	正式发布代码中存在 TODO 或 FIXME

视觉（1 条规则）

严重程度	规则 ID	名称
low	blur-bg-only-decoration	使用背景模糊装饰，但没有玻璃质感表面

Linter 用法

单次扫描：

uxskill lint .
# or
python3 bin/ux-lint.py src/
# or
bash bin/ux-lint.sh src/

CI 门禁（GitHub Actions）：

- name: ux-lint
  run: bash bin/ux-lint.sh --ci --fail-on high

提交前钩子：

# .git/hooks/pre-commit
#!/usr/bin/env bash
bash bin/ux-lint.sh --staged --fail-on high

输出（示例）：

─── /ux-lint report ───
src/components/Hero.tsx:24  [high]   purple-to-blue-gradient
  evidence: bg-gradient-to-br from-purple-500 to-blue-500
  fix: replace with the recommended palette's primary gradient or remove gradient

src/components/Pricing.tsx:11  [high] three-equal-card-grid
  evidence: grid grid-cols-3 gap-6 (3 equal Card children)
  fix: feature one card; flank with two reduced-emphasis cards

3 files scanned · 2 high · 0 medium · 0 low · exit 1
Recommended next: /ux-polish --fix (LLM-driven, addresses both lintable and aesthetic findings)

---

按类别划分的 160 个品牌 DESIGN.md 规范

真实品牌。真实设计语言。真实的 DESIGN.md 规范，而非通用配色方案。告诉插件“以 Stripe 的风格构建一个落地页”，它就会读取品牌实际使用的词汇：语气规范、颜色令牌、动效惯例、标志性手法和应避免的做法。

每个品牌都以结构化 JSON（data/brands/<slug>.json）和文字参考文档（references/brands/<slug>.md）的形式提供。

开发者工具（36）

ClickHouse、Composio、Cursor、Datadog、dbt Labs、Expo、Fivetran、Fly.io、Framer、HashiCorp、Honeycomb、IBM、Lovable、Mintlify、Modal、MongoDB、Neon、Ollama、OpenCode、PostHog、Railway、Raycast、Render、Replicate、Resend、Retool、Sanity、Sentry、Slack、Snowflake、Sourcegraph、Supabase、Superhuman、Vercel、Warp、Webflow

消费 / 生活方式 / 零售（19）

Aesop、Airbnb、Allbirds、Apple、Apple Music、Glossier、HP、Hims & Hers、Instagram、Meta、Nike、Patagonia、Pinterest、PlayStation、Shopify、Spotify、Starbucks、TikTok、Uber

金融科技 / 加密货币（14）

Binance、Brex、Coinbase、Kraken、Mastercard、Mercury、Monzo、N26、Plaid、Ramp、Revolut、Robinhood、Stripe、Wise

出版 / 媒体（13）

Bloomberg、Clay、Dezeen、NVIDIA、Pitchfork、Substack、The Atlantic、The Economist、The New York Times、The Verge、The Wall Street Journal、Vodafone、Wired

AI / ML 平台（12）

Anthropic、Claude、Cohere、ElevenLabs、MiniMax、Mistral AI、OpenAI、Perplexity、Runway、Together AI、VoltAgent、xAI

效率 / 协作（8）

Airtable、Cal.com、Figma、Intercom、Linear、Miro、Notion、Zapier

汽车（8）

BMW、BMW M、Bugatti、Ferrari、Lamborghini、Renault、SpaceX、Tesla

这为何重要

另外 8 款热门 Claude UX 插件生成的都是“现代极简”或“简洁仪表盘”，只是同一种默认美学的不同变体。ux-skill 让你可以指定 Linear 的清晰感、Stripe 的严谨感、Apple 的克制感、Tesla 的整体感、Notion 的亲和力、Cursor 的渐变秩序、Raycast 的纤细密集感、Claude 的温暖编辑风格，引擎便会从品牌规范中提取合适的设计令牌、语调、动效惯例和标志性设计手法。

---

MCP 服务：非对称优势

ux-skill 内置 Model Context Protocol 服务。运行 ux-mcp 后，引擎会成为一个长期运行的 stdio 进程，任何支持 MCP 的宿主都可以调用它，包括 Claude Desktop、Cursor、Windsurf 和通用 Agent。它提供 18 种工具：ux_recommend、ux_lint、ux_styles、ux_palettes、ux_type_pairs、ux_components、ux_industries、ux_motion_presets、ux_anti_patterns、ux_brands、ux_landing_patterns、ux_persist_save、ux_persist_load、ux_stats、ux_image_extract、ux_synthesize、ux_decisions_query、ux_decisions_stats。这些工具使用与斜杠命令相同的 Python 处理程序、相同的数据清单和相同的确定性推荐器。

**为何这是非对称优势：**排名前 8 的 Claude UX 技能（ui-ux-pro-max-skill、open-design、taste-skill、huashu-design、stitch、nothing-design、hallmark、material-3）都没有内置 MCP 服务。它们被限制在 Claude Code 的插件运行时中。ux-skill 可供任何支持 MCP 的宿主使用，包括从未听说过 Claude Code 插件的 Agent。

pip install 'uxskill[mcp]'             # mcp is an opt-in extra
ux-mcp                                  # stdio JSON-RPC server starts

将客户端指向 ux-mcp 可执行文件。完整的工具文档、JSON 示例，以及 Claude Desktop、Cursor 和 Windsurf 的客户端配置，见 docs/mcp.html 和 commands/ux-mcp.md。

---

适用于 17 种 IDE 的安装程序

uxskill init（或在 Claude Code 中运行 /ux-init）会自动检测你正在使用的 IDE，并写入相应的文件。使用相同的 Python 引擎，生成相同的建议，但针对不同的 IDE 使用不同的适配方式。

IDE / 工具	检测信号	安装文件
Claude Code	.claude/ 或 CLAUDE.md	位于 .claude-plugin/plugin.json 的插件清单 + 全部 25 个命令 + 全部 5 个子 Agent
Cursor	.cursor/ 或 .cursorrules	.cursorrules 提示词头，指向引擎
Windsurf	.windsurf/ 或 .windsurfrules	带有相同提示词头的 .windsurfrules
GitHub Copilot	.github/copilot-instructions.md 或 .vscode/	.github/copilot-instructions.md
Gemini CLI	GEMINI.md	GEMINI.md
Codex	AGENTS.md	AGENTS.md
Kiro	.kiro/	.kiro/instructions.md
Cline	.cline/	.cline/instructions.md
Continue	.continue/	.continue/config.json 补丁
Aider	.aider.conf.yml	.aider.conf.yml + AIDER.md
Zed	.zed/	.zed/instructions.md
JetBrains AI	.jetbrains-ai/ 或 .idea/	.jetbrains-ai/instructions.md
Pieces	.pieces/	.pieces/instructions.md
Tabby	.tabby/	.tabby/instructions.md
Tabnine	.tabnine/	.tabnine/instructions.md
CodeWhisperer	.aws-codewhisperer/	.aws-codewhisperer/instructions.md
Roo Cline	.roo/	.roo/instructions.md

在每种 IDE 中，都可以在终端运行相同的 uxskill recommend / uxskill lint / uxskill stats CLI 命令。Python 引擎是唯一可信来源；IDE 文件只是轻量级提示词头，用于将请求路由到引擎。

---

使用场景：具体示例

以下是 8 个真实场景。选择最接近你情况的一个，并调整调用方式。

1. 在 Cursor 中构建金融科技仪表盘

你正在 Cursor 中开发一个面向 MENA 市场的新型数字银行仪表盘。安装插件后，依次运行发现、推荐，然后生成仪表盘。

pip install uxskill
uxskill init                                # detects Cursor, writes .cursorrules
uxskill discover                            # 10-field intake
uxskill recommend \
  --project-type=dashboard \
  --industry=fintech-neobank \
  --tone=clinical --tone=precise \
  --must-have=dark-mode --must-have=a11y-AA --must-have=RTL \
  --forbidden=brutalism --forbidden=purple-gradients \
  --stack=nextjs-15-app-router \
  --region=mena

接着在 Cursor 中询问：“根据 .ux/last-recommendation.json 中的建议生成仪表盘界面”。Cursor 会读取 .cursorrules 头部，加载建议，并在明确的约束条件下启动仪表盘生成。

2. 在 Claude Code 中生成 Stripe 风格的落地页

/plugin marketplace add Laith0003/ux-skill
/plugin install ux@ux-skill
/ux-discover
> Project type? landing
> Industry? fintech-payments
> Tone? serious, technical, confident
> Must have? dark-mode, AA, mobile-first
> Forbidden? purple-gradients, three-equal-cards
> Reference brands? stripe
> Stack? nextjs-15-app-router
> Region? global
> Success metric? signup conversion

/ux-recommend
> [returns picked style, palette, type pair, motion presets, components, brand exemplars]

/ux-design "generate the landing using the Stripe brand spec as exemplar"
> [frontend-engineer generates the page]

/ux-lint .
> [passes, Stripe brand spec was respected]

3. 在 CI 中审查现有代码是否存在 AI 痕迹

你在两周前发布了一个 Next.js 应用。你希望为每个 PR 设置一道严格的防线，杜绝 AI 痕迹。

# .github/workflows/ux-lint.yml
name: ux-lint
on: [pull_request]
jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-python@v5
        with: { python-version: '3.11' }
      - run: pip install uxskill
      - run: uxskill lint . --ci --fail-on high

如果 PR 引入紫到蓝的渐变、96px 的 Inter 字体、“John Doe” 推荐语或表情符号图标，CI 就会失败。无需 LLM 成本，耗时约 200ms。

4. 打磨一个“看起来像 AI 生成的”现有界面

你接手了一个 React 应用，看起来和其他 AI 生成的 SaaS 网站如出一辙。你想改变这种观感。

/ux-critique src/components/Hero.tsx
> [3 wins, 3 misses, 1 strategic move, the take is honest]

/ux-lint src/
> [15 high-severity AI fingerprints flagged]

/ux-polish src/components/Hero.tsx
> [LLM-driven cosmetic pass + AI-slop kill]

/ux-fix
> [applies findings as atomic commits, re-runs the linter]

三个命令，打磨出一个精致的界面，每项修复都单独提交。

5. 设计 Linear 风格的命令面板

/ux-component command-palette --brief="Linear-style, dark, monospace shortcuts, recent items first"
> [reads data/brands/linear.app.json for tokens + signature moves]
> [reads data/components.json for the command-palette anatomy + states]
> [dispatches frontend-engineer with explicit Linear spec]

生成的组件使用 Linear 的实际颜色令牌、字体栈、动效规范和细线密度，而不是“泛泛的深色 UI”。

6. 与利益相关者开展 90 分钟的设计思维工作坊

你有 5 个人，可以用 90 分钟。你希望他们离开时带着行动计划，而不只是一些想法。

/ux-workshop "loyalty wallet pivot" \
  --participants="2 PMs, 1 designer, 1 eng lead, 1 customer rep" \
  --minutes=90

该插件端到端引导五个阶段（探索 → 热力图 → 利益相关者地图 → 解决方案草图 → 行动计划），为各阶段设定时间限制，并产出具体成果。输出文件是 .ux/last-workshop.json，内容是行动计划，而不只是“有趣的发现”。

7. 在发布后撰写可发表的案例研究

你发布了忠诚度钱包。现在想把它整理成作品集项目。

/ux-case-study --format=html --slug=northwind-loyalty
> [reads .ux/last-frame.json, last-workshop.json, last-research.json, last-design.json, last-a11y.json, last-polish.json, last-recommendation.json, last-discovery.json]
> [generates monochrome editorial case study with numbered (A)-(G) sections, hairline separators, bilingual-safe layout]
> [writes case-studies/northwind-loyalty.html]

案例研究是可直接发表的完整成品，而非草稿。纯单色设计、编辑风格排版，可直接放入作品集。

8. 在非 AI 场景中开展探索（仅进行结构化信息收集）

你正在界定项目范围。目前不需要建议，而是需要一份结构化简报。

uxskill discover
# 10-field intake, saves to .ux/last-discovery.json

cat .ux/last-discovery.json
# {
#   "project_type": "...",
#   "audience": "...",
#   ...
# }

你可以将 JSON 交给团队、粘贴到 Notion 文档中，或输入其他 AI 工具。ux-skill 除了作为引擎，也是一款结构化信息收集工具。

9. MASTER.md 持久化：将设计决策保存在代码库中

运行 /ux-recommend 后，将选定的风格、配色、字体、动效、组件、品牌范例和约束规则保存为易读的 Markdown 文件，供团队审阅、比较差异并进行版本控制。

python3 -m engine.cli.main persist save --project-root .

通过 persist save-page 写入 .ux/design-system/MASTER.md（包含 YAML frontmatter 和正文），并为每个生成的界面写入 .ux/design-system/pages/<name>.md。操作具有幂等性，相同输入会生成字节完全相同的输出，因此在状态未变时重新运行不会产生 git 变更。

---

与替代方案对比

简要对比表。逐项详细对比请见 uxskill.laithjunaidy.com/compare.html。

维度	ux-skill	ui-ux-pro-max	open-design	taste-skill	huashu-design	stitch-skills	nothing-design	hallmark	material-3
斜杠命令	22	1	19	1	1	多个	1	1	1
组件	148	0	0	0	0	0	0	0	(MD3)
动效预设	57	0	0	0	0	0	0	0	0
品牌规范	160	0	0	0	0	0	0	0	0
反模式规则	145	0	0	0	0	0	0	0	0
适用于 CI 的确定性代码检查器	是	否	否	否	否	否	否	否	否
支持的 IDE	17	18	1	1	1	1	1	1	1
探索门槛	10 个字段	隐式	隐式	隐式	隐式	隐式	隐式	隐式	隐式
.ux/ 状态链	是	否	否	否	否	否	否	否	否
星标数（2026-05-28）	14	83,958	54,406	25,202	15,455	5,762	2,391	2,164	955

诚实评估

• ui-ux-pro-max 的知名度更高，支持 18 款 IDE，并通过其 CSV 提供 BM25 风格的搜索。它没有组件清单、动效清单、品牌库或确定性代码检查器。
• open-design 提供 19 个技能和预览功能，但仅支持 Claude Code，且没有反劣质设计层。
• hallmark 在理念上最接近（同样反劣质设计），但它只是一个技能，没有引擎、清单或链式命令。
• 如果你专门需要 Material Design 3，material-3-skill 非常出色。我们不与 MD3 竞争。

如需了解各个维度的完整详情，请参阅 compare.html。

---

路线图

v2.1：代码检查器完善（Q3 2026）

• 新增 17 条延后实现的反模式规则，总数达到 52 条。目标包括：深色背景上的悬停状态、仅用颜色编码状态、冗余的 z-index 递增、JS 中硬编码断点、用不透明度代替禁用状态等。
• uxskill lint --fix 支持安全重写，修复可通过机械方式处理的问题（button-no-type、空字符串 img-no-alt、移除 console-log 泄露）。
• VS Code 扩展，可直接在代码中显示检查结果（无需运行 CI）。

v2.2：扩展组件清单（Q4 2026）

• 新增 50 个组件，总数达到 198 个。新增组件包括：支持异步筛选的组合框、采用最近使用项启发式的命令面板、条件表单步骤、支付元素变体、适配 RTL 的日期选择器、MENA 专用电话号码输入框、带回历叠加层的日历网格。
• 支持 6 种技术栈的按组件代码生成（Next.js + React、Vue 3 + Nuxt、SvelteKit、Astro、Blade + Alpine、原生 HTML/CSS）。
• 组件 Playground，地址为 uxskill.laithjunaidy.com/playground，可试用推荐引擎并查看组件实时预览。

v3：市场与锁定效应（2027）

• 品牌规范市场：发布和发现社区品牌规范。通过付费发布为审核工作提供资金。
• 自定义反模式规则：项目可以在 data/anti-patterns.local.json 中定义自己的正则规则（已在 v2 中推出；v3 将增加发现和分享功能）。
• uxskill plan：根据简报规划完整的多页面网站，而不只是单个界面。
• Figma 插件功能对等：提供相同的推荐引擎，并在 Figma 中呈现。

---

参与贡献

欢迎提交问题和 PR。以下三个方向影响力最大：

添加反模式规则

1. 编辑 data/anti-patterns.json，添加一条包含 id、name、severity、category、detection.pattern、detection.flags、detection.scope、evidence_template、fix、references 的记录。
2. 在 tests/linter/ 中添加测试：一个触发规则的文件，以及一个不触发规则的文件。
3. 运行 uxskill lint tests/linter/should-trigger/<rule>.tsx，确认规则触发。再对 tests/linter/should-not-trigger/<rule>.tsx 运行检查，确认规则不会触发。
4. 提交 PR。

添加品牌规范

1. 创建 data/brands/<slug>.json，包含 id、name、category、voice、tokens、design_principles、signature_moves、anti-moves、references。
2. 在 references/brands/<slug>.md 中添加相应的文字说明。
3. 在 data/brands/_index.json 中注册。
4. 提交 PR。规范必须有一手来源作为依据（品牌的实际产品、公开设计系统，或品牌公开发布的 DESIGN.md）。

添加动效预设

1. 编辑 data/motion-presets.json，添加一条包含 id、name、category、tokens、stacks（framer_motion、gsap、css）、accessibility.reduced_motion_fallback、when_to_use 的记录。
2. 预设必须提供减少动态效果的变体，不设例外。
3. 提交 PR。

流程

• 阅读 CONTRIBUTING.md 了解完整流程。
• 阅读 CODE_OF_CONDUCT.md。
• 新规则和品牌规范的审核标准包括：以一手来源为依据、不针对单个项目过度拟合、数据中不含表情符号，以及在适用时确保行为兼容 RTL。

---

许可证、作者与致谢

许可证

MIT。尽管使用、分叉并在此基础上构建。如果它帮你避免发布 AI 劣质设计，请给仓库点个星，这是支持它最省事的方式。

作者

Laith Aljunaidy：Dot 的独立创始人。Dot 是一个以 MENA 为先的忠诚度平台。打造 ux-skill，让 AI 生成的前端不再千篇一律。

• LinkedIn：linkedin.com/in/laithaljunaidy
• 电子邮件：[email protected]
• 仓库：github.com/Laith0003/ux-skill
• 网站：uxskill.laithjunaidy.com
• PyPI：pypi.org/project/uxskill
• npm：npmjs.com/package/uxskill

致谢

• 感谢 Anthropic 团队打造 Claude Code 以及技能 / 插件架构，让这一工具得以分发。
• 感谢 Nielsen Norman Group、Laws of UX（lawsofux.com）以及 UX 研究社区，他们的研究成果为 data/ux-guidelines.json 提供了参考。
• 感谢 data/brands/ 中列出的所有品牌；它们公开的设计系统是品牌规范的权威依据。
• 感谢 v1 的贡献者：一个单次运行的 Claude 技能，成为了 v2 Python 引擎的雏形。
• 感谢我们对比过的 8 款热门 Claude UX 插件，它们树立了更高的标准；这是我们的回应。

---

ux-skill · v3.0.0-stable · 专为 Claude Code、Cursor、Windsurf 及其他所有 AI 编码工具打造，让它们输出的前端看起来不像 AI 生成的。

在 github.com/Laith0003/ux-skill 为仓库点个 Star · 通过 pip install uxskill 或 npx uxskill init 安装 · 在 uxskill.laithjunaidy.com/compare.html 查看对比