认识达内从这里开始

对于任何一个设计师来说，ui设计规范是每一个设计项目实施过程中都需要遵守的条约之一。而今天我们就通过案例分析来了解和学习一下，后台开发中的设计实施方法都有哪些。

设计规范存在的目的

1、多个设计师同步设计

大多数是因为同一个项目存在多个设计师横向合作设计，以避免同一项目出现设计控件混乱问题。

方便把控视觉统一性，提高效率，减少返工率。

2、提高开发效率、减少返工率

以及纵向到前端开发他们有了规范的约束后，在开发项目中会大大提高设计稿的还原度，以及规范建立他们自己的控件库，提高复用率，减少返工的成本，如果做了规范，程序员从视觉规范中了解到哪些控件是可以一次性写好并能重复调用。在规范的辅助下，开发在搭建全局共用控件时规则更加清晰明了，如按钮、行间距、字体大小、色值等等。

3、辅助设计及开发理解业务

如果产品经理在画原型图的时候能够大概遵循设计规范的交互以及排版格式会减少开发再看原型图和设计稿之间产生歧义，产品原型图不需要精确，只需按照项目既定的规范排版即可，这样既不会给产品造成过多的工作量，也方便了开发查看文档。

4、方便产品迭代

产品在设计过程中，经常会得到经过市场检验或者由用户反映体验相关的一些问题，这时需要调整某些规范的控件交互或者显示方式，有了设计规范开发可以快速定位控件位置，并根据新调整的样式项目整体调整，大大提高了工作率。这样统一修改的方式不错出现，A页面与B页面统一控件用了两种不同的显示方式。

如何开始着手整理规范

对于我们设计师来说一次在评审会上面对一个全新产品的时候是非常迷茫，听着各种功能逻辑，各种解决方案。懵逼状态(嘘………)在项目还没开始之前，大多数公司的设计是无法有机会和时间参与到前期的调研和竞品分析工作中去的。这个时候我们就应该带着自己更多的疑问去问我们的上游产品经理，我们的用户群体是谁、年龄段的范围、是什么样的产品、解决用户的什么问题等等。

对于落地实现我们需要清楚开发适配的分辨率是多少(后台系统一般基于1920*1080尺寸做，然后适配1366*768的屏)，对于某些行业还会考虑到用户使用的显示器(你永远不知道你的甲方爸爸是在什么的环境和情况下使用)，将我们能想到的各种因素都考虑进去，让返工率降到低。

在我们了解清楚项目的背景之后，就可以开始定位产品的设计风格，根据产品原型出几张产品风格前期定位的示例设计稿，主要包括项目的主体界面风格包含颜色、按钮、表格、表单、弹框等相关样式的提现。出这些前期的示例页面是为了方便组内讨论以及跟领导展示到后的敲定。

颜色

主色调的选择，一般根据用户群体、用户使用场景以及产品的定位来进行思考和选取。当然对于后台系统来说系统可做皮肤功能的扩展，给定用户一个基础的色调，然后做几套配色好的皮肤，让用户可以自由选择。对于公司来说一个项目可能会兼顾多个客户，客户都想要根据自己品牌色来做自己的系统，拥有多套可选择的方案也给后续维护和销售提供了便利。

标准字

后台系统在字体选择上都比较单一，中文：微软雅黑、英文：Arial即可。只是注意在给前端开发培训规范的时候重点提醒他们需要做字体样式的重置，不然当你后期走查界面的时候一个页面同时有宋体、有微软雅黑强迫症严重受不了啊，会非常影响看界面的心情。体会过走查这一步的设计师都懂。

图标

图标现在几乎不用切图的方式去做了，都在是制作完成后上传到阿里巴巴的字体图标库中。前端调用方便调整大小和颜色也方便，关键是怎么处理都不会失真。

页面布局框架

我们在设计过程中，还需要考虑我们基于什么样的尺寸进行基础设计。划分哪些区域需要固定尺寸、哪些需要做适配、菜单是否支持收缩功能等等。据统计，使用中系统的用户的主流分辨率主要为 1920、1440 和 1366，个别系统还存在 1280 的显示设备。具体适配低和高分辨率也可根据你的用户使用情况来决定，我们一般基于1920设计，下限考虑1366的分辨率即可。页面包括顶栏、页签、各应用左侧菜单、主体内容等区域。各系统有部分差异根据自身情况来定。

【免责声明】：本内容转载于网络，转载目的在于传递信息。文章内容为作者个人意见，本平台对文中陈述、观点保持中立，不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。