标准化之路：关于产品设计规范

Suer 记得很久之前看过朗咸平的<模式>，书里介绍了时尚快消品牌ZARA的“一条龙”服务，当时的我被惊呆了，符合企业实际情况的生产设计规范帮助ZARA一步一步建立自己的时装帝国。

还有各种咨询公司建立的6-Sigma等等规范，统统都是为了提高生产力而制定的标准。
早在两千多年前，秦国统一六国后，实施了书同文、度同制、车同轨、行同伦。当时制定出了（我认为）最早的一套产品设计规范——度量衡，还有车轮间距标准，这些东西都让秦国更好的运作起来。

国家尚且如此，那作为产品设计人员的我们又该如何？
互联网行业的产品设计规范，大概就是将产品的一切交互行为、视觉样式都要严格遵从可用性原则，并根据公司业务目标，制定出涵盖公司产品功能范围内的所有相关控件与相应的展示样式。

这等于定义了如何帮公司设计出一个好的产品。无论你的网站或app多漂亮多流畅，却无法帮公司赚钱——穷死；产品只为了赚钱而忽略用户体验，那就缺乏竞争力，衰败也就是时间问题。这是老生常谈了。

设计规范的意义

指导性

什么是好的设计规范——团队成员能高效地制作出既满足业务需求，又能让用户轻易完成目标的产品。每个公司或者团队，到了一定阶段，都需要产品设计规范来突破瓶颈，提高效率，改善产品，让产品和团队都能够轻装上阵，走得更远。

意味深长与历久弥新之美，蕴涵于简约之中，于清晰之中，于高效之中。真正的简约远不止是删繁就简，而是在纷繁里建立秩序。——Jonathan Ive

iOS 7的图标设计规范

在定义产品需求，讨论布局的时候，设计师经常会被非专业人员“指点江山”。或许大家都对用户体验有一定了解，而且都是一心为了产品好，但是体验设计 需要像血液一样渗透到产品的每个部位，那可不是随便脑暴几个想法就能解决的。设计规范凝聚了设计师们用血换来的经验，对产品与使用群体的深刻理解，还有结 合实际使用场景的综合分析。实施规范之后，大家就能各安其职，当然，是在理想状态下……

有效性

规范必须是有效的——一个连按钮的点击效果都没的规范是毫无用处的。从有效性这个角度来定义规范，其实就是产品各种已有模式或模板的集合。我们需要 根据产品的业务目标来得出产品功能需求，然后根据用户目标和使用场景，穷尽所有可能性，制作出合理且可用的模板和组件。
这样做出来的东西才敢说是可以用的，合理是前提，有效是结果。

然后，该如何穷尽所有可能并逐步制定规范？那就要我们加深对公司产品目标的认识，参考先进竞品，听取反馈意见，总结过往版本的不足等等，完善已有的模式，或创造出更优秀的。
例如，”赞”这个功能已是产品社交化所需的基本元素，用户通过操作”赞”按钮，可增强与产品本身、还有共同用户之间的互动。

就算你很美，就算你会自动消失，也只是一个弹窗。
以前的操作反馈总是过于简单粗暴—-直接弹窗告诉用户”操作成功！”。我一直觉得这就像给了用户一巴掌。
现在的技术日新月异不断进步，因此我们可以设计出非常优雅的效果。

tumblr的“赞”

在设计规范的过程中，我们需要思考一切可能：通过操作”赞”按钮，用户应该获得多少种反馈？是否真的需要这些？全部情况都考虑到了吗？如果服务器出 错或代码效率低，导致反馈有延迟，是否需将反馈改为提前量？例如Instagram，用户点赞后，它不管用户有无网络，都先用可爱的动画反馈告诉用户已操 作成功，然后才后台检测网络是否可用并发送数据。

在思考用户的使用场景和习惯的同时，公司自身的产品后台也要照顾得当，并需要作出适当反应，例如这个赞的数据应归类到哪里，运营同学对此有无更多的 需求，未来会否添加更多的接口？开发同学需要有所准备，以应付突如其来的”需求”，就算开发部没有相关规范，也应了然于胸，或者直接加入到产品设计归范。

可复用

设计必需是简洁且而优雅的，才能历久弥新。——Smashing Magazine

设计可以在各分枝系列产品里重复使用，这正是设计规范的精髓，不能复用的规范不是好规范。

可复用的规范对公司和产品来说有啥好处？

• 对视觉设计师来说，按钮只需要有限的若干尺寸样式，不同产品线或功能点只需换个颜色甚至直接套用。网格系统、页面头部更是全球唯一。
• 对于前端工程师来说，只需要像Bootstrap一样，根据视觉规范制作出1份CSS文件，全站都引用此文件即可，不同产品各取所需，特殊情况也只需定义少数代码即可。
• 对公司来说，上述两位同事都提升了效率，那公司的整体效率当然就更上一层楼了。另一方面，如果有人员流动，简洁的规范也能让新同学迅速上手并融入产品设计团队，同时降低了公司的风险和损失。
• 对用户来说，简单的几个样式A穿整个产品，既降低学习成本易于使用，也能让用户更专注于内容，这就是用户体验的重要原则”一致性”，相关文章很多，这里就不作展开了。

当然，以上都是在理想状态下……

LESS和SASS是前端工程师的规范化利器（图片来自Dribbble）

约束

规范本身没有约束或局限性，约束往往来自人。——我说的

规范本身的约束

很多同学看到规范就会说，次奥，太落后了，怎么老用这东西来弄？
呵呵，骂得好。
谁让你弄个古董级的规范出来？谁让你一成不变？上面也提到了，设计要简洁、高效！这才能迅速迭代，不断改进。制作规范的过程，本来就是一个优化和沉淀的过程。
好的设计归范还需要站在一定的“高度”来定义产品，“高度”要控制得当，不能太笼统——泛泛而谈说了等于没说，也不能太细致——很多专题或者独立产 品需要自己的空间。正所谓”站得高，看得远”，具备一定的前瞻性，才能指引产品走得更远。不与时俱进，使用先进的效果和技术，也很难说服同事们采用我们的规范。

规范之外

设计规范所面临的约束与局限，不一定来自于设计本身，而更多的是来自于“人”。
例如，在A页面有一个图片轮播模块，是前端工程师1和视觉设计师2设计的，然后在同一级别的另一个页面B也需要同一个模块，负责这个页面的前端3和视觉4都一致认为：我也能写/画出来，不需要套用已有代码/PSD。

好的，我知道你们很优秀，这是无可否认的。但是最牛逼的大师通常都是深藏功与名的，前端大师能够写出让设计师都能看懂的代码，让后继者看到犹如自己写出来的代码，这才叫Zen Coding；视觉大师直接发明轮子的替代品，而不需要用现有的轮子。
我说得够明白易懂不？

Dieter Rams, 1964, Braun FS80 TV

时机

总而言之，产品设计规范不但需要做，还需要适时地做，一旦完成，就要贯彻执行，接收反馈，总结不足，不断优化。磨刀不误砍柴工啊。
规范化不是闹革命，因为一不小心就会革了产品的命。在产品本身还没准备好的时候推出，只会增加负担，降低效率。
规范化是“进化”，在产品不断的迭代过程中沉淀积累，最终形成的一套优秀的设计方法。

题图来自Dribbble
投稿人：Suer
原文地址：make it simple