UI/UX 设计师作品集与灵感知识库案例
本案例展示一名交互设计师如何用 Obsidian 搭建个人设计资源中枢,把碎片化的灵感、竞品分析与作品集素材组织成可随时调用的设计弹药库。
mermaid
flowchart LR
A[设计仓库] --> B[灵感收集]
A --> C[竞品分析]
A --> D[设计系统]
A --> E[作品集]
B -->|标签分类| F[按领域/风格]
C -->|双链关联| G[[设计模式库]]
D -->|组件文档| H[Token/组件卡]
E -->|引用素材| I[项目复盘笔记]场景与痛点
| 痛点 | 解法 |
|---|---|
| 灵感截图散落各 App | 灵感收集区统一归档 + 标签检索 |
| 竞品分析难复用 | 竞品卡双链到 [[设计模式库]] |
| 设计系统文档易过期 | 组件卡 + Dataview 自动汇总 |
| 作品集临时拼凑 | 项目复盘笔记持续沉淀,求职时直接引用 |
仓库结构
text
设计仓库/
├── 灵感收集/ # 截图、配色、动效
├── 竞品分析/ # 按产品/功能
├── 设计系统/ # Token、组件、规范
├── 作品集/ # 项目复盘
├── 素材库/ # 图标、字体、模板
├── daily/ # 设计日志
└── templates/核心工作流
- 灵感速记:用 QuickAdd 一键截图建卡,自动打
风格、领域标签,附来源链接。 - 竞品拆解:每篇竞品分析按「信息架构/交互/视觉」三段,结尾双链到相关
[[设计模式]]与[[组件卡]]。 - 设计系统卡片:组件卡记录 Props、状态、可访问性说明,Dataview 汇总成组件清单。
- 作品集沉淀:每个项目一篇复盘,含「问题/过程/结果/反思」,求职季用 MOC 串联成集。
- 配色与 Token:用 Canvas 画品牌色板与组件关系图,便于向开发交付。
yaml
# 组件卡 Frontmatter 示例
type: component
名称: "PrimaryButton"
状态: ["default", "hover", "disabled"]
可访问性: "对比度≥4.5:1"
关联: "[[设计Token]]"dataview
TABLE 状态 as "状态", 可访问性 as "可访问性"
FROM "设计系统/"
WHERE type = "component"
SORT file.name ASC关键插件与模板
- Excalidraw — 手绘线框与流程
- Canvas — 设计系统与色板关系图
- Dataview — 组件清单汇总
- QuickAdd — 灵感一键收集
- Templater — 竞品分析模板
- 插件系统 — 更多扩展
注意事项
版权与保密
竞品截图与未发布项目属版权/商业机密,仓库仅本地保存,切勿外发或上传公开图床;客户项目交付前需脱敏。
提示
灵感收集容易"只存不用",建议每周用 Dataview 回顾未引用卡片,强制在下一个项目中复用至少 1 个。