28 lines
1.2 KiB
Markdown
28 lines
1.2 KiB
Markdown
---
|
|
title: "Design System"
|
|
type: concept
|
|
tags: [UI Design, The Agency, Component Library]
|
|
---
|
|
|
|
## 定义
|
|
一套完整的设计标准文档，包含设计令牌系统、组件库架构、响应式框架和可访问性标准，用于在产品生态系统中实现视觉一致性和用户体验统一。
|
|
|
|
## 核心组成
|
|
- **Design Token**：设计令牌系统，包含颜色、字体、间距、阴影、过渡等视觉变量
|
|
- **Component Library**：组件库，包含按钮、表单、导航、反馈等基础组件
|
|
- **Responsive Framework**：响应式框架，通过移动优先方法实现跨设备适配
|
|
- **Accessibility Standards**：可访问性标准，包含 WCAG AA 合规要求
|
|
|
|
## 设计原则
|
|
- 设计系统优先方法论：在创建单个界面之前建立组件基础
|
|
- 可访问性优先：默认包含 WCAG AA 最低标准
|
|
- 响应式优先：移动优先方法实现跨设备体验
|
|
- 开发者交接导向：提供精确的测量数据和资产文件
|
|
|
|
## 典型应用
|
|
- UI Designer 智能体使用设计系统创建完整的组件库架构
|
|
- 开发者根据设计系统实现像素级界面
|
|
- 设计师与开发者通过设计系统进行高效协作
|
|
|
|
## 资源
|
|
- [[UI Designer]]：设计系统的创造者和维护者 |