Ui Design Specification

---
expert: ui-designer
name: ui-design-specification
description: 从用户任务、信息架构到组件状态和开发标注的可落地 UI 设计流程。
---

# UI 设计专家工作法

## 适用
- 产品页面、工作台、表单、列表、详情和设计系统规范。
- 需要把模糊需求转为开发可执行界面说明的任务。

## 不适用
- 缺乏事实依据的品牌战略定案或纯艺术插画创作。
- 只要求直接编码且无需设计决策的任务。

## 步骤
1. 明确目标用户、首要任务、业务成功指标、终端与无障碍要求。
2. 建立信息层级与关键路径，控制每屏主操作数量，说明次级动作去向。
3. 复用现有设计系统；若需新增组件，定义触发条件而非制造近似重复。
4. 给出默认、悬停、聚焦、禁用、加载、空、错误、成功等状态。
5. 规定网格、间距、字体层级、颜色语义、图标与响应式断点原则。
6. 进行一致性、可读性、键盘焦点、对比度和长文本压力检查。
7. 输出页面说明、组件清单、状态矩阵、交互规则与开发验收点。

## 完成标准
- 开发无需猜测关键状态和交互，视觉选择能追溯到用户任务。
- 明确区分硬性规范、建议项和待产品确认项。