专业知识库 · 交互 UI 设计师

这里住的是设计师岗位相关的权威设计规范方法论存量。设计师在 SOP 第 4–5 步需要参考时,优先从这里调用——不是临时去 Dribbble 扒图。


1. 为什么要有这个库

1.1 避免临时扒图

设计师最容易掉进的坑: - 没灵感就去 Dribbble / Pinterest 瞎扒(C 档不可溯源) - 每次都重新下载 HIG PDF(下载的版本可能还是旧的) - 抄了大厂的组件但不知道为什么这样做

1.2 支撑"每个设计值都能说清为什么"的硬约束

设计师的红线之一是"不允许无理由偏离 HIG/MD3"。专业知识库是这条红线的底座库——没有这个库,设计师"拍脑袋选 16px"就没有依据。

1.3 CKO 回写的落脚点

CKO 蒸馏时的"路径 A 岗位方法论更新"回写到这个库的 方法论/ 子目录。


2. 谁往这里写

来源 动作 落档位置
数据扒取部(被动任务) 按设计师点菜单扒权威源 源_标准/ · 源_巨头/ · 源_学术/
CEO 本人(B 档来源) 有电子书、Figma 订阅资源时一次性导入 源_用户提供/
CKO(蒸馏回写) 项目蒸馏过铁律 1 成熟度闸后的方法论 方法论/
数据扒取部(主动任务) 每月订阅里的设计趋势、HIG 更新 源_巨头/_新鲜/ (30 天后归档)

3. 组织结构

专业知识库/
│
├── 方法论/                              · CKO 蒸馏写入的"怎么做设计"规则
│   ├── 设计系统搭建法.md               · Token 设计顺序
│   ├── 原子设计_AtomicDesign.md        · Brad Frost 方法
│   ├── 8pt_Grid_System.md              · 间距基线制
│   ├── Double_Diamond.md               · Discover/Define/Develop/Deliver
│   ├── Material_You_配色生成.md
│   ├── Dark_Mode_双主题设计.md
│   ├── 响应式设计_breakpoints.md
│   ├── 状态集5态方法.md                · 正常/空/加载/错/边界
│   ├── 动效设计_duration_easing.md
│   ├── 无障碍_a11y_实操.md
│   ├── Storybook驱动交付.md
│   └── _变更日志.md                    · CKO 回写追加
│
├── 源_标准/                             · T3 权威规范
│   ├── Apple_HIG/                      · iOS / macOS / visionOS / watchOS
│   │   ├── hig_foundations.pdf
│   │   ├── hig_patterns.pdf
│   │   └── hig_components.pdf
│   ├── Material_Design_3/              · Android / Web / 跨端
│   │   ├── md3_foundations.pdf
│   │   ├── md3_color_system.pdf
│   │   └── md3_components.pdf
│   ├── Fluent_2/                       · Microsoft Surface / 桌面
│   ├── WCAG_2.2/                       · 无障碍
│   │   ├── wcag_22_guidelines.pdf
│   │   └── wcag_22_checklist.md
│   ├── ISO_9241/                       · 人机交互国际标准
│   └── W3C_Design_Tokens/              · Design Token 草案
│
├── 源_学术/                             · T1–T2 HCI 论文与祖师书
│   ├── HCI/                            · CHI / UIST / CSCW
│   │   ├── nielsen_10_heuristics.pdf   · Nielsen 十大可用性原则
│   │   ├── norman_design_of_everyday_things.pdf
│   │   └── fitts_law_original.pdf      · Fitts 定律
│   ├── 视觉感知/                       · 格式塔 / 色彩学
│   │   ├── gestalt_principles.pdf
│   │   └── color_theory_itten.pdf
│   └── _新鲜/                          · 每月订阅的最新论文(30 天后归档)
│
├── 源_大学/                             · T4
│   ├── Stanford_HCI/                   · CS 247
│   ├── MIT_Media_Lab/
│   └── CMU_HCII/
│
├── 源_巨头/                             · T5 公开设计系统
│   ├── Airbnb_DLS/
│   ├── Stripe/
│   ├── Uber_Base/
│   ├── Shopify_Polaris/
│   ├── Atlassian_Design/
│   ├── IBM_Carbon/
│   ├── Salesforce_Lightning/
│   ├── Ant_Design/                     · 中文 B 端常用
│   ├── Arco_Design/                    · 字节
│   └── _新鲜/                          · 最近 30 天的趋势文章
│
├── 源_用户提供/                         · B 档
│   ├── books/                          · CEO 的电子书(Refactoring UI 等)
│   ├── figma_resources/                · 买过的 Figma UI Kit
│   └── courses/                        · 设计课程讲义
│
└── _索引.md                             · 按主题组织的快速查表

4. 每份资料的元数据规范

4.1 必填字段

---
title: {资料标题}
author: {作者 / 组织}
version: {版本号,如 HIG 2024}
year: {年份}
source_url: {来源 URL}
tier: {A / B}
authority_level: {T1–T7}
collected_at: {YYYY-MM-DD}
collected_by: {数据扒取部 / 用户提供 / CKO 回写}
tags: [设计系统, HIG, MD3, a11y]
summary: {一句话摘要}
---

4.2 权威金字塔(T1–T7,设计师特化)

级别 描述 示例
T1 顶会论文 / 祖师书 CHI / UIST / Norman《设计心理学》
T2 学术期刊 / 博士论文 IJHCS / MIT 博士论文
T3 标准组织 / 平台规范 Apple HIG / Material Design 3 / Fluent / W3C / WCAG / ISO 9241
T4 顶级大学课程 Stanford CS 247 / MIT 6.813
T5 科技巨头公开设计系统 Airbnb DLS / Stripe / Ant Design / Carbon
T6 行业设计博客 Smashing Magazine / A List Apart
T7 设计社区 Dribbble / Behance(仅作灵感参考,不作引用源

底线:设计师的正式决策至少引用 T5 及以上。T6 作为趋势参考。T7 严禁作为设计依据


5. 用法

5.1 在 SOP 第 5 步中的调用顺序

  1. 先看 方法论/ 里是否有现成的方法论可用
  2. 没有 → 看 源_标准/ 找平台规范(HIG/MD3 首选)
  3. 没有 → 看 源_巨头/ 找大厂的处理方式
  4. 没有 → 看 源_学术/ 找 HCI 论文
  5. 还没有 → 点给数据扒取部扒新源
  6. 扒完后 → CKO 评估是否值得升级进 方法论/

5.2 _索引.md 按主题组织示例

## 色彩
- Material You 配色生成 → `方法论/Material_You_配色生成.md`
- MD3 Color System → `源_标准/Material_Design_3/md3_color_system.pdf`
- WCAG 对比度要求 → `源_标准/WCAG_2.2/`

## 动效
- Motion 设计原则 → `方法论/动效设计_duration_easing.md`
- HIG Motion → `源_标准/Apple_HIG/hig_foundations.pdf` §Motion
- MD3 Motion → `源_标准/Material_Design_3/md3_motion.pdf`

## 无障碍
- a11y 实操 → `方法论/无障碍_a11y_实操.md`
- WCAG 2.2 清单 → `源_标准/WCAG_2.2/wcag_22_checklist.md`

6. 红线


7. 维护节奏