一些界面标准规范

 

一：遵循一致的准则，确立标准并遵循
无论是控件使用，提示信息措辞，还是颜色、窗口布局风格，遵循统一的标准，做到真正的一致。
这样得到的好处：

1 ：使用户使用起来能够建立起精确的心里模型，使用熟练了一个界面后，切换到另外一个界面能够很轻松的推测出各种功能，语句理解也不需要费神理解

2 ：降低培训、支持成本，支持人员不会行费力逐个指导。

3 ：给用户统一感觉，不觉得混乱，心情愉快，支持度增加

做法：

项目组有经验人士，确立 UI 规范：

· 美工提供色调配色方案，提供整体配色表

· 界面控制程序人员、用户体验人员提出合理统一使用的控件库。参考标准界面使用规范：

控件功能遵循行业标准， windows 平台参见《 Microsoft 用户体验》 (MSDN 中有，中文已经翻译发行，项目组必须有一本 )

控件样式在允许的范围内可以统一修改其样式、色调

参考其他软件先进操作，提取对本项目有用的功能，以使用，绝对不能盲从，漫无目的。

根据需要，设计特殊操作控件，准则为：简化操作、达到一定功能目的

· 界面实施人员与美工商榷控件可实现性 ,( 如不实行此步骤，将会导致各自对对方工作不满意，也会产生不一致的混乱 ) 。重复叠代上述工作。

· 建立合理化文档《 UI 标准》描述上述规范，

· 强行界面设计者理解之，并作为开发准则，

·SQA 人员进行监控开发人员是否遵循，及时告诫开发人员。

二： (Color) 颜色使用恰当，遵循对比原则：
1 ：统一色调，针对软件类型以及用户工作环境选择恰当色调：

如：安全软件，根据工业标准，可以选取黄色，绿色体现环保，蓝色表现时尚、紫色表现浪漫等等，淡色可以使人舒适，暗色做背景使人不觉得累等

2 ：如果没有自己的系列界面，采用标准界面则可以少考虑此方面，做到与操作系统统一，读取系统标准色表

3 ：色盲、色弱用户，即使使用了特殊颜色表示重点或者特别的东西，也应该使用特殊指示符， 着重号，以及图标等

4 ：颜色方案也需要测试，常常由于显示器、显卡的问题，色彩表现每台机器都不一样，应该经过严格测试，不同机器进行颜色测试

5 ：遵循对比原则：在浅色背景上使用深色文字，深色背景上使用浅色文字，蓝色文字以白色背景容易识别，而在红色背景则不易分辨，原因是红色和蓝色没有足够反差，而蓝色和白色反差很大。除非特殊场合，杜绝使用对比强烈，让人产生憎恶感的颜色。 6 ：整个界面色彩尽量少的使用类别不同的颜色

itop 色表

具体标准参考美术学统计学术标准。 色表的建设，对于美工在图案设计、包装设计上起着标准参考作用，对于程序界面设计人员设计控件、窗体调色起到有章可循的作用。

三： (Resource) 资源
一个多姿多彩的人机交互界面，少不了精美的鼠标光标、图标以及指示图片、底图等。

1 ：也需要遵循统一的规则，包括上述颜色表的建立，图标的建立步骤也应该尽可能的形成标准，参考 itop 的 outlookbar 图标设计标准

2 ：有标准的图标风格设计，有统一的构图布局，有统一的色调、对比度、色阶，以及图片风格

3 ：底图应该融于底图，使用浅色 , 低对比，尽量少的使用颜色。

4 ：图标、图像应该很清晰的表达出意思，遵循常用标准，或者用户机器容易联想的到物件，绝对不允许画出默认奇妙的图案。

5 ：鼠标光标样式统一，尽量使用系统标准，杜绝出现重复的情况，例如某些软件中一个手的形状就有 4 钟不同的样子。

如：《如何创建 XP 图标》 http://www.microsoft.com/china/msdn/library/dnwxp/html/winxpicons.asp

附件： Itop outlook howto.doc 描述 itop 项目中， outlookxp 风格图标的制作方法

四： (Font) 字体
使用统一字体，字体标准的选择依据操作系统类型决定。

中文采用标准字体， “ 宋体 ” ，英文采用标准 Microsoft Sans Serif 不考虑特殊字体 ( 隶书、草书等 , 特殊情况可以使用图片取代 ), 保证每个用户使用起来显示都很正常。

字体大小根据系统标准字体来，例如 MSS 字体 8 磅，宋体的小五号字 (9 磅）五号字（ 10.5 磅 ) 。

所有控件尽量使用大小统一的字体属性，除了特殊提示信息、加强显示等例外情况

ITop 采用 BCB ，所有控件默认使用 parent font ，不允许修改，这样有利于统一调整。

· 系统大小字体属性改变的处理。

Windows 系统有个桌面设置，设置大字体属性，很多界面设计者常常为这个恼火，如果设计时遵循微软的标准，全部使用相对大小作为控件的大小设置，当切换大小字体的时候，相对不会有什么特殊问题。

但是由于常常方便使用点阵作为窗口设计单位，导致改变大字体后，出现版面混乱的问题。

这个情况下，应该做相应处理：

1 ：写程序自动调节大小，点阵值乘以一个相应比例

2 ：全部采用点阵作为单位，不理会系统字体的调节，这样可以减少调节大字体带来的麻烦。 BCB/DELPHI 中多采用这种方法，但是必然结果是和系统不统一。

五： (Text) 文字表达
提示信息、帮助文档文字表达遵循以下准则：

1 ：口语化、客气、多用您、请，不要用或少用专业术语，杜绝错别字

2 ：断句逗号句号顿号分号的用法， 提示信息比较多的话，应该分段，

3 ：警告、信息、错误 使用对应的表示方法

4 ：使用统一的语言描述，例如一个关闭功能按钮，可以描述为退出、返回、关闭，则应该统一规定。

5: 根据用户不同采用相应的词语语气语调，如专用软件，可以出现很多专业属于，用户为儿童：这可以语气亲切和蔼，老年用户则应该成熟稳重。制定标准遵循之。

六： (STYLE) 控件风格，不要使用错误控件，控件功能要专一
有设计好的同一风格的控件，如果没有能力设计出一套控件，则使用标准控件，绝对不能不伦不类，杂乱无章

· 不要错误使用控件，例如：

使用 Button 样式做 TTable 的功能，拿主菜单条显示版权信息，

· 统一类型的控件操作方式相同，例如一个控件双击可以执行某些动作，而同样控件，双击却没有任何反映

· 一个控件只做单一功能，不复用

很多人为了写程序方便，喜欢把一个控件在不同情况下做不同功能用，这些对用户初次理解增加难度，只有用户熟悉后才能理解。 例如

改变红色选项，左边的参数代表不同的设置，可能由于为了节省控件或者编程量，但是只有熟练用户才回使用，这种情况下解决方法：

1: 分组，使用双份控件 .

2 ：使用 TABLE 页，给用户很明显的视觉变化

 

七： (ALIGN) 控件布局，窗口不拥挤，按功能组合控件
1 ：屏幕不能拥挤

拥挤的屏幕让人难以理解，因而难以使用。试验结果 (Mayhew,1992 年 ) 屏幕总体覆盖度不应该超过 40 ％，而分组钟覆盖度不应该超过 62 ％。

让人看上去，不能太拥挤，也不能太松散。

整个项目，采用统一的控件间距，通过调整窗体大小达到一致，即使在窗体大小不变的情况下，宁可留空部分区域，也不要破坏控件间的行间距。

2 ：区域排列

一行控件，纵向中对齐 , 控件间距基本保持一致

行与行之间间距相同，靠窗体 Border 距离应大于行间间距 ( 间距加边缘留空 ) 。

当屏幕有多个编辑区域，要以视觉效果和效率来组织这些区域。

3 ：数据对齐要适当

说明文字，中文版应使用中文全角冒号，纵向对齐时，并按冒号右对其，如图。 纵向控件宽度尽量保持相通。并左对齐。

例如金额等字符穿应根据小数点对齐，或者右对齐

4 ：有效组合

逻辑上相关联的控件应当加以组合，以表示其关联性，反之，任何不想光的项目应当风格开，在项目集合间，用间隔对其进行分组，或者使用方框划分各自区域。

例如： 以下界面，选择搜索方式来判断号码范围是表示主叫号码范围还是被叫号码范围，和入帐方式无关，

则应该修改为： 搜索方式和入帐方式调换位置。以免用户产生误解。

5 ：窗口缩放时，控件位置、布局：

为了使界面不出现跑版或者难看的局面，解决方法：

1 ：固定窗口大小，不允许改变尺寸，
2 ：改变尺寸的窗口，在 Onsize 的时候做控件位置、大小的相应改变。

BCB/DELPHI 的 VCL 中，大部分控件有布局属性：

某些控件拥有 alignment 属性，可以用来做布局调节： TcustomPanel ， Tmemo 等，考左靠右靠上靠下以及撑满 (Client) 属性，用来根据版面自动调节。

大部分控件有属性 Anchors ，里面上下左右 akLeft, akTop 等如果为 true ，则表示相对各个边缘的距离是否改变。这个可以进一步设计好排版工作。

八： (TAB ORDER)TAB 顺序
习惯用法，阅读顺序，从从左到右，从上到下

窗体中控件的 Tab 按键激活顺序， TabOrder,. BCB/DELPHI 中使用窗体设计右键菜单选择 taborder 设置， VC 中窗体 RES 编辑区域使用 ctrl+D

九： (ShortcutKey & Accelerator& PopMenu) 快捷键、加速键和弹出菜单
· 快捷键：

1 ：全局快捷键菜单中加以描述 CTRL+XXX 并入帮助列表。

2 ：快捷键写入帮助，特殊说明，并在使用培训时强调使用

· 加速键：

1 ：使用非破坏性缺省按钮，回车、 ESC 键的正确使用 一个窗体，有默认加速键，如回车表示激活当前窗口设置为 default 的按钮动作， esc 表示关闭窗口。

在调用 default 按钮动作和关闭动作时候，不应该做有破坏性的操作，避免用户错误操作产生危害程度，例如不能把删除数据等功能的按钮作为缺省按钮。当用户要提交很多数据时，应该屏蔽 esc ，或者做退出提示，告诫用户是否保存提交。

2 ：可接收动作控件必须拥有加速键，统一加速键描述 (&A)

为结合键盘使用，可操作控件都应该有加速键，加速键定义准则，为英文单词第一个字母，如果同一窗体重复则用第二个字母，以此类推，则加速方式为 alt+ 这个加速键，用统一的方法标识在界面中，如 XXX(A) 或者 wps 的 A.XXX 英文可直接在字母下标识下划线 Cancel ，

对于无法像 button 一样显示快捷键的 Edit 等控件，则在 Edit 描述的 Label 中显示快捷键。

· 弹出菜单

辅助菜单必须在可视化界面上拥有对应的按钮或者菜单选项。

由于辅助菜单由用户点击鼠标左右键或者别的动作才能调出来显示给用户。无法清晰的显示给用户，所以对应选项应该可以通过别的途径得到 , 例如界面上有相应控件或弹出右键菜单的按钮等。

十： (ACTION) 用户交互
1 ： disable 而不是 not visible

要使一个功能有时允许有时不允许用户使用，则这个控件的不能随便隐藏，应该使用 disable 属性进行表示，以免用户发现控件失踪后措手无策

2 ：窗口弹出位置要明显

点击一个控件，弹出窗口或者菜单，应该给人明显提示，最低要求是覆盖刚才点击的位置，让用户轻松跳转到新的界面。

3 ：执行动作要提示

给用户一个视觉感受的同时，写程序的时候应该注意用户的交互感受， UI 作为人机对话的工具，用户做了任何动作，应该给用户一个视觉或者听觉、触觉提示。而且这个提示应该行明显，但不应提示过长，可以有以下几种方法：

当用户点击按钮等动作进行一个工作时：

1 ：弹出交互对话框让用户点击确认。

2 ：改变 UI 中控件参数提示： ( 处理不用用户确认的提示，有一定延时，或者用户按键后自动清除。 )

如：改变标题栏字符串，显示 “ 信息：提交成功 ”, 或者专门设置一个状态栏、 TLable 等用来进行提示。

3 ：听觉提示：

在确定有声卡，用户可以听到声音的时候，发出特殊声音提示。一般作为重要提示的辅助。声音不应过长，紧急错误提示应该短促，频率较高，成功提示应该舒缓，轻松。等等 ……

十一： (HELP) 联机帮助：
什么时候要帮助，什么时候不要帮助

1 ：系统默认、行业标准的控件操作不需要逐一描述，只需要对特殊控件加以描述 2 ：特殊操作、特殊功能界面，在界面上加控件直接连接到对应的 HELP 文件中

3 ：特殊设置详细，应该在界面上用简洁明了的语句说明，或者是好用 Tiptool ，并由第二步帮助

帮助文档：

结构化，按功能模块划分

必须阐述功能通过什么方法可以在软件中实现

帮助文件是帮助用户更好的使用软件，措辞要恰当、简捷、通俗易懂 , 每一句话都应该有目的，帮用户解决问题

帮助文件不是广告、商业软件不允许打广告。描述公司信息目的是为了方便用户在没有办法的情况下找到售后支持，网址连接、信箱地址、电话号码绝对不允许无效。

十二：发行时阐明规则
对统一的东西进行逐一阐述，并加以典型描述，放入 HELP 和用户手册中，同时加有词汇表

 

 

附录：
美工何时参与进来：

美工作为界面美化的主要人员，不但拥有艺术设计、包装设计的才能，还应该穿插整个项目，给界面程序设计人员提出系统参考意见。

1 ：软件设计前期，美工参与需求了解，分析同类软件界面有缺点，提出主色调、典型界面风格、以及构思整个美术包装等。

2 ：界面原型设计过程中，与开发人员共同修改、商榷最终表现样式，以及确立 UI 标准。

3 ：程序开发过程中，提供标准风格的资源文件（ icon,cur,bmp 等），并总结出统一风格的资源的设计过程，形成规范文档 * .

4 ：产品化方面，协助制作帮助文件、网站风格以及参与制作，制作附带宣传图片、动画、产品包装、海报等。
 
界面设计测试规范

================================================================================================================
界面设计测试规范

界面测试
界面测试 ( 红鬃野马 ) 作者： flowingice

我在工作中总结了一些有关界面设计与测试的规范，与大家共享。 界面设计与测试规则
界面是软件与用户交互的最直接的层，界面的好坏决定用户对软件的第一印象。而且设计良好的界面能够引导用户自己完成相应的操作，起到向导的作用。同时界面如同人的面孔，具有吸引用户的直接优势。设计合理的界面能给用户带来轻松愉悦的感受和成功的感觉，相反由于界面设计的失败，让用户有挫败感，再实用强大的功能都可能在用户的畏惧与放弃中付诸东流。目前界面的设计引起软件设计人员的重视的程度还远远不够，直到最近网页制作的兴起，才受到专家的青睐。而且设计良好的界面由于需要具有艺术美的天赋而遭拒绝。
目前流行的界面风格有三种方式：多窗体、单窗体以及资源管理器风格，无论那种风格，以下规则是应该被重视的。

1 ：易用性：
按钮名称应该易懂，用词准确，屏弃没楞两可的字眼，要与同一界面上的其他按钮易于区分，能望文知意最好。理想的情况是用户不用查阅帮助就能知道该界面的功能并进行相关的正确 * 作。

易用性细则：
1): 完成相同或相近功能的按钮用 Frame 框起来，常用按钮要支持快捷方式。
2): 完成同一功能或任务的元素放在集中位置，减少鼠标移动的距离。
3): 按功能将界面划分局域块，用 Frame 框括起来 , 并要有功能说明或标题。
4): 界面要支持键盘自动浏览按钮功能，即按 Tab 键的自动切换功能。
5): 界面上首先应输入的和重要信息的控件在 Tab 顺序中应当靠前 , 位置也应放在窗口上较醒目的位置。
6): 同一界面上的控件数最好不要超过 10 个，多于 10 个时可以考虑使用分页界面显示。
7): 分页界面要支持在页面间的快捷切换，常用组合快捷键 Ctrl+Tab
8): 默认按钮要支持 Enter 及选操作，即按 Enter 后自动执行默认按钮对应操作。
9): 可写控件检测到非法输入后应给出说明并能自动获得焦点。
10):Tab 键的顺序与控件排列顺序要一直，目前流行总体从上到下，同时行间从左到右的方式。
11): 复选框和选项框按选择几率的高底而先后排列。
12): 复选框和选项框要有默认选项，并支持 Tab 选择。
13): 选项数相同时多用选项框而不用下拉列表框。
14): 界面空间较小时使用下拉框而不用选项框。
15): 选项数叫少时使用选项框，相反使用下拉列表框。
16): 专业性强的软件要使用相关的专业术语，通用性界面则提倡使用通用性词眼。
2 ： 规范性：
通常界面设计都按 Windows 界面的规范来设计，即包含 “ 菜单条、工具栏、工具厢、状态栏、滚动条、右键快捷菜单 ” 的标准格式，可以说：界面遵循规范化的程度越高，则易用性相应的就越好。小型软件一般不提供工具厢。

规范性细则：
1): 常用菜单要有命令快捷方式。
2): 完成相同或相近功能的菜单用横线隔开放在同一位置。
3): 菜单前的图标能直观的代表要完成的操作。
4): 菜单深度一般要求最多控制在三层以内。
5): 工具栏要求可以根据用户的要求自己选择定制。
6): 相同或相近功能的工具栏放在一起。
7): 工具栏中的每一个按钮要有及时提示信息。
8): 一条工具栏的长度最长不能超出屏幕宽度。
9): 工具栏的图标能直观的代表要完成的操作。
10): 系统常用的工具栏设置默认放置位置。
11): 工具栏太多时可以考虑使用工具厢。
12): 工具厢要具有可增减性，由用户自己根据需求定制。
13): 工具厢的默认总宽度不要超过屏幕宽度的 1/5 。
14): 状态条要能显示用户切实需要的信息，常用的有：
目前的操作、系统状态、用户位置、用户信息、提示信息、错误信息等，如果某一操作需要的时间较长，还应该显示进度条和进程提示。
15) ：滚动条的长度要根据显示信息的长度或宽度能及时变换，以利于用户了解显示信息的位置和百分比。
16) ：状态条的高度以放置五好字为宜，滚动条的宽度比状态条的略窄。
17) ：菜单和工具条要有清楚的界限 ; 菜单要求凸出显示，这样在移走工具条时仍有立体感。
18) ：菜单和状态条中通常使用 5 号字体。工具条一般比菜单要宽，但不要宽的太多，否则看起来很不协调。
19): 右键快捷菜单采用与菜单相同的准则。

3 ：帮助设施：
系统应该提供详尽而可靠的帮助文档，在用户使用产生迷惑时可以自己寻求解决方法。

帮助设施细则：
1) ：帮助文档中的性能介绍与说明要与系统性能配套一致。 ( 我们的系统帮助文档都是系统的祖先时期的说明，让人困惑 ) 。
2) ：打包新系统时，对作了修改的地方在帮助文档中要做相应的修改。
3) ：操作时要提供及时调用系统帮助的功能。常用 F1 。
4) ：在界面上调用帮助时应该能够及时定位到与该操作相对的帮助位置。也就是说帮助要有即时针对性。
5) ：最好提供目前流行的联机帮助格式或 HTML 帮助格式。
6) ：用户可以用关键词在帮助索引中搜索所要的帮助，当然也应该提供帮助主题词。
7) ：如果没有提供书面的帮助文档的话，最好有打印帮助的功能。
8 ) ：在帮助中应该提供我们的技术支持方式，一旦用户难以自己解决可以方便的寻求新的帮助方式。

4 ：合理性：
屏幕对角线相交的位置是用户直视的地方，正上方四分之一处为易吸引用户注意力的位置，在放置窗体时要注意利用这两个位置。

合理性细则：
1) ：父窗体或主窗体的中心位置应该在对角线焦点附近。
2) ：子窗体位置应该在主窗体的左上角或正中。
3) ：多个子窗体弹出时应该依次向右下方偏移，以显示窗体出标题为宜。
4) ：重要的命令按钮与使用较频繁的按钮要放在界面上注目的位置。
5) ：错误使用容易引起界面退出或关闭的按钮不应该放在易点位置。横排开头或最后与竖排最后为易点位置。
6) ：与正在进行的操作无关的按钮应该加以屏蔽 (Windows 中用灰色显示，没法使用该按钮 ) 。
7) ：对可能造成数据无法恢复的操作必须提供确认信息 , 给用户放弃选择的机会。
8) ：非法的输入或 * 作应有足够的提示说明。
9): 对运行过程中出现问题而引起错误的地方要有提示，让用户明白错误出处，避免形成无限期的等待。
10): 提示、警告、或错误说明应该清楚、明了、恰当。
5 ：美观与协调性：
界面应该大小适合美学观点，感觉协调舒适，能在有效的范围内吸引用户的注意力。

美观与协调性细则：
1): 长宽接近黄金点比例，切忌长宽比例失调、或宽度超过长度。
2): 布局要合理 , 不宜过于密集，也不能过于空旷，合理的利用空间。
3): 按钮大小基本相近，忌用太长的名称，免得占用过多的界面位置。
4): 按钮的大小要与界面的大小和空间要协调。
5): 避免空旷的界面上放置很大的按钮。
6) ：放置完控件后界面不应有很大的空缺位置。
7): 字体的大小要与界面的大小比例协调 , 通常使用的字体中宋体 9-12 较为美观，很少使用超过 12 号的字体。
8): 前景与背景色搭配合理协调，反差不宜太大，最好少用深色，如大红、大绿等。常用色考虑使用 Windows 界面色调。
9): 如果使用其他颜色，主色要柔和，具有亲和力与磁力，坚决杜绝刺目的颜色。
10): 大型系统常用的主色有 "#E1E1E1" 、 "#EFEFEF" 、 "#C0C0C0" 等。
11): 界面风格要保持一致，字的大小、颜色、字体要相同，除非是需要艺术处理或有特殊要求的地方。
12): 如果窗体支持最小化和最大化或放大时，窗体上的控件也要随着窗体而缩放；切忌只放大窗体而忽略控件的缩放。
13) ：对于含有按钮的界面一般不应该支持缩放，即右上角只有关闭功能。
14): 通常父窗体支持缩放时，子窗体没有必要缩放。
15) ：如果能给用户提供自定义界面风格则更好，由用户自己选择颜色、字体等。

6 ：菜单位置：
菜单是界面上最重要的元素，菜单位置按照按功能来组织。

菜单设测试细则：
1) ：菜单通常采用 “ 常用 -- 主要 -- 次要 -- 工具 -- 帮助 ” 的位置排列，符合流行的 Windows 风格。
2): 常用的有 “ 文件 ” 、 “ 编辑 ” ， “ 查看 ” 等，几乎每个系统都有这些选项，当然要根据不同的系统有所取舍。
3): 下拉菜单要根据菜单选项的含义进行分组，并切按照一定的规则进行排列，用横线隔开。
4): 一组菜单的使用有先后要求或有向导作用时，应该按先后次序排列。
5): 没有顺序要求的菜单项按使用频率和重要性排列，常用的放在开头， 不常用的靠后放置；重要的放在开头，次要的放在后边。
6): 如果菜单选项较多，应该采用加长菜单的长度而减少深度的原则排列。
7): 菜单深度一般要求最多控制在三层以内。
8): 对常用的菜单要有快捷命令方式，组合原则见 8 。
9): 对与进行的操作无关的菜单要用屏蔽的方式加以处理，如果采用动态加载方式 —— 即只有需要的菜单才显示 —— 最好。
10) ：菜单前的图标不宜太大，与字高保持一直最好。
11): 主菜单的宽度要接近，字数不应多于四个，每个菜单的字数能相同最好。
12) ：主菜单数目不应太多，最好为单排布置。
。 7: 独特性：
如果一味的遵循业界的界面标准，则会丧失自己的个性 . 在框架符合以上规范的情况下，设计具有自己独特风格的界面尤为重要。尤其在商业软件流通中有着很好的迁移默化的广告效用。

1): 安装界面上应有单位介绍或产品介绍，并有自己的图标。
2): 主界面，最好是大多数界面上要有公司图标。
3): 登录界面上要有本产品的标志，同时包含公司图标。
4): 帮助菜单的 “ 关于 ” 中应有版权和产品信息。
5): 公司的系列产品要保持一直的界面风格，如背景色、字体、菜单排列方式、图标、安装过程、按钮用语等应该大体一致。

8 ：快捷方式的组合
在菜单及按钮中使用快捷键可以让喜欢使用键盘的用户 * 作得更快一些 在西文 Windows 及其应用软件中快捷键的使用大多是一致的。
菜单中：
1): 面向事务的组合有 :
Ctrl-D 删除 ； Ctrl-F 寻找 ； Ctrl –H 替换； Ctrl-I 插入 ； Ctrl-N 新记录 ； Ctrl-S 保存 Ctrl-O 打开。
2) ：列表 :
Ctrl-R ， Ctrl-G 定位； Ctrl-Tab 下一分页窗口或反序浏览同一页面控件；。
3): 编辑 :
Ctrl-A 全选； Ctrl-C 拷贝； Ctrl-V 粘贴； Ctrl-X 剪切； Ctrl-Z 撤消 * 作； Ctrl-Y 恢复 * 作。
4) 文件 * 作 :
Ctrl-P 打印； Ctrl-W 关闭。
5): 系统菜单
Alt-A 文件； Alt-E 编辑； Alt-T 工具； Alt － W 窗口； Alt － H 帮助。
6):MS Windows 保留键 :
Ctrl-Esc 任务列表 ； Ctrl-F4 关闭窗口； Alt-F4 结束应用； Alt-Tab 下一应用 ； Enter 缺省按钮 / 确认 * 作 ； Esc 取消按钮 / 取消 * 作 ； Shift-F1 上下文相关帮助 。
按钮中：
可以根据系统需要而调节，以下只是常用的组合。
Alt-Y 确定 ( 是 ) ； Alt-C 取消； Alt-N 否； Alt-D 删除； Alt-Q 退出； Alt-A 添加； Alt-E 编辑； Alt-B 浏览； Alt-R 读； Alt-W 写。
这些快捷键也可以作为开发中文应用软件的标准 , 但亦可使用汉语拼音的开头字母。
9: 安全性考虑：
在界面上通过下列方式来控制出错几率，会大大减少系统因用户人为的错误引起的破坏。开发者应当尽量周全地考虑到各种可能发生的问题 , 使出错的可能降至最小。如应用出现保护性错误而退出系统 , 这种错误最容易使用户对软件失去信心。因为这意味着用户要中断思路 , 并费时费力地重新登录 , 而且已进行的 * 作也会因没有存盘而全部丢失。

安全性细则：
1) ：最重要的是排除可能会使应用非正常中止的错误。
2) ：应当注意尽可能避免用户无意录入无效的数据。
3) ：采用相关控件限制用户输入值的种类。
4) ：当用户作出选择的可能性只有两个时 , 可以采用单选框。
5) ：当选择的可能再多一些时 , 可以采用复选框 , 每一种选择都是有效的 , 用户不可能输入任何一种无效的选择。
6) ：当选项特别多时，可以采用列表框，下拉式列表框。
7) ：在一个应用系统中 , 开发者应当避免用户作出未经授权或没有意义的操作。
8) ：对可能引起致命错误或系统出错的输入字符或动作要加限制或屏蔽。
9): 对可能发生严重后果的操作要有补救措施。通过补救措施用户可以回到原来的正确状态。
10): 对一些特殊符号的输入、与系统使用的符号相冲突的字符等进行判断并阻止用户输入该字符。
11) ：对错误操作最好支持可逆性处理，如取消系列操作。
12): 在输入有效性字符之前应该阻止用户进行只有输入之后才可进行的操作。
13): 对可能造成等待时间较长的 * 作应该提供取消功能。
14) ：特殊字符常有； ;’”<, ｀ ‘ ： “ ［ ” ｛、 /| ｝］ +=)-(_*&&^%$#@!~,. 。 ?/ 还有空格。
15) ：与系统采用的保留字符冲突的要加以限制。
16) ：在读入用户所输入的信息时，根据需要选择是否去掉前后空格。
17) ：有些读入数据库的字段不支持中间有空格，但用户切实需要输入中间空格，这时要在程序中加以处理。

10: 多窗口的应用与系统资源：
设计良好的软件不仅要有完备的功能，而且要尽可能的占用最底限度的资源。
1) ： 在多窗口系统中，有些界面要求必须保持在最顶层，避免用户在打开多个窗口时，不停的切换甚至最小化其他窗口来显示该窗口。

2) ：在主界面载入完毕后自动卸出内存，让出所占用的 WINDOWS 系统资源。
3) ：关闭所有窗体，系统退出后要释放所占的所有系统资源 ，除非是需要后台运行的系统。
4) ：尽量防止对系统的独占使用。

2004 年 8 月 28 日 11:31

================================================================================================================

用户界面

荣耀 2002 冬

我们编写的大多数软件具有用户界面，通过它实现人机交互。界面设计是一门大学问。

有一种流行说法，说代码高手未必就是界面高手，我不赞成。迄今为止，我认识的代码高手，同时也都是界面高手。至于那些声称 “ 我只愿意编写核心代码，对界面没有兴趣 ” 的所谓代码高手，我怀疑这种人十有八九写不好或根本就写不出那种 “ 牛气 ” 的代码。

我也从来没有遇见过界面做得非常到位但代码写得很差的人。通常来说，一个程序员的代码水平和他的界面水平是一致的。果真阁下的代码水平和界面水平不一致，我建议你强化你的弱项。代码写得好、界面做得差，一点都不比界面做得好、代码写得差，好到哪里去。

你相信一个界面看上去乱七八糟的软件，内部代码却非常有条理、精致、强健和高效吗？

假如你在 Windows 环境下开发，微软定义了一套称为 “ 用户体验 ” 的参考规范（当然， “ 用户体验 ” 的内容已经超出了狭义的 “ 用户界面 ” ）。这个规范对菜单、按钮、图标、窗体、快捷键、消息框和文本等界面元素的设计，给出了一整套建议。倘若不是编写游戏之类的 东西，就没有理由不参照这个规范。

以下是我见过的一些糟糕的用户界面风格 ：

过份使用各种奇形怪状、五颜六色的控件。这些界面往往出自充满激情和想法的新手。它很容易使人想起过去农村穿着红褂子、绿裤子的小媳妇，或者今天城市街头画着大花脸的扭秧歌的大妈。

界面元素比例失调。我见过按钮巨大无比，其尺寸甚至超过显示重要内容的文本框的界面。

界面元素凌乱。比如说，按钮和文本框摆放地点随意，相当于客厅当卧室，卫生间当厨房。

违背使用习惯。你按下 F1 ，它没有弹出帮助，却执行了一件绝对出乎你意料的动作。

消息框信息含糊、混乱。下面是某软件弹出的消息框。把 “ 确定 ” 和 “ 取消 ” 改为 “ 是 ” 和 “ 否 ” 会不会更清晰一些？就事论事，假如干脆自己做个 form ，改成 “ 想 ” 和 “ 不想 ” ，那更好。

 

还有一种糟糕的用户界面，乍一看很厉害，实际上完全是缺乏规划的结果。

这种软件本身的确提供了比较复杂的功能，但对于哪些是常用功能，哪些是很少用到的高级功能，缺乏评估。什么功能都往界面上挤，占地方不说，用户会厌烦，弄不好还会被吓跑。

对于这种软件来说，默认界面只应该显示目标用户最常使用的功能，至于不常用到的高级功能，可以 “ 隐藏 ” 起来，比如说，放到菜单里，不要都做成按钮摆到界面上。果真需要需要这些高级功能的话，用户自然会到菜单里去找的。

在这方面，微软 Office 软件堪称楷模。比如 Word ，从编写 “ 代办文凭 ” 这样的电线杆上的 “ 狗皮膏 ” ，到排版严肃的长篇巨著，都游刃有余。对于低级用户来说，它简单易用，对于高级用户来说，要的功能都有。这个软件界面做得就非常有水平。

就象那些高级数码相机一样，操作之简单可以和 “ 傻瓜 ” 相机媲美。按一个按钮就可以使你心想事成，恰恰说明它聪明得可以。

一句话，你愿意使用界面上摆满了各种让人眼花缭乱的玩意儿，左看右看也不知道从哪儿下手的 软件吗？

－完－
================================================================================================================
 
软件界面设计相关的各项介绍  
 

 

界面设计是为了满足软件专业化标准化的需求而产生的对软件的使用界面进行美化优化规范化的设计分支。具体包括软件启动封面设计，软件框架设计，按钮设计，面板设计，菜单设计，标签设计，图标设计，滚动条及状态栏设计，安装过程设计，包装及商品化。

在设计的过程中有较多注意的关键问题，以下列出几点：

(1) 软件启动封面设计
应使软件启动封面最终为高清晰度的图像，如软件启动封面需在不同的平台、操作系统上使用将考虑转换不同的格式，并且对选用的色彩不宜超过 256 色，最好为 216 色安全色。软件启动封面大小多为主流显示器分辨率的 1/6 大。如果是系列软件将考虑整体设计的统一和延续性。在上面应该醒目的标注制作或支持的公司标志、产品商标，软件名称，版本号，网址，版权声明，序列号等信息，以树立软件形象，方便使用者或购买者在软件启动的时候得到提示。插图宜使用具有独立版权的，象征性强的，识别性高的，视觉传达效果好的图形，若使用摄影也应该进行数位处理，以形成该软件的个性化特征。

(2) 软件框架设计
软件的框架设计就复杂得多，因为涉及软件的使用功能，应该对该软件产品的程序和使用比较了解，这就需要设计师有一定的软件跟进经验，能够快速的学习软件产品，并且在和软件产品的程序开发员及程序使用对象进行共同沟通，以设计出友好的，独特的，符合程序开发原则的软件框架。软件框架设计应该简洁明快，尽量少用无谓的装饰，应该考虑节省屏幕空间，各种分辨率的大小，缩放时的状态和原则，并且为将来设计的按钮，菜单，标签，滚动条及状态栏预留位置。设计中将整体色彩组合进行合理搭配，将软件商标放在显著位置，主菜单应放在左边或上边，滚动条放在右边，状态栏放在下边，以符合视觉流程和用户使用心理。

(3) 软件按钮设计
软件按钮设计应该具有交互性，即应该有 3 到 6 种状态效果：点击时状态；鼠标放在上面但未点击的状态；点击前鼠标未放在上面时的状态；点击后鼠标未放在上面时的状态；不能点击时状态；独立自动变化的状态。按钮应具备简洁的图示效果，应能够让使用者产生功能关联反应，群组内按钮应该风格统一，功能差异大的按钮应该有所区别。

(4) 软件面板设计
软件面板设计应该具有缩放功能，面板应该对功能区间划分清晰，应该和对话框，弹出框等风格匹配，尽量节省空间，切换方便。

(5) 菜单设计
菜单设计一般有选中状态和未选中状态，左边应为名称，右边应为快捷键，如果有下级菜单应该有下级箭头符号，不同功能区间应该用线条分割。

(6) 标签设计
标签设计应该注意转角部分的变化，状态可参考按钮。

(7) 图标设计
图标设计色彩不宜超过 64 色，大小为 16x16 、 32x32 两种，图标设计是方寸艺术，应该加以着重考虑视觉冲击力，它需要在很小的范围表现出软件的内涵，所以很多图标设计师在设计图标时使用简单的颜色，利用眼睛对色彩和网点的空间混合效果，做出了许多精彩图标。

(8) 滚动条及状态栏设计
滚动条主要是为了对区域性空间的固定大小中内容量的变换进行设计，应该有上下箭头，滚动标等，有些还有翻页标。状态栏是为了对软件当前状态的显示和提示。

(9) 安装过程设计
安装过程设计主要是将软件安装的过程进行美化，包括对软件功能进行图示化。

(10) 包装及商品化
最后软件产品的包装应该考虑保护好软件产品，功能的宣传融合于美观中，可以印刷部分产品介绍，产品界面设计。

================================================================================================================

  图标设计规范

 

数位设计引入了一种新的图标设计样式。以下是设计和创建样式图标的具体规范。
图标样式应该有趣、色彩丰富且充满活力，因为现在的系统支持图标是 32 位图标，并且边缘非常平滑。在矢量程序中绘制完每个图标后，再用 Adobe Photoshop 进行处理可使图像更加完美。本规范是专为设计者编写的。在创建图像时，建议您与高水平的图形设计者一起工作，尤其是具有丰富的矢量和 3D 软件经验的图形设计者。

图标设计概述的目的是让您熟悉 WindowsXP 的新样式，为创建图标做好准备。

图标样式特性
(1) 色彩丰富，是对 WindowsXP 外观的补充。
(2) 不同的角度和透视特性为图像增添了动态活力。
(3) 元素的边角十分柔和，并略微有些圆滑。
(4) 光源位于图标的左上角，同时有环绕光照亮图标的其它部分。
(5) 渐变效果使图标具有立体感，进而使图标的外观更加丰满。
(6) 投影使图标更具对比度和立体感。
(7) 添加轮廓可使图像更清晰。
(8) 日常对象 ( 如计算机和设备 ) 具有更现代化的个人外观。

图标尺寸
Windows XP 图标有四种尺寸，建议使用以下四种尺寸：
(1) 48×48 像素
(2) 32×32 像素
(3) 24×24 像素
(4) 16×16 像素

图标色彩深度支持
WindowsXP 支持 32 位图标。 32 位图标为 24 位图像加上 8 位 alpha 通道。使图标边缘非常平滑，且与背景相融合。
每个 WindowsXP 图标应包含以下三种色彩深度，以支持不同的显示器显示设置：
24 位图像加上 8 位 alpha 通道 (32 位 )
8 位图像 (256 色 ) ，加上 1 位透明色
4 位图像 (16 色 ) ，加上 1 位透明色

调色板
图标中使用的主要颜色。

对象的角度和分组
WindowsXP 样式图标使用的透视网格：并非所有对象使用 16×16 的复杂图像都能获得较好效果。某些对象通常以直观图像显示：文档图标、符号图标 ( 如警告或信息图标 ) 、单一对象图标 ( 如放大镜 )

除非创建重叠辅助对象可以更清楚地表达图标的含义，否则就可读性和完整性而言，还是应使用直观图像。还应考虑如何按组查看图标，以便确定如何将对象分组。

投影
使用投影后， WindowsXP 图标将更清晰且更具立体感。可在 Photoshop 中实现这种效果，本指南的后面部分将对此进行描述。若要为图像添加投影，请在 Photoshop 中双击图像的图层，并选择 Drop Shadow 。然后将 Angle 更改为 135 ， Distance 更改为 2 ， Size 更改为 2 。此时投影为 75% 不透明黑色。

轮廓
绘制 XP 样式图标时，为图像添加轮廓可使之更清晰，并可保证图像在不同背景色上都具有较好效果。

概念
设计图标时，请考虑以下因素：
使用已有概念以确保真实表达了用户的想法。考虑图标在用户界面环境中以何种形式出现，以及如何作为图标集的一部分使用。考虑图形的文化背景。避免在图标中使用字母、单词、手或脸。必须用图标表示人或用户时，请尽可能使其大众化。如果图标中的图像由多个对象组成，应考虑如何使图像尺寸更小。建议在图标中使用的对象不超过三个。对于 16×16 的尺寸大小，还可考虑删除某些对象或简化图像使之更容易辨认。

透明工具
将 Gif Movie Gear(GMG) 打开一个对话框，其中显示您的图标。使用吸管工具单击图标的背景色。此颜色将更改为暗黄绿色 ( 或在 GMG 中选作透明背景色的颜色 ) 。重复所有 4 位和 8 位帧。若要保存图标，请选择 File-Save Icon As... 。

创建工具栏
Windows 工具栏图标除不使用投影之外，使用的样式与其它图标相同。由于工具栏图标非常小，建议您使用简单的图像。如果以直观方式显示图像即可清晰地表达图标的含义，则不必使用其它复杂方式。

创建 AVI
WindowsXP 使用 8 位 AVI 。创建 .avi 文件的过程与创建图标的过程相同 - 在 Photoshop 中准备图像，然后将其拖动到 GMG 中。请按以下指导创建 8 位图标。若要使用 GMG 保存 AVI ，请转至 File-Export As-AVI file 。
创建 .avi 文件时，请考虑以下因素：使用品红 (R255 G0 B255) 作为背景透明色。在 Photoshop 中，重要的一点是不要出现杂散像素。请将填充能力设置为 0 ，并确认未选中取消锯齿。

 
软件人机界面　
================================================================================================================

 

 

 

 

UI 即 User Interface( 用户界面 ) 的简称。 UI 设计则是指对软件的人机交互、操作逻辑、界面美观的整体设计。好的 UI 设计不仅是让软件变得有个性有品味，还要让软件的操作变得舒适、简单、自由 , 充分体现软件的定位和特点。

美丽的事物常常会让人无法抗拒。这就是为什么产品出色的外观设计对于电脑、汽车、日用品、家具、食品、服装等等几乎所有商品的销售与推广，都有着举足轻重的作用的原因。

    同样的道理，对于软件公司来说，软件产品就是他们的商品，而软件界面就是他们产品的外观，界面的美观与否，直接关系到了软件产品的营销成败。

    我们可以清楚地看到，微软公司对软件界面设计的重视。请回想一下您在第一次见到 win2000 时的情景，与 nt4.0 相比是否惊叹他界面的美观性与易用性？而您如果使用过 xp 系统，则会被其令人神奇的感官概念而震惊折服！金山公司的金山词霸就是国内软件成功的例子了，从金山词霸 3.0 到金山词霸 2001 的变化堪称经典。著名的网页动画制作软件 flash 从 3.0 到 4.0 ，仅仅修改了图标和窗体，立即大为增色 …

    现今世界上成功的软件公司都非常重视软件界面的美化设计工作，因为他们深刻地知道，在激烈的市场竞争中，仅仅有强大的功能是远远不够的，不足以战胜强劲的对手。我们可以相象一下，您在挑选手机的时候，如果有两款手机，性能相同，而第一款比第二款要美观很多，那么您将选择哪一款呢？当然是美观的那一款了。试想，您的客户，也会拿您和您竞争对手的软件做这样的比较的。

    现在的软件企业都知道，广告和市场推销活动对市场营销的作用是多么的重要，并不遗余力地打广告、做活动、做推广。但我们知道，这些活动的最终目的，是为了让用户购买并使用软件产品，而用户最终使用的也是您的产品，那么为什么不在软件界面的美观性上多下些工夫呢？在诸如家用电器、汽车、电脑等成熟的市场中，用非常精美的广告去推广一种功能强大却丑陋无比的产品，是一种笑话。然而，这样的笑话在软件行业里却屡见不鲜。这也是像中国足球一样，中国软件业与国外相比较存在的一个很大的差距。

    实践证明，各商家只要在产品美观设计方面很小投入，将会有很大产出。其投入产出比，要比在功能领先性开发上的投入大得多。

    在用户把软件买回去后，他们和您企业的联系，或者说您企业形象在客户眼中的表现，很大一部分是通过您软件的界面来传达的，那么美观友好的用户界面对于宣传您的企业文化，对于给客户灌输您的企业理念，对于您企业的宣传运做都将是非常有益的。尤其如果您的公司做的是项目承包形式的业务，那么无论是在竞标的时候，还是在项目交付使用以后，美观的界面都会给您的客户以信心和良好的印象。

    要成为一款有竞争力的软件，不光要有强大的功能，也需要有一个友好的界面设计。纵观当今的 it 行业，其软件界面设计的发展趋势大体上有如下几种技术：

1. 命令语言用户界面的发展。
根据其语言的特点，及人机交互的形式的分为

a. 形式语言
b. 自然语言。
c. 类自然语言。

2. 图形用户界面的广泛应用
图形用户界面和人机交互过程极大地依赖视觉和手动控制的参与，因此具有强烈的直接操作特点

3. 直接操纵用户界面技术的成熟。
用户最终关心的是他欲控制和操作的对象，他只关心任务语义，而不用过多为计算机语义和句法而分心。对于大量物理的、几何空间的以及形象的任务，直接操纵已表现出巨大的优越性。

4. 多媒体用户界面及多通道用户界面的发展大大丰富了计算机信息的表现形式。

5. 虚拟现实技术的应用　
　虚拟现实系统向用户提供身临其境 (immerse) 和多感觉通道 (multi-sensory) 体验，作为一种新型人机交互形式，虚拟现实技术比以前任何人机交互形式都有希望彻底实现和谐的、以 “ 人为中心 ” 的人机界面。

 
软件人机界面的形式与标准    
　 菜单界面设计
　 1 菜单界面概述
　 2 菜单界面的语义组织
　 3 菜单界面的式样
　 数据输入界面设计
　 1 交互输入的原则和方法
　 2 填表输入界面设计
　 直接操纵和 WIMP 界面设计
　 2 直接操纵界面的特点
　 3 图标
　 4 窗口
　 交互输入输出界面设备
　 1 交互输入界面设备
　 2 交互输出界面设备
　 响应时间和显示速率
　帮助和出错界面设计
　 1 出错处理分析
　 2 帮助处理系统的设计
　 3 出错处理的设计

软件人机界面设计
     最小化
　 系统菜单
　 苹果菜单
　 自定义工具栏
　 Finder
　 字体
　 搜索
　 菜单设计
　 运行过程显示
　 滚动条
　 按钮设计

图标设计    
　 软件界面中的图标设计
　 1 软件图标的分类
　 2 图标的设计

网页界面中的图标设计
色彩设计　
　 色彩基础
　 颜色的产生
　 色彩的属性
　 色彩调和与色彩搭配
　 色调
　 配色
　 色调感觉
　 心理感受
　 色彩的联想
　 计算机色彩
　 硬件界面的色彩设计
　 软件设计的色彩搭配
　 软件色彩设计
　 网页色彩设计
 
人机界面设计测试    
　 人机界面设计测试的意义
　 设计准则
　 人机界面的测试
　 界面设计测试
　 1 界面设计测试指标
　 2 界面设计测试形式
　 3 设计测试方法
　 硬件人机界面设计测试
　 1 简单测试法
　 2 名次记分法
　 3 分功能测试法
　 4 评分法
　 5 意象尺度法

　 软件人机界面设计可用性测试
　 1 观察法
　 2 原型测试方法
　 3 咨询法
　 4 座谈
　 5 实验法
　 6 条目测试法

显示界面设计
　 数量型显示界面设计
　 性状型显示界面设计
　 警报与信号显示界面设计
　 再现型显示界面设计
　 字母设计
　 符号设计
　 指针设计
　 控制界面设计
　 编码设计
　 显控协调性设计
　 集中控制中的显控界面设计
　 视野与控制区
　 人机系统及其界面设计