经过周末两天和今天的整理，系统的视觉设计规范终于完成了初稿。
以前也做过视觉规范的制定，但都是小规模的规范，制定起来相对简单一些。这次的视觉规范由于涉及到了招标和投标两个平台，平台属性和功能并不完全相同，但又有很多通用的地方。在设计的时候需要全局规划，要做到两个系统既可以通用，又要体现出差异化，还要考虑到后续如何移植到不同的项目，不同的风格，配色如何扩展。导致最终的复杂程度远远超过想象，所花费的时间也比预估的要长得多。
首先是对色彩的规划。一个复杂的界面中需要用到颜色的地方有：导航背景色，二级导航背景色，当前导航指示器背景色，页面背景色，卡片背景色，按钮背景色，鼠标悬浮时按钮背景色，点击时按钮背景色，输入框边框色，选中时边框色，主要文字色，次要文字色，提醒文字色，警告文字色等等。如何将这些颜色进行合理的安排，使得整个界面的整体显得统一和谐，同时有可以凸显重点？经过一系列方案的对比和研究，最终选用一个主题色，其他颜色都围绕主题色的方法，使整个界面达到了统一。将这些不同明度和饱和度的颜色放在一起，组成一个色板，明确每个颜色用到的位置，就可以很容易生产出一个和谐的新界面。最后，通过替换色板主题色的方式，就可以迅速形成另外的色板，从而切换到不同的风格。
其次是对于组件的整理。将界面元素进行细分，分解成一个个的组件，比如输入框，下拉框，弹框等。之后针对每一个组件，去梳理它的不同状态，正常状态，激活状态，点击状态，禁用状态等，对每一个状态进行设计。最后，对组件的尺寸进行整理，分为正常尺寸，大尺寸，小尺寸等，保证在不同的布局中都有相应的尺寸可以使用。这样下来，形成了一个组件库，只需要从组件库中拿出需要的组件，根据不同的尺寸就可以组合一个界面，并且不会遗漏不同的状态。
反思：设计规范的意义是什么？通过这几天的整理，对于这个问题有了一点思考。
首先，设计规范是对于设计的全局思考。就像装修一样，如果没有全局的思考和规划，只去考虑每一个区域的风格，最后出来的效果可能就不伦不类。只有在一开始的时候就去思考，设计的整体风格是什么样的，局部的设计如何与整体保持一致，细节上如何与整体保持一致，只有把这些事情都想清楚了才能保证最后出来的效果。
其次，设计规范是构建系统的基础。就像乐高积木一样，在设计每个基础组件时都要考虑它在整个系统中的普适性和可扩展性，它们可以很方便的组合起来，同时又要保证其他的元素也能方便的融进来。这样在设计的时候就要考虑哪些要设计成可扩展的，哪些是要定死的，哪些要写进基础规范，哪些写到具体的组件中去。只有通过不断的思考和尝试，才能得出最优的方案，从而打造一个坚实的基础。
最后，设计规范是标准化走向定制化的桥梁。“一生二，二生三，三生万物”，从零到一的过程是最难的。但是只要形成了一套完善合理的设计规范，那么在这个基础上进行扩展就变得很容易了。以后需要设计不同的风格时，只需要将目前的组件重新换一个风格就行了。
网友评论