系统UI规范说明.docxVIP

营销系统UI规范说明对于整个系统来说，无论是在控件使用，提示信息措辞，还是在颜色、窗口布局风格，都必须遵循统一的标准，做到真正的一致。 这样得到的好处：首先使用户使用起来能够建立起精确的心里模型，使用熟练了一个界面后，切换到另外一个界面能够很轻松的推测出各种功能，语句理解也不需要费神。其次能够降低培训、支持成本，支持人员不会花费力气逐个指导。再次能够给用户统一感觉，不觉得混乱，心情愉快，支持度增加。因此该规范将给出系统在设计开发过程中的UI设计的准则。具体包括以下几个部分：一、(Color)颜色1、统一色调，采用标准Windows的基本色调，做到与操作系统统一，读取系统标准色表。2、整个界面色彩尽量少的使用类别不同的颜色。除非特殊场合，杜绝使用对比强烈，让人产生憎恶感的颜色。3、同时色调也具有一定的含义，在整个系统中应保持色调含义的一致性，避免同一中颜色在不同的画面中表示不同的意义。二、(Resource)资源计算机的资源包括图标资源和鼠标光标资源等。1、图标资源也需要遵循统一的规则，因为不同的图标代表不同的意义。例如：我们用图标来表示保存，因此我们在整个系统中只要涉及到保存的话,都应该使用同一个图标，不论是用在工具栏上还是在菜单上,还是在按钮上。2、图标、图像应该很清晰的表达出意思，遵循常用标准，或者用户机器容易联想的到物件，绝对不允许画出默认奇妙的图案。3、鼠标光标样式统一，使用系统标准。注意：本系统中不采用窗体做进度条，对于点击按钮后，鼠标变成沙漏形状，执行完成后, 鼠标变回。三、(Font)字体1、 本系统中 中文一律采用标准字体“宋体”，英文一律采用标准 Microsoft Sans Serif ，原则上不考虑特殊字体(隶书、草书等,特殊情况可以使用图片取代),保证每个用户使用起来显示都很正常。2、 字体大小统一规定，例如 MSS字体8磅，宋体的小五号字（9磅）。字体颜色一般采用系统默认颜色。3、 所有控件尽量使用大小统一的字体属性，除了特殊提示信息、加强显示等例外情况。四、(Text)文字表述提示信息、帮助文档文字表达遵循以下准则： 1、 口语化，多用您、请，不要用或少用专业术语，杜绝错别字。2、 断句逗号句号顿号分号的用法， 提示信息比较多的话，应该分段。3、 所有的警告、信息、错误和提示的对话框统一采用提示信息格式。例如： MessageBox.Show(请选择一条记录！,提示,MessageBoxButtons.OK,MessageBoxIcon.Information );4、 使用统一的语言描述，例如一个关闭退出功能按钮，统一描述为退出，避免使用返回、关闭等描述。六：(STYLE)控件选择不要随意使用控件，控件功能要专一，风格统一。如果没有好的控件，则使用标准控件。1、 控件的风格统一。2、 同一类型的控件操作方式相同，避免出现一个控件双击可以执行某些动作，而同样控件，双击却没有任何反映。3、 一个控件只做单一功能，尽量不复用。七、(ALIGN)控件布局，窗口不拥挤，按功能组合控件1、 屏幕不能拥挤，让人看上去，不能太拥挤，也不能太松散。2、 整个项目，尽量采用统一的控件间距，通过调整窗体大小达到一致，即使在窗体大小不变的情况下，宁可留空部分区域，也不要破坏控件间的行间距。3、 数据对齐要适当，说明文字，中文版应使用中文全角冒号，纵向右对齐时。 纵向控件宽度尽量保持相通。并左对齐。4、 窗口缩放时，控件位置、布局。为了使界面不出现跑版或者难看的局面，解决方法是固定窗口大小，不允许改变尺寸。八、(TAB ORDER)TAB顺序习惯用法，阅读顺序，从左到右，从上到下。九、(ShortcutKey & Accelerator& PopMenu)快捷键、加速键和弹出菜单1、 使用非破坏性缺省按钮，回车、ESC键的正确使用。对于弹出模态窗体，有默认加速键，如回车表示激活当前窗口设置为default的按钮动作，esc表示关闭窗口。同时在调用default按钮动作和关闭动作时候，不应该做有破坏性的操作，避免用户错误操作产生危害程度，例如不能把删除数据等功能的按钮作为缺省按钮。当用户要提交很多数据时，应该屏蔽esc，或者做退出提示，告诫用户是否保存提交。2、 尽量避免使用右键菜单， 如使用的话尽量在可视化界面上拥有对应的按钮或者菜单选项。因为右键菜单由用户点击鼠标左右键或者别的动作才能调出来显示给用户。无法清晰的显示给用户，所以对应选项应该可以通过别的途径得到的。十、(ACTION)用户交互1、 要使一个功能有时允许有时不允许用户使用，则这个控件的不能随便隐藏，应该使用disable属性进行表示，以免用户发现控件失踪后措手无策。2、 窗口弹出位置要明显，点击一个控件，弹出窗口或者菜单，应该给人明显提示。对于弹出窗体,统一要求显示位置在屏幕中央，要求窗体是以模态显示，并且不出现在任务拦上。3、 执行动作要有提示。UI作为人机对话的工具，用户做了任何动作，应该给用户一个视觉或者听觉、触觉提示。而且这个提示应该行明显，但不应提示过长，可以有以下几种方法：弹出交互对话框让用户点击确认； 改变UI中控件参数提示：(处理不用用户确认的提示，有一定延时，或者用户按键后自动清除。)；改变标题栏字符串，显示“信息：提交成功”,或者专门设置一个状态栏、TLable等用来进行提示。附：具体说明一、 画面整体画面分为两类：模块主画面和子画面。1、 工具栏：主画面可以有可以没有，子画面是必须没有。工具栏示例如下：工具栏上的按钮按照功能相近的进行分组。同时工具栏按钮应该有简短的文字说明和提示。工具栏的图片大小统一定为2020。工具栏的Appearance 属性设置为Flat。工具栏上涉及到菜单的,统一用XP风格菜单。2、 主菜单：主画面和子画面必须没有。3、 主画面和子画面都不能显示在任务栏中。对于子画面显示要是模态显示，并且属性FormBorderStyle设置为FormBorderStyle.FixedToolWindow。子画面显示的初始位置都应该是在屏幕中央。二、 控件选择和属性设置1、 树形控件TreeView：原则上数据存在层次关系的时候才采用树形控件，避免数节点只有一级的情况。树的节点都要加载图片，一般情况下图片统一为和。但是有时候考虑到代表不同的意思，可以选择有意义的图标。注意：不建议依赖采用在树节点上直接修改数据和将树节点拖动的功能。2、 列表控件ListViewEx：原则上在显示多行和多列数据的时候使用ListViewEx，而不使用DataGrid。同时ListViewEx的网格线要有，而且是单行全部选中。要提供双击弹出详细信息的情况。3、 按钮控件XPStyleButton：统一采用该按钮，根据需要增加图片。如图所示：。4、 其它控件都采用提供的标准控件。三、 图片资源对于常见的一些功能性图标（例如：保存、新建、退出等图标），我们一定要统一确定下来，对于一些具体业务需要的图标，则选择代表意义的图标（提出来由美工统一开发，在图片的颜色和风格