什么?!你还不会搭建Figma设计组件库?

现在不少公司都选择用Figma之类的工具进行协同设计,一般都会建立一个共同的设计库。那作为新手,我们如何搭建一个自己的设计库?这篇文章,作者为我们详细解答。
图片
在追求设计效率和一致性的道路上,搭建一个Figma设计组件库成为了不少设计团队的必经之路。但作为一个零经验者,该如何从0到1科学地系统地搭建一个设计组件库呢?
相信我的文章会解答你的困惑,接下来,让我们一起来探索!
一. 简约而吸引人的封面
图片
二. 用户必备知识
图片
三. 变更日志
写变更日志(Change Log)通常是软件开发过程中的一部分,但是对于维护设计组件库同样适用,因为组件和开发密不可分,确保组件库中的设计元素符合开发需求,而且可以在实际开发中轻松地使用。
它记录了每个版本中的变更和更新。一个好的变更日志能够为用户提供清晰的了解,告知他们新版本的功能、改进和修复的问题。
1)版本号和日期:
在变更日志的开头,列出当前版本的版本号和发布日期。这有助于用户快速了解他们是否需要升级到新版本。
通常我们会使用语义化版本控制(Semantic Versioning):
在实际应用中,版本号的变更通常遵循以下原则:
当发布新功能时,增加次版本号,并将修订版本号重置为 0。当发布修复了 bug 的版本时,增加修订版本号。当发布引入了不向后兼容的更改时,增加主版本号,并将次版本号和修订版本号重置为 0。
2)改动内容包含:
A. 功能新增:
列出新版本中引入的新功能和改进。简要描述每个新增功能的目的和影响。
B. 改进和优化:
记录对现有功能的改进和优化。这可能包括性能改进、用户界面优化或用户体验的增强。
C. 问题修复:
列出在该版本中修复的问题或错误。描述每个修复的问题以及它们对用户的影响。
D. 安全更新:
如果新版本包含安全更新,确保在变更日志中明确记录。提供有关更新如何解决潜在风险的简要说明。‍
E. 已知问题:
如果有已知的问题或限制,也应该在变更日志中进行记录。这有助于用户了解在升级之前需要考虑的问题。
F. 其他说明:
如果有其他与版本相关的重要信息,比如不再支持的旧版本、重要提示或升级说明,也应该在变更日志中提供。
在每个新版本发布时更新变更日志,并确保保留之前版本的变更记录。这样用户可以查看历史版本的变更情况。
四.组件库主体
不同体量的组件库包含的内容有所差异,大体上分为两大块内容:
1)基础元素
图片
2)常用组件
常用组件是设计系统中经常被使用的一些界面元素或模块,具有通用性和复用性,可以在不同的页面和场景中被频繁使用。
不同体量的组件库之间在其包含的组件数量、深度和广度,以及适用的范围和复杂性方面有差异。通常按照首字母顺序建立不同的页面,列出当前规范中包含的具体组件。
3)页面级别
页面级别展示了不同页面的设计示例和标注,帮助用户理解不同页面的结构和布局,并且可以通过示例直观地感受到组件的实际应用效果。
图片
五.存档
存档部分包含了一些过时或不再使用的组件,虽然它们不再发布,但仍然保留用于文档和备份。这些组件可能已经找到了新的宿主库,或者被新的组件替代,但它们的历史价值依然存在。
图片
这是一篇非常详细的设计库搭建指南,不要犹豫!快来尝试从0搭建一个自己的设计组件库吧,这将是一件充满成就感的事情,你也会从实践中学到更多的知识!‍‍‍‍‍‍‍‍‍‍‍‍‍‍
本文由 @自来卷夏忆 原创发布于人人都是产品经理。未经许可,禁止转载
题图来自Unsplash,基于 CC0 协议