plan-uiux

Files (2)

• SKILL.md
• openai.yaml · agents/

SKILL.md (first lines)

# /cc-code:plan-uiux — 风格定稿与改版编排器（两种模式，一个视觉门）

> **定位：出「设计规格 + 风格样板板」，不是画原型、不是写项目代码。** 本命令由主控编排、`uiux` agent 执行；主控只传话，不写 `design.md`、不写 `.cc_code/design/`、不做任何设计判断。
> **唯一视觉门：主人说「定了」。** 没有「定了」就不锁定、不进入实现；「定了」之后按模式自动接执行命令（模式一 → `agent-mvp` 的视觉地基；模式二 → `agent-uiux`）。
> **规则唯一出处**：视觉规则、规则号与锁定前自检组 = `skills/cc-code/references/ui-gates.md`；形态、默认栈、家族、三旋钮、灵感配额、原话翻译 = `skills/cc-code/references/frontend-forms.md`；`design.md` 章节结构 = `templates/design.md`（生成项目里的 `.cc_code/active/design.md`）。本命令只写编排纪律，⛔ 不复述规则内容。

## 一、定位

| 项 | 说明 |
| --- | --- |
| 解决什么 | 把「这个项目长什么样」定成可判的规格：全项目一份 `design.md` + 一套看得见的风格样板板 |
| 不解决什么 | 业务逻辑与页面清单（`plan-mvp` / `plan-feature` 管）、项目代码与主题生成（`agent-mvp` / `agent-uiux` 管）、验收判词（qa 管） |
| 前置 | 有前端；`ux.md` 已有前端形态表与页面清单（`plan-mvp` / `plan-feature` 由 uiux 落盘）；`project.md` §一.1 已登记前端组件库家族与主题入口（缺失 → 停下交回主控，先由 architect 补，⛔ 不猜家族） |
| 产出 | `.cc_code/active/design.md`（§0 状态行 + §一~§十一 + 附录）+ `.cc_code/design/` 下的方向卡、风格样板板与样板板截图 |
| 配对 | 模式一 → `/cc-code:agent-mvp`（首阶段视觉地基）；模式二 → `/cc-code:agent-uiux` |
| 出场 | 只在 `plan-mvp` / `plan-feature` / 本命令；⛔ 不出现在任何 `agent-*` 命令里 |

## 二、两种模式与入口分流

```
入口（主控只读 status 的「风格：」行与坐标，不读 ux.md / design.md 内容）
   ├─「无前端」─────────────────────────────────► 不跑本命令（design.md 已写「不适用（无前端）」）
   ├─「未锁」/「未锁（冷启动豁免）」──────────────► 模式一 定风格
   ├─「已锁」，主人要改长相 / qa 体检出问题 ─────► 模式二 改版
   ├─「已定未实现」──────────────────────────────► 不重复定风格：走 /cc-code:agent-uiux
   └─ 该行缺失 ──────────────────────────────────► 先派 uiux 按 design.md §0 补齐 status 行，再按上面重判
```

| 模式 | 什么时候用 | 谁先动 | 结束状态 | 接下来 |
| --- | --- | --- | --- | --- |
| **模式一 定风格** | 项目还没有锁定的设计规格 | uiux | `design.md` = 已锁定（写日期） | `agent-mvp` 首阶段视觉地基 |
| **模式二 改版** | 已锁定，主人要改长相，或 qa 现状体检出问题 | qa 出体检报告 | `design.md` = 改版待实现（写本次范围） | `agent-uiux` |

> 模式由 `status.md`「风格：」决定，⛔ 不靠主控猜、不靠对话记忆；它与 `design.md` §0 的一一对应关系单一出处 = `templates/design.md` §0.2，本命令不复述。主控 ⛔ 不读 `design.md` 数值内容。

## 三、与 `ux.md` 的分工（SSOT，零重叠）

```
  ux.md（行为 + 布局半边，uiux 写）           design.md（风格与长相，uiux 写）
  ───────────────────────────────           ─────────────────────────────
  前端形态表（按端一行）                       色彩 / 字体与排版
  页面清单 / ASCII 布局原型                    间距与栅格 / 形状与深度
  可交互元素 testid / 交互五态                  动效 / 图标与图像 / 组件长相
  断点布局变化 / 跨页流转                       各端主题映射 / 页面构图
```

- **判据一句话**：换一套皮肤仍然成立 → `ux.md`；换皮肤就会变 → `design.md`。
- ⛔ `ux.md` 不出现任何色值、字体、圆角、阴影、样式实现；⛔ `design.md` 不写页面结构、testid、交互五态、流转。
- 本命令只在模式二允许 uiux 微调 `ux.md` 的**布局段**（ASCII 原型、断点）；碰流转 / 五态 / 接口 → 停下交回主控，转 `pm` / `architect`。

## 四、铁律（违反任一即本次风格工作无效）

1. **唯一视觉门 = 「定了」**：主人没说「定了」，⛔ 不把 `design.md` §0 写成「已锁定」、⛔ 不让执行器开工。
2. **主控只传话、只写 status**：⛔ 主控不写 `design.md`、不写 `.cc_code/design/`、不做审美判断、不替主人选方向；本命令的产物一律派 `uiux`。
3. **一个项目只许一个主风格 skill**：数量、可选清单、冲突处理单一出处 = `skills/cc-code/references/frontend-forms.md` §十三；主人一次给了多个名字 → 主控原样问一句「只许一个，用哪个」。
4. **轮次可数，不许无限改**：同方向最多 3 轮；换方向一次、重计 3 轮；再不定停下交人（细则见 §五.5）。
5. **锁前自检全过才交主人看**：自检查什么、什么组、什么时机 = `ui-gates.md`（「锁定前 · 自检」）；⛔ 不拿主人的眼睛当自检工具。
6. **不做任何版本库操作**：本命令 ⛔ 不跑任何 git 命令；提交由主人自己决定。
7. **不发明判据**：A / U / V 编号各归其主（`prd.md` / `ux.md` / `gates.md`），本命令 ⛔ 不新建编号、⛔ 不写验收判词。

## 五、模式一 定风格

```
Step 0 入口
   主控读 status（只看「风格：」与坐标）→ 派 uiux（全新上下文）
   uiux 自己读：ux.md §一（形态表与页面清单）、project.md §一.1（家族与主题入口）
     ↓
Step 1 方向卡（有条件，见 5.1）
   营销 / 品牌类 且 主人没给方向 → 推荐 1 + 对照 2，原样给主人看
     ├─ 主人挑一张 / 说改 → 进 Step 2
     └─ 主人不说话      → 用推荐，不追问
   ⛔ 不需要方向卡（主人已给参考图 / 已点名风格 / 非营销品牌类）→ 直接 Step 2
     ↓
Step 2 design.md 草稿（uiux 写，见 5.2）
   §0 状态 = 草稿；三旋钮先定；签名一招恰好 1 个
     ↓
Step 3 风格样板板（uiux 写 .cc_code/design/，见 5.3）
     ↓
Step 4 锁定前自检（uiux，见 5.4）
   ⛔ 全组未过 → 就地改，不交主人看
     ↓
Step 5 主人看样板板 → 逐点说改 → 原样续接同一个 uiux（轮次见 5.5）
     ↓
Step 6 主人说「定了」→ 锁定（见 5.6）
     ↓
Step 7 分流：主控更新 status「风格：」= 已锁 → 直接调用 /cc-code:agent-mvp 自动开工
   （首阶段视觉地基：dev 搭主题 + 全局框架 + 组件陈列页；qa 复核并首次冻结截图基线）
```

> **Step 编号只是本命令内部的步骤序号，⛔ 不是检查时机名。** 三个检查时机统一叫「现状体检 / 锁定前 / 开发后」，单一出处 = `skills/cc-code/references/ui-gates.md`。

### 5.1 方向卡（什么时候要、给几张）

| 项 | 规则 |
| :--- | :--- |
| **要的情况** | 营销落地页 / 品牌类形态，**且**主人没给方向（没指定风格、没给参考图、没描述想要的感觉） |
| **不要的情况** | 主人已给参考图；主人已点名风格 skill；非营销 / 品牌类（SaaS、后台、文档）；模式二 |
| **给几张** | **推荐 1 + 对照 2**（共 3 张）；推荐那张写明推荐理由（业务语言） |
| **主人不说话** | 直接用推荐那张，⛔ 不连着追问 |
| **每张卡内容** | 方向名（一句人话）+ 1~3 张参考 + 一条借鉴句 + 三旋钮取值 + 主风格 skill 名 |
| **参考配额与借鉴句** | 单一出处 = `frontend-forms.md` §九；⛔ 参考图不入库；⛔ 禁用「高级感 / 氛围 / 质感 / 简洁 / 大气」 |
| **介质** | 参考板 / 图片即可；`pen` 只作可选介质，⛔ 不强制、⛔ 不作唯一载体 |

### 5.2 `design.md` 草稿

- 由 uiux 写 `.cc_code/active/design.md`，章节与表格结构以 `templates/design.md` 为准，本命令不复述。
- 主人可在命令后点名一个主风格 skill（如 `/cc-code:plan-uiux gpt-taste`）：名字是合法加载依据，原样写进任务单、由 uiux 自己加载；写了多个 → 只许一个，主控原样问一句「用哪个」。
- 三旋钮的取值与书写顺序以 `frontend-forms.md` §五 与 `templates/design.md` §一 为准，本命令不复述。
- 主风格 skill 只填 1 个；签名一招必须恰好 1 个。
- 只写「本项目是什么样」；⛔ 不写页面结构 / testid / 交互五态 / 家族版本号 / 主题入口（分别在 `ux.md`、`project.md` §一.1）。
- 暗色方案按 `ui-gates.md` 的规则处理；不做暗色必须在附录 B 登记放行（只有主人能批）。

### 5.3 风格样板板规格

| 项 | 规则 |
| :--- | :--- |
| 是什么 | **静态展示页**，用来让主人用眼睛判风格；⛔ 不是项目代码、⛔ 不上线、⛔ 不进构建 |
| 放哪 | `.cc_code/design/`（uiux 写；截图同目录） |
| 怎么渲染 | 用家族官方静态包渲染真实组件；shadcn 家族用同一套主题变量近似并**在页上标注「近似」** |

From weiyi88/cc-code, MIT.

More from weiyi88/cc-code