上图：左侧是"标准 AI 网页"，右侧是应用 UI/UX Pro Max 后的效果。差距不在代码质量，在设计决策。
为什么 AI 生成的网页总感觉"差点意思"？
用 AI 生成一个落地页，速度很快。但打开一看——
- Hero 区用了 emoji 代替图标（🚀✨💡）
- 按钮是五彩渐变，背景是另一个渐变
- 字体随机，有时候 H1 用了衬线体，正文又换成了等宽体
- 颜色对比度不达标，文字在背景上根本看不清
- 间距完全没有节奏，有些地方挤，有些地方又空得尴尬
这不是 AI 的错，是提示词缺少设计意图的必然结果。AI 没有品味，它只会平均——平均所有它见过的网页，结果就是平庸。
解决方法不是换模型，而是给 AI 一个明确的设计语言系统。
UI/UX Pro Max 是什么
UI/UX Pro Max 是一个开源的 AI Skill，本质上是一套结构化的设计决策框架，告诉 AI 在生成网页时该用什么风格、什么颜色、什么字体。
它包含三个维度：
| 维度 | 数量 | 代表风格 |
|---|---|---|
| 设计风格 | 67 种 | Swiss Minimalism、Bauhaus、Cyberpunk、Memphis、Brutalism、Art Deco… |
| 调色板 | 96 套 | 每套含主色、辅色、背景、文字、强调色，均通过 WCAG AA/AAA 验证 |
| 字体搭配 | 57 对 | 标题 + 正文的搭配组合，均来自 Google Fonts 可商用字体 |
这些不是随机堆砌的选项，每一个组合都有其设计理论依据——比例、对比、节奏、层次。
实战演示：Swiss Minimalism 风格
以 Swiss Minimalism（瑞士简约主义）为例，这是 20 世纪中期源于苏黎世的设计运动，至今仍是科技产品设计的主流基调：
- 色彩：白底 + 单一强调色（深海军蓝 / 正红 / 纯黑），绝不使用渐变
- 字体：Helvetica / Plus Jakarta Sans，字重用来建立视觉层次
- 间距：严格 8px 网格，留白面积≥内容面积
- 图标：线条图标，统一描边粗细，不用 emoji
- 交互：CTA 按钮只有一个，颜色对比度≥7:1（WCAG AAA）
用普通提示词，你大概率拿到的是一个五彩渐变的"现代感"页面。加上 UI/UX Pro Max，AI 知道 Swiss Minimalism 意味着什么，自然就生成对的东西。
三步上手
第一步：安装 Skill
在 Kollab Agent 会话中，或者直接在 Claude Code 里加载 UI/UX Pro Max Skill。Skill 会自动注入设计规范到上下文。
第二步：描述需求，指定风格
帮我生成一个 SaaS 产品落地页，使用 Swiss Minimalism 风格，
深海军蓝强调色，Plus Jakarta Sans 字体，
内容包括：Hero 区、三个功能点、一个 CTA 按钮。第三步：按需迭代
觉得太冷？换 Art Deco。想要科技感？试试 Cyberpunk Dark。UI/UX Pro Max 里每种风格都有完整的参数定义，AI 不用猜，直接执行。
专业感的本质
一个网页看起来是否专业，本质上取决于三件事：
- 一致性——颜色、间距、字体是否遵循同一套规则
- 对比度——内容层次是否清晰可辨
- 克制——是否知道什么时候该停手
AI 天然擅长执行规则，但不擅长制定规则。UI/UX Pro Max 做的就是这件事：把专业设计师的决策系统，翻译成 AI 能理解和执行的结构化指令。
你不需要学设计，但你需要知道用什么风格、为什么用。这篇文章就算是个起点。
资源
- UI/UX Pro Max Skill 开源地址 → kollab-handbook.netlify.app
- Swiss International Style 参考 → Wikipedia: International Typographic Style
- WCAG 对比度检验工具 → webaim.org/contrast-checker