今年,由于业务量的增加,我所在的公司组织越来越强调“可复制”的概念。这不是一个新概念。对应到设计,大概就要提到设计系统了。很多年前第一次听到这个概念的时候,总觉得设计系统是一个很高大上很牛逼的东西。MaterialDesign出来没多久,Apple的Human-MachineDesignGuidelines就统治了设计圈,虽然我主要做的都是Android系统,仔细阅读了IOS的HumanInterfaceGuidelines。那么,其实也没什么了……你觉得设计系统怎么样?关于设计体系,有人认为是一种玄学,有人认为很好,但很容易被束之高阁。落灰,有人认为是对设计师的一种束缚……此外,还有很多与之相关的概念经常被混淆:设计语言、设计原则、设计规范、设计风格、设计构件……图1:设计系统词云图为了弄清楚什么是设计系统,我把上面的词和设计系统中经常出现的词进行了分类。在我看来,他们所指出的应该是基于不同角度对设计体系的解读。其中,有的解释了设计系统存在的原因:追求效率、保持一致性、避免重复劳动、帮助数字产品形成一个整体等。有的解释了它的组成或相关内容:设计规范、设计语言、设计原则、设计规范、设计风格、设计组件等。一些解释了设计系统中容易出现的问题:形而上学、克制、宏伟、理想化等。存在的理由就是目的建立一个设计系统。正是因为设计系统是帮助我们更高效工作的整体工具,也就注定了设计系统的风格、构成和运作方式不会有层次感。每个公司都需要为自己的团队找出设计和开发之间最顺畅的系统。请注意,虽然设计系统听起来很酷,但创建一个好的设计系统可能非常耗费人力。因此,设计系统的目的必须明确,满足现状的需要。为什么要创建设计系统?我认为只有当你或团队对以下项目有强烈需求时,才是生成设计系统的好时机。以往的设计内容总是需要快速复用,需要释放设计资源,让人力专注于更复杂、更有价值的问题。需要在多个团队或多个产品之间保持一致性。需要帮助初级设计师的产出快速满足更高层次的要求。不需要的设计体系是一套“玄学”,以后会被搁置起来,等待尘封。词组系统是指由具有特定结构和功能的相互关联的要素组成的有机整体。设计体系自然是一个整体的有机集合。图2:设计体系的构成1.设计原则设计原则是指导设计体系建设的指导思想和战略方向,是基于大量实践经验的高度理论总结。设计原则的概念不仅仅为了设计系统而出现。从格式塔心理学流派采纳的格式塔理论包括接近性、相似性、闭合性、连续性等设计原则,以及“如果没有必要,就不要增加实体”的概念是简洁的核心设计原则,由此而来来自DonaldNorman的概念模型、反馈、有限范围、可感知预设使用等四大设计原则。为了对抽象的设计原则有更直观的感受,我们来看看一些比较知名的设计系统原则.Apple:审美上整体、一致、直接可操作性、反馈、隐喻、用户可控Microsoft:自然、直观和强大、引人入胜和身临其境Google:Material是隐喻、明显、图形和有目的且有意义的动画图3:原则三大设计体系突然发现苹果并没有给自己的设计体系起一个专门的名字~可以发现虽然设计原则三个公司各有不同,但几乎都是从通用的设计原则上进行提炼和优化。您是否需要设定自己的设计原则来构建设计系统?我认为没有必要。设计原则固然重要,但也可以在系统设计初期遵循已有的基础和通用设计原则来指导整个系统的构建。总比随便从基础的、通用的设计原则里抽出一些词来润色,干脆堆上一些高级词,白白放在那里,等着慢慢变成别人口中的“玄学”,正确的?因为原理是设计系统高度抽象的结晶,所以需要根据大量的实际设计经验生成,否则很难引导设计系统达到提高效率的目的。2、设计风格及规格设计风格是本设计系统形成的具有代表性的图形印象。设计规范是协调统一的规则和范式。在60年代的《美孚品牌手册》和70年代的《NASA 图形使用规范》中,包含了“颜色、字体、图形、用法和示例”之类的内容。图4:设计规范拥有设计风格和设计规范并不一定能让采用这种设计体系的产品建立统一的品牌基调。只有当设计体系具有一定的辨识度设计风格,并以设计规范为导向时,采用该设计体系的产品经过长期的设计输出,才能形成统一的品牌基调。3、设计组件和模式对于设计系统来说,最熟悉和常用的设计组件应该是设计组件,即UI工具包,包括输入框、按钮、文本、链接、下拉菜单等。构成界面的最小元素和这些元素的公共集合。图5:UI套件设计模式比元素更复杂。它们是用来完成任务的一些基本的、常用的交互方式,是可以解决问题的小设计方案。例如Materialdesign中的Confirmationandacknowledgement,提供了一系列设计方案,让机器在执行操作前向用户确认。图6:设计模式简单来说,设计组件就是一些元素,主要是给设计人员看的,设计模式是一些交互方式,主要是给研发工程师看的。因为两人很像,所以现在更多的人会把两人放在一起看。2013年,前端工程师BradForst将原子理论应用于界面设计。形成设计体系后,设计组件进一步扩展,形成比设计模式概念刚出现时更高层次的聚合体。例如,大型的几个完整的页面及其包含的交互也可以是设计系统的组成部分之一。当然,由于每个产品的需求、场景、定位不同,复合的组件越大,也会越复杂。图7:原子设计理论4.内容资产在一些设计系统的定义中,内容资产可能被认为是设计规范的一部分,但我想在这里强调的是,它们是资源的一部分。由于设计系统是一个有机的整体,在持续服务于各个产品线的同时,也需要不断地填充不同的内容,比如应用中使用的图标、字体、插图、模型等。这些内容积累起来,也应该成为这个设计体系的一部分。如有其他应用或产品需求,可直接使用,提高整体工作效率。常见的内容资产包括图标库、字体库和音效库,它们为不同的产品或应用程序提供了多种图标、字体和音效。插画风格、三维风格留下来,以后必然会有插画库、模型库、文案集等在属于某个设计体系的产品中经常使用的。图8:内容资产5.工具和流程主要针对设计系统适用的特定环境。在协同的要求下,我觉得需要包含在设计系统的内容中。举个简单的例子,如果你用BlueLake做自动标注,团队会统一用BlueLake,而不是有人用BlueLake,有人用MockClear。6.设计语言和设计指南还有两个概念经常被提及,而我刚才画的设计系统图中没有提到。设计语言:语言是一种可以实现相互交流的符号系统。人类学家索绪尔认为,语言可以反映多变的言语活动背后的稳定规律。所以,我觉得这里的设计语言应该等同于设计规范,是设计规范的另一种表达方式。DesignGuidelines(设计指南):根据中文翻译,我认为是解释和介绍设计部门的文件,不属于设计体系。常见问题最后,设计系统词云中出现的玄学、理论化、灰烬、空中楼阁……这些都是创建设计系统时容易遇到的一些问题,尤其是最实用的设计元素,首当其冲。之前我组织我们团队的设计师做了reviewworkshop,大家针对设计系统的设计组件提出了20多个问题。图9:设计组件评审工作坊一般来说,设计系统中常见的问题有以下三类:1.定义性问题从0开始,每一次更新和迭代都需要对当前团队来说既关键又有效。关键是设计系统当前定义的内容是后续产品线经常使用的内容。有效是指这些定义所定义的内容可以利用现有资源完成,即利用现有团队的能力、时间和资源。设备可以完成并达到它的效果。2.可用性问题列表不清晰,文档不完整,包含的资源不完整。这些都是使用过程中出现的问题。如果把设计系统看成一个产品,让用户(设计者或开发者)轻松使用是不会被搁置的解决方案。3.协作问题。不知道有更新,收不到反馈,不知道用户情况……协同问题催生了蓝湖、Mockoff、墨刀等云服务功能,Codesign和市面上的很多设计软件一样。等待。虽然市面上有很多优秀的设计系统可供参考,但是存在的理由中提到,因为是为了帮助我们自己的团队更高效地工作,所以还是需要我们结合实际情况自己去做。种类。
