设计体系和设计规范是一个东东么?

最近看了一本实用性很强的书,恰好也正在做这个。因为时间刚刚好,因为书刚刚好,因为抠脚大叔也刚刚好(深情状),咳咳,大叔在甚为兴奋的状态下很快的读了一遍,后来因为要做分享,所以又多读了两遍,每一次读都有不同的理解和感悟。但总结一句就是:规范也好,系统也罢,我们要记住做这件事的最终目的是为了提高团队效率,服务于最终产品,形式方法都可以因地制宜。后面附了这本书的中文翻译链接,希望大家也能有所收获。(因为是总结感悟,所以不做过多剧透)

Smashing Magazine上可以购买:

https://www.smashingmagazine.com/printed-books/design-systems/

总结的话写前头:

1、此书所探讨的是如何以体系化的方式推动设计流程,以及如何围绕特定的产品目标及团队特质来构建设计体系。

2、设计系统由多种模式、组织架构、团队文化、产品类型、设计流程等构成,其中设计模式就是我们所要探寻的重点内容。

3、设计模式不是设计规范,传统的设计规范就是字体、颜色、icon等更偏重于风格的定义。而设计模式指的是任何可复用的界面组成要素。在抠脚大叔理解看来,模式不是抽象的,而是你具体的业务和产品,例如:登录注册在每个产品里都有,但你的产品可能因为某种原因,一定要在注册的时候提交头像,那么你就可以基于你的产品来构建一个注册模式。

之前走过的路

我相信很多人跟抠脚大叔一样,给公司做过设计规范。翻阅之前的历史,从1.0.0到今年的4.0.0,总共迭代了4个版本,但其实大的改动也就是两个版本。第一版建立的时候,抠脚大叔是辅助,主要是公司一个设计师弄的,她用ps建立了公司最初的一版设计规范。当时只有两三个人,稍稍看看,记下几个关键色值就行了,规范问题也很明显:

1、基础规范仅适用于阅读,无法直接取用。

2、控件、组件、部件混在一起放在规范里,部件经常根据业务变化,导致规范变动频繁。

3、整个规范,不利于协作、维护、迭代,但因为当时人就两三个,这个问题暴露的也不明显。

所以抠脚大叔在2.0.0版本的时候,根据使用情况优化了几点:1、将文档和Sketch源文件分开,文档供查看,Sketch源文件供直接使用;2、将基础控件和业务控件分开,所谓的基础控件就是系统控件,如弹框、toast这类,业务控件,就是基于业务场景所沉淀下的控件;3、增加修订记录。现在看看,问题也是有的:

1、修改麻烦,改动一处需要更新两个文件;

2、协同工作效率差,更新需要通知其他人,不然会造成信息不对等;

3、业务控件越来越多,差不多的场景样式各式各样。 

这些是不是我们很熟悉的设计规范?字体、颜色、icon、控件等规范出来,基本上就是一个设计团队所拥有的所有标准了。我们所定义的基础控件,无非是将iOS和Material Design的控件做一个筛选,后来Ant Design出来后,我们因为有些页面是Web实现,结果变成,我们基础控件就是在三个平台之间寻求一个平衡,稍加定义让其更加符合我们的产品需求。

这本书的启示:

我们在设计什么?

其实在2.0.0版本做的业务控件,就是有意识在设计的时候把一些做过的页面收纳总结起来了,这样不用在同一个问题上,反复想解决方案。模式库存在的意义也是这样的,我们产品有四五十个功能,六个设计师同时在不同功能上做设计。谁能保证设计一个信息展示页面,大家能设计的一模一样?但是,虽然信息展示页面面对的业务可能不同,难道就不能设计成一样的么?书里说到,同样的信息架构,同样的功能,我们都可以将之归为同一个设计模式,尽管在不同业务场景可能有不同的外观需求和行为方式,但那只是模式的变体,而非不同模式。

收集的一些列表页面

我粗略的收集了一些列表页面,当然,列表只是它们的表现形式。而它们有的目的就是类似于小区公告栏一样信息展示。按照书中所写,我将页面按功能分类,分解它们的信息架构,给这个模式取了一个好记的名字“橱窗列表”,如下:

橱窗列表

为什么叫橱窗列表?起名在书中说了,要好记,跟功能挂钩,比起列表1、列表2而言,橱窗列表显然让人更容易记住。

所以回到最初的问题:我们在设计什么?

抠脚大叔认为,我们要理解真正的需求,设计不只只在解决问题,他还要看到真正的问题。就像现在大厂动不动就喜欢搞一套大而全的功能控件库,其实在某种程度上确实减少了我们做不必要的重复工作,我们要将更多的重心放在理解用户和需求上。

我们是什么样的团队?

什么样的团队,什么样的组织结构其实也影响着我们的设计体系。具体体现在设计体系的三个方面:实践规则(严格、松散);构造方式(模块化、整合化);管理机制(集中式、分布式)。(翻译取自译者C7210,文后附链接。)随后书中举出了Airbnb、TED和Future Learn的例子,

 维度划分

这个抠脚大叔很有感悟,一开始建立规范的时候,就有团队成员担心规范过于细致会影响设计师的发挥。但是在书中的这一章写的很清楚,规范也好,模式也罢,最终目的都是为产品服务,包括团队的风格建设,我们可以根据自身需求量身定做属于自己团队的设计体系。

最后的话:

其实还有很多小点我没有写下来,原因怕文章太长太啰嗦,其他的就靠大家自己去看看了。我只把我认为最重要的写了出来,谢谢阅读。

翻译版链接:

https://mp.weixin.qq.com/s?__biz=MjM5MDc0MDIyMA==&mid=2650619728&idx=1&sn=292caed44c7f985ca52ab0c18f357c7f&chksm=be49a4c3893e2dd57d13f23a8d0cdecb28ab3e2c67b37b894628e4e7670cdb263b0e98187cbc&mpshare=1&scene=23&srcid=1219sCj6pDPxJkDz68x1pt9o%23rd

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,921评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,635评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,393评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,836评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,833评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,685评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,043评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,694评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 42,671评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,670评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,779评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,424评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,027评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,984评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,214评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,108评论 2 351
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,517评论 2 343