到底什么是石家庄VI设计系统

2020-10-11 17:32:50 28

我写了一些有关设计系统的文章,但是许多朋友一直在问什么是设计系统。 今天的文章将进行详细的聊天。 我希望阅读完后,每个人都能对设计系统有一个全面的了解。

文章分为两个部分。部分是设计系统的发展历史,顺便聊一聊“Why”的问题;第二部分为设计系统的组成,也就是“What”。至于如何建立设计系统,“How”的部分,涉及到的知识较多,后边会专门写文章慢慢展开。

发展历程

20世纪60年代,软件行业进入爆发式的增长阶段,原始的开发模式已经无法满足大量的开发需求。为了应对这一问题,Douglas McIlroy在1968年的NATO软件大会上提出组件式开发的解决思路,从而提高工作效率,并产生更加规范的应用软件。

1977年,建筑设计大师Christopher Alexander在他的经典著作《A Pattern Language》中确立了设计模式(design pattern)的概念,同时提供了253个设计模式语言,他指出:

每种设计模式都针对某个在我们的环境当中反复发生的问题进行了描述,并提供了相应的解决方案。

设计模式的提出,是设计行业对组件式设计的思考,为设计的标准化和规模化提供了基础理论。

很快,软件行业就引进了设计模式,并成为界面设计的法则。2006年,Jenifer Tidwell在她的著作《Design Interface》中,对界面设计的模式进行了总结。界面设计模式是重复出现的设计元素的集合,它定义了这些元素的行为方式、外观以及代码构成。
undefined
2010年,随着移动互联网的爆发,各种设备层出不穷,界面设计面临着跨平台、多尺寸的自适应问题,原始的设计方法已经无法满足大量的设计需求。

2013年,一个叫做Brad Forst的前端工程师给出了他的解决方案。脑洞大开的Brad从高中化学知识中,提出了“Atomic Design”理论,即一种分层有条理的创建模式库的方法。原子设计理论融合了软件开发的组件式思想,设计领域的模式库和化学界的分子构成,完美的解决了模块化和规模化的问题。
undefined
很多公司开始运用原子设计的理论搭建自己的模式库,设计系统也即将问世。
2014年,Google的Material Design横空出世。它不仅有完整的模式库,还提出了自己的设计原则,这些原则由基本原理所构成,再搭配上风格指南,形成一套完整的设计语言系统。
undefined
由此,设计系统风靡全球,IBM,Airbnb以及SAP等公司,都按照这个思路搭建自己的设计系统。
2016年,蚂蚁金服技术体验部推出Ant Design,成为国内设计系统,从而在国内也掀起一股浪潮。
undefined
到今天为止,设计系统蓬勃发展,有网站专门进行了收集整理,全球已有500多家公司发布了自己的设计系统。
undefined

在2010年,随着移动互联网的爆炸式增长,各种设备陆续出现。 接口设计面临跨平台和多种尺寸的自适应问题。 原始的设计方法无法再满足大量的设计要求。   2013年,一位名叫Brad Forst的前端工程师给出了他的解决方案。 从高中化学的知识出发,有头脑的布拉德提出了“原子设计”理论,这是一种创建模式库的分层方法。 原子设计理论将基于组件的软件开发思想,设计领域的模式库以及化学领域的分子组成相结合,完美解决了模块化和规模化问题。

设计系统

我们从定义开始,看看设计系统都有哪些内容构成。

首先解释一下“系统”的概念。
在《系统之美》这本书里,对系统是这样定义的:

系统是一组互相连接的事物,在一定时间内,以特定的行为模式互相影响,例如人,细胞,分子等。

任何一个系统都包括三种构成部分:要素,连接,功能或目标。

undefined   



从 定义可以看出,不仅仅要关注系统是由哪些部分组成的,还要关注这些部分是如何连接在一起的,它们的关系是什么样的。
那什么是设计系统呢?
根据系统的定义,我们试着总结一下设计系统:
设计系统由设计语言和模式库构成,在设计原则的指引下,通过统一的协作语言和科学的管理方法组织起来,创建体验一致的用户界面。
拆解一下设计系统的三要素:

组成:设计语言和模式库

连接方法:设计原则,协作语言和管理方法

目标:创建体验一致的用户界面

下面逐个分析。

设计语言

语言是我们用来交流的工具,设计语言其实就是产品与用户交流的工具。它是设计系统的基础,与品牌识别和情感相关的,包括颜色,文字,布局,图标和动效等等。

   

 

 

 

 


模式库



模式库,也叫做组件库。它包含了各种模式及其使用方法,代码构成等。模式库可以根据原子设计理论来进行分层,如组件,区块,模板等。



undefined  




设计语言和模式库是设计系统的主要组成部分,目前市面上大多数设计系统都是由这两部分构成。然而这并不是全部,它们背后是如何连接的才是核心。
设计原则

设计原则在上一篇文章  你为什么需要设计原则? 中已经详细介绍,它为设计决策提供核心价值,为设计提供向导,从而明确设计方向,统一设计风格。

设计原则是设计系统的灵魂,Google的Material Design正是在其设计原则的加持下,才显得。
undefined   



合作语言

协作语言可以帮助所有人以相同的方式理解设计原则、品牌愿景、产品目标及信息架构,并对设计模式的特质及使用方式形成共识的语言标准。

在“建筑的永恒方式”中,协作语言的评估如下:

一个小组,就像拥有相同的思想,通过遵循相同的模式语言进行协作,终使那些宏伟的建筑站起来。

因此,团队中的每个人都必须使用相同的语言进行交流。 例如,必须同意所有组件的命名,以便在进行交流时,不同的位置(例如产品经理,前端和后端)可以相互理解。

管理方法

管理方法主要包含三个方面:管理团队,反馈机制和维护流程。

管理团队是指由谁来管理设计系统?一些比较大的设计团队,比如salesforce,会设立团队来专门负责设计系统。小一点的团队没有那么多人,可能是由比较的设计师兼职负责。
无论是专业的团队还是兼职负责,你必须有一个完善的机制,来维护设计系统。因为一旦停止维护,设计系统就会失去其意义。
反馈机制要解决的问题是:用户是谁?设计系统是给谁用的?设计师、产品经理还是前端开发人员?他们如何学习设计系统?说明文档、视频教程还是定期培训?他们遇到问题如何反馈?有没有反馈库?或者论坛,实时通讯工具?
反馈机制是维持设计系统的必备因素。无论是前期推广还是后期维护,没有合理的反馈机制,就无法展开设计系统的应用。
维护流程是指设计系统在应用之后,如何维护更新,如何协同。
如何更改样式?修改样式的流程是什么?谁来提交修改申请?是否进行评审?谁来批准样式修改?
如何在产品经理,设计师和前端开发之间同步样式?样式修改之后如何同步给使用者?前端代码如何同步?已经应用了该样式的产品如何同步?
各个工作流之间如何协同?用sketch还是Xd,或者figma?产品经理是不是要单独维护一个Axure库?和前端之间如何协同?
维护流程是设计系统良好运转的基础,合理的维护流程会提高协作效率。

,小结一下。

设计系统是在模块化和设计模式的基础上发展起来的。
在2010年移动互联网的爆发,带来了屏幕尺寸和界面尺寸的爆发式增长。为了解决一致性和效率的问题,由模式库逐渐发展成为设计系统。
设计系统由设计语言和模式库构成,在设计原则的指引下,通过统一的协作语言和科学的管理方法组织起来,创建体验一致的用户界面。
设计语言是设计系统的基础,与品牌识别和情感相关的,包括颜色,文字,布局,图标和动效等等。
模式库,也叫做组件库。它包含了各种模式及使用方法,代码构成等。
设计原则为设计系统提供向导,协作语言帮助所有人以相同的方式理解和交流,再通过科学地管理方法,包括团队,反馈机制和维护流程等,将设计语言和模式库连接起来,以实现系统的目标。
undefined

河北米粒文化传播有限公司专业进行石家庄品牌设计,石家庄VI设计,石家庄食品包装设计等设计方案,我们对品牌的信仰,让用户为品牌视觉价值买单塑造品牌价值 建立形象标准降低运营成本 视觉营销实践


Contact Us
联系米粒,
用品牌为商业赋能!


做设计直接找总监聊

即刻联络

河北省石家庄市桥西区塔坛国际6号写字楼1303室

咨询热线:151-3006-9896

总监直线:17610266809 
咨询邮箱:575612813@qq.com
招聘邮箱:business@melii.cn