设计系统｜B 端设计系统怎么做？设计系统的介绍与构成-技术圈

▲点击"三分设"关注，回复"社群"加入我们

欢迎来到专业设计师学习交流社区
三分设 x 100+UED
编辑：韦建军审核：王翎旭
本文共 2590 字 15 图预计阅读 7 分钟

Background

前言

酷家乐作为 saas 服务公司，含有多种 B 端产品。对于 B 端产品的体验设计，一方面需要进行体验洞察，另一方面非常适合利用设计系统来提升设计效率与产品一致性。设计系统可以帮助产品和服务飞速发展，在全球范围内有广泛的应用。本文将介绍设计系统及其优势，设计系统的组成部分和优秀实践案例，带你全面了解设计系统相关理论和常用内容，希望阅读过后有助于展开对设计系统更深一步的学习。

Part 1 什么是设计系统？

在 1977 年，Christopher Alexander在《A Pattern Language》中首次提出模式的概念，之后工程师 Brad Forst 提出了 Atomic Design，分层建立设计系统；Alla Kholmatova 在《Design systems》中归纳、提出了完整的设计系统的概念。

设计系统的核心，是通过可重用的各种组件、规则、约束和原则帮助使用者建立规划化的设计思维。通过标准规范使团队合作更加紧密一致，鼓励岗位之间的合作，提升合作的效率，减少错误的发生。一个好的设计系统指南可以帮助设计人员和开发人员了解已有的设计工作箱，并指导他们如何正确使用规则。

Part 2

设计系统的有哪些优势？

近些年来，设计系统在互联网公司中不断被提及，促使着设计向规模化的方向进行。公司为了提升用户体验，开始向设计中投入越来越多的资源，在这类公司中设计团队常常有以下特征：

1、设计团队有一定的重要程度

2、设计团队服务公司大部分产品

3、设计团队正在发展中

如果你的设计团队符合以上的特征，那么你的团队常常需要设计系统来提升设计的表达和工作效率。下面，让我们来了解一下设计系统有何优势，让众多公司都进行了设计系统的开发。

设计统一化

随着公司和团队的发展，设计团队往往需要让设计师专注合作某一业务或产品团队，久而久之，设计师会专注于业务需求的探索，忽略了公司层面的设计一致性。这就会导致用户在面对公司产品时一系列的体验不一致。每个设计师都使用着自己习惯的一套设计语言和组件，也会导致跨组合作的项目出现冲突，当矛盾出现时，听你的还是听我的，又会造成团队内合作的问题。

没有共同的设计语言来约束设计，用户体验和团队合作就会出现问题，工作流程也因为变得低效。因此，要解决以上问题，就需要团队通过系统化思维，从底层到表层达成一致，使用同一套已经约定过的规则和工具库，通过公认的最佳实践来保证。

此外，需要说明的是，这套公认的规则并非一成不变，需要跟随业务和产品的变化同步、及时更新。当然这一点也需要团队内成员达成共识。

使用组件能够避免页面元素的混乱

管理设计体验

随着公司和团队的快速增长，设计师在产品中积累的问题也会随之增长，产生设计负债。设计负债一方面包括一些历史原因存在的不可复用的设计模式，另一方面也指因为一些短期压力设计师考虑不周产生的不可复用的低效的设计模式。设计负债导致用户体验不佳的同时，也会导致设计系统的维护负担变得越来越重，公司新设计师因为不了解历史情况需要不断学习老旧的设计模式，从而不断堆积负债，形成恶性循环。

通过设计系统，设计系统就像汽车工业的标准化组件，可以让团队的设计和执行过程更有秩序性和计划性。通过对设计系统的统一管理，减少负债产生的可能。同时通过设计系统的内容也可以快速替换已经存在的历史负债，清扫遗留问题，帮助产品和代码减少弊病，从另一方面有效促进产品迭代。