在软件开发领域，有“模块化设计”的概念，而在商业设计实践中，我们也常常听到“设计体系”“设计语言”“原子化设计”“组件化开发与设计”的概念。所谓“设计体系”，是否只是一个个设计元件组成的库？本文将结合Alla Kholmatova的《Design System》，了解“设计体系”指什么，什么时候应当应用，以及如何在团队内着手搭建设计体系。

1 是什么

在回答“设计体系是什么”之前，可以先想一想，“Design System”中的“system”是什么意思。牛津词典中对“System”的第一条释义为“A set of things working together as parts of a mechanism or an interconnecting network”[1]，即一组事物作为某个机制或相互连接的网络的一部分，共同发挥作用。第二条释义为“A set of principles or procedures according to which something is done; an organized framework or method”[1]，侧重于方法、框架，是能够达成某种目的的一组准则或程序。“设计体系”应取第二条释义，是一套为了促进产品目标的实现，联合协同多个子系统而形成的方法体系。
由此可见，文章开头提出的“设计体系是否只是多个设计元件组成的库”也可以解答了：设计元件组成的库只是设计体系的一个部分，不是全部。Alla表示，设计体系是一系列具有内在关联性的、组织有序的设计模式和实践方法，目的是服务于数字化产品设计[2]。
我们先看一看“设计模式”的概念。一个色彩鲜艳的按钮是不是一个设计模式？一个包含图片和标题文字的卡片是不是一个设计模式？一个根据首字母进行排序的列表呢？这些大大小小不同类型的组件都可以是一个设计模式；设计模式的定义不在于其结构外观。“设计模式”概念的提出可追溯至建筑设计师Christopher Alexander：“每种设计模式都针对某个在我们的环境当中反复发生的问题进行了描述，并提供了相应的解决方案。[3]” 关键词是“反复发生的问题”和“解决方案”。一个色彩鲜艳的按钮是一个设计模式，可能是因为它解决了“一个重要的按钮不被人们注意”的问题，而不是因为它色彩鲜艳。在数字化产品设计中，“设计模式”指代可复用的界面组成要素，包括按钮、文本框、图标、配色、字体、可复用的交互行为与功能流程等。
设计模式可以分为功能性的和感知性的设计模式，前者是产品核心功能及所在领域决定的设计模式，是界面的实体组成要素（组件），而后者体现产品的气质、品牌形象，是界面的非实体组成要素（风格）。组成产品界面的一系列具有内在关联性的设计模式，又构成了一种“模式语言”或“设计语言”，开发者们使用这种设计语言来开发产品。这种语言要如何使用？怎么让团队的不同成员对它拥有统一的理解？于是“设计语言”的“词典”沉淀而生，也就是大家熟知的“设计规范”或“设计模式库”。设计模式库是团队内的一种综合性工具，对设计模式进行汇总、提炼和共享，不仅有着功能组件、风格要素的具体展现，也包含对于使用方式的指导。

2 何时用

其实我们都了解设计体系的好处。在产品规模逐渐扩大的过程中，团队自然会积累出一些常用的设计模式。在设计产品时，如果发现某些问题反复出现，而相应地有一种共通的解决方案，这个方案就会被团队记录下来；审视已有产品时，如果看到有很多不一致的设计，这也会提醒开发团队，是时候梳理一下我们的设计规范了。很多设计模式已经被大众所熟知，历经验证，可以放心使用；设计模式的复用能力也可以避免设计人员将过多的精力置于设计模式本身，从而可以更好地思考需求；如果实现了代码层级的绑定，对设计模式进行的小的调整便可以立刻应用于全局，有助于体系化地控制整个产品的设计方案。
试图构建设计体系时，肯定会遇到不小的阻力。如果你能想象编写一部词典需要耗费怎样的精力，那么你也能知道，维护一个较大规模的设计模式库，并不是一件易事。静态文档形式的设计模式库是比较难维护更新的，需要人们自发地去维护。在人们不熟悉这本“设计语言词典”的情况下，或不习惯使用这本词典的情况下，将设计模式库中的内容灵活运用到产品设计中也是一件难事。设计模式库也无法保证设计产出的质量，因为模式本身的设计可能存在问题，模式也可能被误用或以不恰当的方式组合。诚然，想要发挥模式库的作用，需要与实践方法融合统一。
在“什么时候应当使用设计体系”的疑问背后，潜藏着对于维护、应用模式库的成本效益的忧虑。有的团队可能需要维护一套严谨的设计体系，有的团队则只需要松散的核心原则。Alla指出，设计体系与团队组织架构、团队文化、产品类型、设计流程都有关，构建设计体系时有三条特征参量需要注意：

• 实践规则（严格-松散）
  
• 构造方式（模块化-整合化）
  
• 组织方式（中心式-分布式）
  

严格的体系带来精确一致的设计方案，但也可能使得方案呆板，束缚开发团队的创造力；松散型的设计体系适用于对灵活性、适应性需求较高的产品团队。产品中模块化和整合化的程度不是一成不变的，显然模块化的构造方式适合需要不断扩展进化的产品需求，整合化则适用于具有特定目标、往往是一次性使用的产品，比如创意展示类页面、一次性的运营活动页面等。组织方式与人的能动性紧密相关，分布式的方式能赋予每个人参与构造、维护设计体系的权利，但也可能难以维持此种动力；集中式的组织方式权责明确，模式库可靠性强，然而也可能无法赢得全团队的支持，反而成为产品迭代发展的瓶颈。
无论建构出怎样的设计体系，团队的认同和参与都是极其关键的。理解了设计体系的好处与局限，团队成员共同根据团队的文化打造独特的设计体系， 这就很大程度上保证了成果的有效性。设计体系的价值不在于其特定的工具或形式，而在于它提供的核心原则和方法。当团队中的人们都能理解这些核心原则并执行下去，其他的一切都会随之而来。

3 怎么用

设计体系由设计模式和实践方法构成，这两个部分都需要团队不断摸索、迭代更新。先不深入到具体构建、维护模式库的操作细节，我们可以自上而下地思考如何起步。Alla举出了这些要点：

• 确保目标清晰一致
  
• 提升工作透明度
  
• 打造协作文化
  
• 保持团队动力
  

• 培养体系化的思维模式
  

  确保目标清晰一致

  制定计划,并确保团队的大家都了解这项工作的节奏,避免产生不现实的预期。

• 界面的体系化定义工作

  • 制定设计原则
    
  • 定义标准化的设计模式
    
  • 建立设计模式库
    
  • 创建模式库源文件
    
  • 重构前端架构与代码
    

• 工作流程与管理机制的标准化工作

  • 建立知识共享机制
    
  • 推广设计模式库
    
  • 推广标准化的协作语言
    
  • 将设计体系纳入新人培训流程
    

    提升工作透明度

    公开、诚实的记录对于团队来说也是保持学习、激发动力的有效方式。

    打造协作文化

• 创立单独的线上讨论空间，用于讨论设计模式的命名及其他相关问题
  

• 创建“模式墙”，鼓励更多人参与
  
• 定期举办同步会议，让大家了解相关进程
  
• 鼓励跨职能何做，鼓励主动性强的员工通过协作带动他人
  
• 通过工作坊或培训教程帮助更多员工了解设计体系
  
• 采用“游击策略”，在特定的工作日指定一个界面组件对员工进行宣传
  

  保持团队动力

  对于设计体系当中一些关键的工作，例如界面清查、模式库搭建，尽可能地让团队地每个人都参与进来，这有利于形成权责自主的氛围。
  构建模式库时，可以将工作分为“主体”和“精进”两部分，首先聚焦于各个模式最关键的构成，再逐一调整细节。在模式库构建前期，甚至可以先将设计稿中的标准化组件截屏加入模式库，让设计体系尽快发挥效用。

  培养体系化的思维模式

  设计模式似乎相互独立，团队却不能浅显地停留于独立的模式当中进行研究。团队应当理解模块之间的协同运作方式，了解它们是如何驱动产品整体目标的实现的。对于功能性设计模式和感知性设计模式，考查方式也有所区别：

结语

有效的设计体系，能够解放设计师的时间，帮助人们把精力用在更重要、更有意义的问题当中。阅读完本文，你也可以重新审视自己所在的团队应用的设计体系，或者着手开始搭建。如果想要了解更多细节上的建议，可以阅读Alla Kholmatova的电子书籍《Design System》。

参考

[1] https://www.lexico.com/en/definition/system
[2] Alla Kholmatova. Design System.
[3] Christopher Alexander. 建筑模式语言