创建与复用设计系统
把品牌参考整理成颜色、字体和组件规范,再在创作时选择它,让不同项目保持一致。
准备能说明品牌的参考资料
从首页侧边栏打开 Design systems,点击 Create。先添加参考资料,再生成:可以填写网站或 GitHub 链接、选择品牌参考、添加文件,或直接描述品牌。创建界面提示单个文件上限为 12 MB。请使用你有权提供给所选服务的资料。
已有书面规范时,可以粘贴 DESIGN.md;也可以复制已有设计系统作为起点。补充不能改变的内容,例如品牌色、标题字体、标志留白或组件交互。
从代码或 Figma 提取参考
展开 Advanced,可以添加 GitHub 仓库、本地代码、.fig 文件或 Figma 文件链接。选择与组件相关的源码和资源,不要把无关项目目录一起提交。
Figma 链接是参考来源,不代表所有私有文件都能读取。访问失败时,可提供有权限使用的 .fig 本地副本或清晰截图。支持读取 Figma 参考,不等于支持直接导出原生 Figma 文件。
生成后检查并调整规范
- 检查来源资料,点击 Generate。等待提取或生成结束,再检查设计系统。
- 对照参考检查预览和 DESIGN.md,重点核对颜色、字号、间距和组件规则,补齐遗漏、消除冲突。
- 修改 DESIGN.md 后保存。如果继续让 AI 调整规范,发布前再次核对生成结果。
规范要能指导后续项目:每种颜色用在哪里,标题和正文分别用什么字体,按钮、表单和不同状态怎么表现。只有几张好看的参考图,还不足以说明这些规则。
发布后,在创作中选择它
- 检查完成后,通过 Published 控件发布。草稿用于继续检查;希望其他项目使用时,需要先发布。
- 回到首页或项目的设计系统选择器,选择目标系统,并确认预览内容正确。
- 描述要创作的内容及重点规则。生成后逐项对照设计系统,有偏差时继续提出具体修改。
保存规范、发布系统和应用到项目是三个动作。设计系统发生变化,不代表已有作品已经重新生成;需要回到对应项目检查结果。
找不到系统或无法修改时
先检查当前工作区,以及系统是否已发布。个人资源与团队资源可能不同;同事同步来的副本也可能只读。修改源规范或发布状态时,需要由所有者或有相应权限的账号操作。
提取失败时,核对链接、文件大小和访问权限;移除无法读取的来源,或换成有权限的本地资料后再试。保存失败时,离开页面前先复制保留修改后的规范。在 OpenDesign 中发布,不会自动把修改推送回 GitHub。