# 设计智能参考

本参考用于把模糊的 UI 请求转成可执行设计系统。先识别产品类别，再组合风格原型、色彩角色、字体情绪、动效节奏、图表任务和 UX 风险。

## 决策流程

1. 提取关键词：产品类型、用户、场景、主要任务、内容密度、品牌语气、技术栈。
2. 匹配产品规则：从 `data/product-rules.json` 选择最接近的类别，记录推荐结构、风险和反模式。
3. 选择风格原型：从 `data/style-archetypes.json` 选择 1 个主风格和最多 1 个辅助风格，避免风格拼贴。
4. 建立 token 方向：定义主色、强调色、背景、前景、边框、危险色和 focus ring 的语义角色。
5. 选择字体情绪：不要只选“好看的字体”，要说明标题和正文各自承担的语气与可读性。
6. 判断数据表达：趋势用折线/面积，比较用柱状，构成少量类别可用环图，流程用漏斗/步骤，明细必须保留表格替代。
7. 输出反模式：每个设计建议必须附带“不要做什么”，避免落入通用模板。

## 何时运行生成器

使用以下命令生成设计系统建议：

```bash
node skills/fec-ui-design/scripts/design-system.mjs "beauty spa booking" --project "Serenity Spa"
```

输出 Markdown 适合贴入计划或 PR 描述；输出 JSON 适合测试或工具消费：

```bash
node skills/fec-ui-design/scripts/design-system.mjs "fintech analytics dashboard" --format json --stack next
```

## 输出必须回答

- 这个界面的主任务是什么？
- 推荐哪种页面结构或工作区结构？
- 视觉锚点是什么，为什么贴合业务？
- 主风格、字体、色彩、动效分别服务什么目标？
- 图表和数据密度如何处理？
- 哪些反模式必须避免？
- 上线前最小 QA 清单是什么？