后台系统设计

后台系统界面中有哪些部分组成？
注册/登录页面默认主页
各个栏目2级页面（根据功能原型图去设计）
辅助页面（404出错页面，弹窗浮层等）

订制后台系统设计统一规范等目的：规范后台系统等风格，使最终设计出来等界面风格一致化，遵循统一操作规范，以标准化等方式设计界面，提高工作效率。减少和改变责任不明，任务不清和由此产生等信息沟通不畅/反复修改/重复劳动/效率底下等现象。产品设计通过规范的方式来达到以用户为中心的目的。

设计是需要遵循的基本原则：
1.显示信息一致：无论是控件使用，提示信息措辞，还是颜色，窗口布局风格，遵循统一的标准，做到真正的一致。

2.以用户为主导，明确用户是所有系统处理的核心

3.易用性：用户不用查阅帮助就能知道该界面的功能并进行相关正确的操作。做到望文知意最好。

4.系统相应时间：0-5秒鼠标显示成为沙漏；5秒以上显示处理窗口，或者显示进度条；一个上时间的处理完成时应给予完成警告信息

5.出错信息和警告原则：信息以用户可以理解的术语描述；信息简明扼要，指出出错原因并提供解决办法提示

6.信息显示：只显示与当前用户语境环境有关的信息；使用一致的标记，标准缩写和颜色，显示信息的含义应该非常明确，用户不必在参考其他信息源；

7数据输入；尽量减少用户输入动作的数量，维护信息显示和数据输入的一致性，可能的话提供默认值，绝不要让用户提供程序中可以自动获取或计算出来的信息

8.合理性：与正在进行的操作无关的按钮应该加以屏蔽（使用灰色显示）；对可能造成数据无法恢复的操作必须提供确认信息，给用户放弃选择的机会；非法操作或输入有足够的提示说明

9.美观与协调：界面风格要保持一致，字的大小/颜色/字体要相同，除非是需要艺术处理或者特殊要求的地方；如果窗体支持最小化和最大化或放大时，窗体上的控件也要随着窗体而缩放，切记只放大窗体而忽略控件的缩放。

问自己3个问题：
1.这个页面中什么地方最吸引你？
2.你认为这个页面作用是什么？
3.当你使用这个页面是否会使用他提供的功能？

界面的设计风格

纯白背景风格
主要风格特点背景是纯白色，线框是清淡灰色为主或者内容的背景是浅灰色的，文字一般是黑色或者相似的深色。

清淡的背景风格
这类风格的特点：背景是浅色，内容的背景是纯白色，文字一般是黑色或者相似的深色。

深色的背景风格
这类风格的特点：背景是深色系，内容背景是带有不透明度的浅色，文字一般是白色。

对于清淡色的hsb色值，可以参考：H:0-360；S:0-5；B90-97当然没有绝对，大部分情况用的浅灰色是最多的。

界面设计规范：

界面分辨率：我们设计的时候并没有说一定需要固定的尺寸为多少宽，我们通常的后台界面分为2种布局。
自适应的布局和固定宽度的布局**

自适应布局设计时候需要考虑一些问题：
哪些是固定不动的
哪些是可以自适应拉伸的
最小界面内容宽度一般是1200px

固定的宽度：
固定的宽度我们在设计的时候，就跟网页设计一样需要订一个最低的内容范围在那里，一般最大放在1440用来适配到笔记本电脑的屏幕就可以了
当然根据不同的设备我们还是要进行不同的适配设计

1.默认的窗口设置下，不应该出现水平的滚动条
2.当界面内容超出显示区域时，以浮动层的形式显示
3.弹出页面要保证768高度的分辨率显示正常
4.弹出页面内容过多时，使用tab页显示

登录框
1.所有系统做统一的登录框，当退出系统时，跳转到当前系统的登录页面
2.登录页面用户明/密码的宽度应该上下对齐。

列表设计
1.标题和内容区分，例如标题文字加粗加深/字号加大，或者标题的背景加深
2.现在比较流行的设计中，表格的设计可以不用加入线来分割，可以使用不同的背景颜色来进行行与行的区分。
3.表格中的每一列的内容要有统一的对齐模式，常用的方式居中和居左对齐
4.每一列之间设置一个最小是margin值，以便最适配。
5每一行的高度要统一，这就意味着我们在设计的时候要考虑屏幕适配时可能遇到的换行的情况
6.如果表格的内容太多，可以计入一个隐藏的按钮，方便用户进行切换
7.菜单页之间的切换时，使用标签页展示
8.列表默认显示10条数据，可切换为：10/20/50/100条等
9.翻页大多放在当前页面的最底部，且切换每页显示条数和翻页是，应保留当前的查询页面
10.列表中没有数据时，显示“无记录”

必填项：
1.界面的必填项以红色标示出来，标在文字的前面
2.存在必填项末填写时，点击保存弹出提示，红色框重点标示出必填项。
3.查询页面，当查询条件有必填项时候，也需要用红色标示出来。

颜色的搭配：
尽可能通过选择合适的主题颜色或系统颜色来选择颜色
实用颜色应当保持一致性

输入框的一些注意事项
1.只允许输入数字的输入框控制为只允许输入数字，不允许输入其他字符
2.只允许输入日期，时间的输入框给予格式化，而不是输入非法后再给于提示
3.当输入内容达到来字段的长度限制时，请控制为不允许再输入
4.对于非法字符的控制，需要给予提示
5.金额输入时候需要有规范的格式
6.密码输入时候的呈现效果。

下拉菜单
一级菜单和二级区分用锁进，当前选中菜单用加粗文字或者添加色块表示

页面操作按钮
1.列表的操作按钮统一固定的列表头部，左对齐
2.操作按钮根据操作类型不同使用不同的图标。

编辑界面
1.文本框，只读文本框和输入文本框要在颜色上区分，输入文本框可以白色底，只读文本框灰色底
2.文本框左右对齐，一般一行最多3列
3.当一个文本框长度过长的时候，一个文本框占2个框的位置，
4.编页的内容过多的时候，可以加入竖着的滚动条
5.弹出框的说明，如果只是关闭按钮必须要做关闭，需要和取消进行区分
6.如果文本框有字数限制，必须有甚于输入字数的功能

页面顶部规范
1.顶部在系统中文称logo后面增加版本号的显示
2.显示欢迎您：姓名工号等
3.显示/主页/帮助/推出
4.帮助内容显示用户使用手册功能

字体规范：
字体大小一般使用14px，要保证有一套统一的字体使用规范。例如按钮/标题/页面显示/表单等
颜色根据不同的功能进行不一样的设置
尺寸
统一使用px为单位