我们该如何去创建一套 Design System

223 阅读5分钟
原文链接: zhuanlan.zhihu.com
Design System 的深度固然重要,但更重要的还是它能解决一类业务的实际问题,真正提升质量和效率。

近来收到的简历中越来越多的出现了 Design System 这个关键词。大家都会在作品中附上 Design System 的部分,来体现自己日常工作中关于一些成果和思考。而今年的晋升过程其实也不例外,很多同学也都会展示自己在这方面的一些工作。

Design System 似乎已经成为大家展示自己能力的一个重要方法,如果没有这一块就感觉没能跟上这个行业的发展。情况真的是这样吗?是,但也并非全部。

先从结果上来看,很多呈现出来的 Design System 其实还是一套 UI Kit,只是换了个形式加上一些注释重新表达了一下而已。

这样的展示非但没能给自己进行加分,反而暴露出了设计师对 Design System 的理解偏差,不去碰这部分认认真真的讲项目可能更好。

当然,长线来看我认为每位设计师仍然很有必要去了解并尝试构建自己的 Design System。这是大家去体系化思考设计,也是设计发展的必然方向。

所以这次的期刊我想和大家聊聊如何看待以及如何去创建真正适合自己的 Design System。

Design System 要解决什么问题:

既然我们要去研究 Design System,并且拿出一套大家能够认同的方案,那么我们则还是需要回到问题的根本,我们做 Design System 究竟是为了解决什么问题。

从结果角度来看,Design System 需要提供的是一套质量、效率上都有所保障的可行性解决方案,大家依照这个指引能够更快速的完成产品的迭代和功能开发。

这个诉求则带来了另外一个问题,如何确保这套指引具备对未来较好的可拓展性,同时也能在体验层面达到一定的水准?

这也就给设计师带来了更大的挑战,设计能力的抽象、领域的理解、设计理念的体现都需要大量经验的累计和背后的思考来支撑。而这也是 Design System 具备含金量的真正原因。

如今在互联网上我们能找到很多设计团队对外发布的 Design System,也是一些设计师借鉴的方向。

只可惜很多设计师只是借了其形,却并没有去挖掘它们背后的信息,这也是 Design System 并未能解决自己问题的很重要一个原因。

如何看待市面上的这些 Design System?

市面上我们经常能看到的这些 Design System,通常我会将它们分为「领域」和「业务」两类。

领域这类 Design System 通常并没有面向具体的业务,换句话来说也就是基于它应该可以创建出不同类型的产品。比如我们最为熟悉的 iOS Design Guideline 和 Material Design 。

也正是因为它们需要能够满足更多把不同类型业务的诉求,所以他们会有很强的设计世界观,并呈现在具体的指引上。

但在 Components 和 Patterns 上会比较的“底层”,例如卡片、对话框、列表等等… 当然,也只有更加的抽象它才能够更加的“万能”。

有很多同学的 Design System 就属于这个范畴,因为它的“格式”其实已经存在,创建它的难度并不太大。

但最终的呈现上就显得比较的 UI Kit,而这个背后的缺少了一个对相关业务的一个设计理念支撑,以及具象的解决方案。也正是因为这一点,这些 Design System 无法呈现出设计理念也没能承载具体业务,给到大家的整体感受自然也就大打折扣了。

再来说说业务类的 Design System。这个其实也很好理解,它们面向的是解决具体某个业务的问题,比如我们之前介绍过的 Lightning、MailChimp 等。它们的业务类型很具象,需要解决的问题也很明确,Design System 就是基于这个业务的特性产生的设计理念来展开并面向具体的问题。

领域型 Design System 提供的是一种基础标准和可能性,而业务类输出的某种层面上来说则是一个具体的“值”。对于我们绝大多数人来说,我们更需要关注的是业务类的 Design System。它相对更容易驾驭,也更能和自己的具体工作产生一个整体性的关联。


以上是 PinDesign 设计期刊的第 107 期的节选内容,在接下来的全文内容中(付费部分)将继续以两个比较有代表性的案例来和大家进一步分解,看看我们应该如何去做业务型的 Design System。

加入 PinDesign 会员,获取本期主题「我们该如何去创建一套 Design System」的全文内容及本系列前 2 期文章的赠送,年付会员将获得近期的 10 期文章的赠送。

点击领取 PinDesign 会员计划 50 元优惠券

Design System 系列已更新:

5key:什么是 Design Systemzhuanlan.zhihu.com图标5key:Design Systems 02 - 什么是 Design Principleszhuanlan.zhihu.com图标5key:Components 与 Patterns 究竟有什么区别zhuanlan.zhihu.com图标5key:你该为产品设计怎样的气质zhuanlan.zhihu.com图标5key:Design System 中的 Design Tokenzhuanlan.zhihu.com图标5key:Design Pattern 实例 - 用户通知与中断zhuanlan.zhihu.com图标5key:Design Pattern 组合实例 - 列表页设计思考zhuanlan.zhihu.com图标5key:Design Pattern 划分方式是对设计的逻辑思考zhuanlan.zhihu.com图标5key:Design Pattern - 页面的信息展示逻辑zhuanlan.zhihu.com图标5key:换个角度谈表单设计zhuanlan.zhihu.com图标5key:购物车的设计逻辑zhuanlan.zhihu.com图标5key:筛选与排序的设计逻辑zhuanlan.zhihu.com图标

点击下方链接,了解 PinDesign 会员计划详细信息:

PinDesign 互联网产品设计周刊wap.youzan.com