色彩规范
色彩规范一般包含品牌色、辅助色和中性色，在B端产品中，颜色除了迎来传达品牌调性，更多的用来传达一些提示或警告，通过不同的颜色给予用户信息反馈，不同的状态运用不同的颜色展示，比如：
绿色通常代表成功、已发送、已签到等状态；
红色通常代表失败、未发布、未签到等状态。
另外，通过颜色可以对内容进行分层级展示，提高用户阅读信息的效率。
品牌主色
一套产品只有一个品牌主色，是界面中出现最多的颜色。在需要用色强调而且没有其他要求时，一般都会选择主色。
网络上很多人说B端产品大部分用蓝色或者偏冷色系作为主色，可以带给用户一种严肃冷静的感觉，但在工作日常中，很多企业会要求颜色必须是公司的品牌色。
例如当前任职的公司品牌色是饱和度较高的紫色，那么在定主色时，我们就不能跳脱这个色彩范围，在这样的情况下，我们可以考虑将品牌色饱和度降低或者用其他暗色系的颜色进行搭配，从而在观感上尽量显得不是那么刺眼，降低用户眼睛疲劳度。
辅助色
用于提示其他场景，比如：成功、失败、警告、无效等，辅助色主要是帮助用户高效获得信息。
中性色
常用于文本、背景、边框、分割线等。 字体规范
在B端的设计上，文字的字体，字重，字号，行号、颜色用来区分界面信息的层级关系。
字体
中文字体一般用苹方体、思源黑体、微软雅黑，英文字体一般为Helvetica Neue、思源黑体、微软雅黑。
字号
系统中字体大小为：12px、14px、16px、18px、20px、24px、26px、28px、30px、36px...
在开发中，浏览器最小字体一般为12px，注意设计中不可以低于最小字体设计。
行高
行高上，可以采用行高=文字大小+8px，例如14px字体，则14px+8px=22px，则行高为22px。
字重
通常采用regular、medium、semibold三个字重。
颜色
目前最常用的字体颜色是#333333、#666666、#999999，区分标题、正文、辅助文字，具体可根据设计进行调节。
图标规范
在B端设计中，图标要简洁易懂，用来帮助用户更快导航，提高用户使用产品的效率。
在绘制完图标后，可以存储成svg方式上传至Iconfont，这样方便和开发进行对接，也可以打造自己的图标库，在后续的项目中，方便直接运用或修改。
布局栅格
B端系统的主流分辨率主要为1920、1440和1366，个别系统存在1280的显示设备，通过适配布局来完成在不同分辨率下展示内容。
一般选用24栅格布局，不同栅格结构中栅格区域也会有所不同，固定区域会存在于响应式网格之外，不随着页面的变化而改变大小。
组件规范
B端组件库的建立，常用的组件包括按钮组件、面包屑、导航菜单、分页、下拉控件、上下左右滑条、日期选择框、单选复选框、树形选择、标签页、输入框、表单、上传样式、气泡卡片、表格列表、警告提示、弹窗等。
【版权声明】本文系转载，原文来源公众号Clip设计夹，作者：Fix。转载目的在于传递更多信息，并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题，请在30日内与联系我们，我们会予以更改或删除相关文章，以保证您的权益!
|
