Windows用户界面开发规范模板
鼠标指针
通过不同的显示,为用户表
现更多使用信息:
表示程序状态 表示操作结果的提示
文本 (Text),字体( Font)& 颜色(Color)
规格: • 在界面中出现的中文一般使用宋体12像素大小的文字; • 英文字体:System(默认)、Fixedsys、Microsoft Sans Serif、 Tahoma、Terminal。 规则 • 粗体来吸引人的注意力;斜体表示解释,但要很少使用; • 将文本放在颜色适中的背景上,确保在文本和背景之间存在良好的对比。 • 采用一致的大小写规则
滚动条( Scroolbar )
滑块
用途:方便用户察看该窗口没有显示出来的更多信息,可以通过按住拖动操作实现。 滚动条仅用于滚动; 尺寸: 横向滚动条高为17,滑块为16; 纵向滚动条宽为17,滑块为16。 起止位置:滚动条的起止位置和其操作对象等宽或等高,并置于操作对象内,并使
滚动条足够长,保证有可用的滑块;
采用危急消息框通知用户继续工作前需要修改一个
错误。 2 不再推荐对消息框使用疑问标记符,问号已经用 来表达帮助的意思,而非二次确认。
3 并确保消息框选项按钮与文本一致
4 仔细选择默认按钮,避免无用的帮助 5 对经常出现或可能经常出现的非危急性消息,向 用户提供一个压制该消息的选项。如加入一个选择 框,标示 “不再提示”。
5 最安全或最常用的选项作为默认按钮
复选框 & 列表框
1 用复选框开关选项,用复选框进行选项的开关操作是很有效的
2 避免一组复选框中选项个数超过8(大约)个,应该考虑用复选框列表代替,它占 用的空间更少,但复选框列表需要滚动时使用就稍微麻烦了。 3 考虑将相关组的复选框置于一个分组框中,这样的分组使得复选框之间的关系更为
工具栏(Toolbar)
显示该程序常用功能的图标,以便于用户直接点击使用
分割线
图标 文字 扩展按钮
• 构成:图标 文字提示 分割线 扩展按钮 • 状态:将无效的工具栏按钮置为不可用,而不是删除或者报错,以保持工具栏稳定。 但是,应考虑删除用户进入一种模式时用不到的整个工具栏。如需文字提示,显示在
图标右侧或下侧;常用,重要,推荐的功能出现文字提示;当工具图标显示不完的时
候,出现扩展按钮,点击出现菜单。 • 图标状态:
• 分类:不同类别图标间用静态竖线隔开
工具栏(Toolbar)
显示该程序常用功能的图标,以便于用户直接点击使用
分割线
图标 文字 扩展按钮
• 位置:工具栏的拖动,当工具栏可拖动的时候,工具栏前端出现拖动标识,鼠标指 针变成移动箭头,同时具有磁性粘附 • • TIPS:所有的工具栏图标都需要TIPS,但要简短。如果该命令已分配有快捷键, TIPS显示时间规则: 则显示该快捷键。 当界面上没有tips时,第一个tips的响应延时为1秒;当界面有tips显示,则下一个 tips出现无延时。15秒后工具提示将自动消去。 如果工具提示的文字很多,不要自动消去包含许多文字的工具提示,15秒种对用户来 说就看不完了。
使用标准菜单:提供通用的“文件”、“编辑”和“帮助”菜单。
菜单(Menu)
排列:左对齐,一项菜单只占用一行; 不要使用多列的下拉菜单,多列增加了菜单不必要的复杂性; 不要使用看起来像下拉菜单,但实际是选择后立即执行的命令,如 “退出”,。用户希望菜单标题就只是菜单,而不是命令; 顺序:图标 菜单名称 访问键省略号 快捷键或者二级菜单箭头 将无效菜单置为不可用,但对整个程序实例中都无效的菜单则需要删 除;并避免有仅产生出错消息的可用命令; 采用省略号来表示需要更多信息,命令中的省略号表示执行时需要更 多信息,而不是简单确认。省略号并不表示一定有对话框出现; 将相关菜单项组合在一起,不同类型的菜单项之间加分割线。重要的 命令应该位于菜单的顶部,而不重要的菜单则位于菜单的底部; 统一放置“查找”和“选项”命令:一般将“查找”命令放在“编辑” 菜单中,而有“工具”菜单时,总将“选项”置于其中,否则置于 “查看”菜单中。 用复选标记来开关选项:用单选组来改变模式。 规则: 当菜单项过多时的处理方法1智能收缩 2 分二级菜单 重要、常用、推荐的菜单项表现方式: 1 加图标,2 纯文字菜单时,使用文字加粗 就近原则:推荐项距单击点之间距离最短
以及用户使用程序的整个过程。
规范windows平台下用户界面设计的意义
建立交互一致性 降低开发成本,提高生产效率
易学,降低用户教育成本
减少误操作几率
避免程序冲突
………
标准窗口界面开发规范
界面主要部件应用规范
控件应用规范
窗口的定义 ——程序或过程能运行的部分视屏。窗口可以 关闭、改变尺寸、移动、最小化到任务栏上,或最大
化到整个屏幕上。
窗口构成
标题栏 菜单栏 工具栏
滚 动 条
状态栏
标题栏(Title)
位于窗口最上端,显示窗口名称、对窗口进行控制
标题图标 Icon
标题名称 Caption(VB)
属性信息
标题栏控制按钮: Min,Max,Close
标题图标(Icon) ——显示在标题栏最左端,一般只有主窗口需要放置标题图标。规格:16*16像素, 256色。 标题名称(Caption ) ——Title中该窗口名称放在前边,以便用户在最小化时可以通过名称快速找到需要 的窗口。类别等属性信息放在后边,中间用“—”隔开。字体:宋体粗体13像素 标题栏控制按钮(Min,Max,Close) ——主窗口依次显示最小化、最大化、关闭按钮;弹出式窗口需要固定大小的,不显 示最小化、最大化按钮;
明显。
4 竖向对齐的一组复选框更易于浏览。 —————————————————————————————————— 1 必须用标签来标明列表框的用途。并多于5行。 2 对多选列表考虑提供“全部选中”和“全部取消选中”命令
单选按钮
1 避免一组单选按钮中选项个数超过8(大约)个, 2 避免用单选按钮进行“开/关”或“是/否”选择,用复选框代替。 3 总将单选按钮置于一个分组框中,由于单选按钮是一组相互排斥的选项, 所以分组框使选择更为明确。 4 宁可竖向对齐,虽然更合适的情况下采用横向对齐或直角对齐也是可接受 的,但竖向对齐的一组单选按钮更易于浏览。
2 对列项大约超过30的列表视图总使其可进行排序,用户能够对列表进行排序方便 了对信息的查找。 3 但仅在列表可排序时采用可单击的表头。首次单击时应按正序对列表进行排序, 而第二次单击时按反序进行排列。
分组框
1 利用分组框分组相关控件,分 组框通常是用于单选按钮的分组, 但也可用于任何控件的分组。避
组合框
1 总给组合框提供一个标签,必须用标签来表明组合框的用途。 2 少于5行的列表不需要給滑块。请注意,如果组合框没有足够的列项来填
满列表,那么将自动缩短列表的长度。
3 避免组合框的列项少于4项,如果少于四项,可以考虑用单选按钮代替, 它们虽然多占空间,但更一目了然,易于操作。如果空间更为重要或为了 保持与同一窗口中其他组合框一致时,采用组合框则更为可取。
菜单栏(Menu)位于窗口上方第二层,对该程序所有功能进行归类
菜单标题 菜单标题
访问键提示
——建议尽量使用两个字为菜单文字,菜单文字:宋体 12像素
访问键提示
——如需要添加访问键则在中文名称后面显示访问键字母。一个菜单里的访问键字母 必须是唯一对应的,避免使用小写字母或单词中与它们靠近的字母来分配访问键;
3 用微调框和浏览按钮使编辑框可视 4 按期望输入来设置编辑框的宽度,编辑框的宽度是对期望输入的可视提 示。例如,如果用户是输入地址,两个字符宽的State字段明显暗示用户输 入两个字符的州名缩写。如果期望的输入没有特别的大小,就选择与其他 编辑框或控件一致的宽度。
列表视图
1 使需要滚动的列表视图高度至少5行。
标准对话框控件应用规范
命令按钮 复选框 单选按钮 组合框 编辑框 列表框 列表视图 分组框
对话框 —— 一种次要窗口,包含按钮和各种选项,通 过它们可以完成特定命令或任务。
复选按钮
组合框
编辑框 命令按钮
命令按钮
1 采用最小的宽度和标准的高度 带中文文字的命令按钮应该最少为21像素高度。在同一行或同一列的按钮宽度尽量 保持一致,最长为145像素。按钮间的距离标准为8像素。尽量将不同大小的带文字 命令按钮的个数控制在两个以内。对父窗口拖动(owner-draw)按钮或无文字的按 钮(如…),其大小可以任意设置,原则是使命令按钮外观简朴一致。 2 将无效按钮置为不可用,以取消报错 3 总采用省略号来表示需要更多信息,命令中的省略号表示执行命令时需要更多信息, 而不是简单的确认。省略号并不表示一定会出现对话框。 4 绝对不要指定双击行为,用户意料不到命令按钮会响应双击,因此不可能发现这样 的行为。
自动出现的工具提示:对于推荐的新功能可以采用自动出现的工具提示教育用户使用。
但一个窗口只能出现一次自动提示。有鼠标动作以后才消失。
状态栏(Status bar)
显示状态栏所在窗口的一些属性、状态信息和鼠标、键盘操作信息
概念:与当前程序相关的一行信息,包括属性、状态信息和鼠标、键盘操作。 位置:状态栏通常位于窗口的底部。但不是所有的窗口都有状态栏。 状态:并且允许通过操作进行状态等的转换。 规格:宋体 12
OTHER
1 避免不必要的消息框,不要用出错消息来报告正常行为,而应该用来报
告不正常或不期望的结果。不要对很容易恢复的操作进行确认。
2 避免无用的帮助,除非提供真正有用的附加信息,否则不要提供“帮助” 按钮。不要附加带无用帮助信息的没意义的消息框。TITLE上的帮助按钮
通常不与最小化和最大化按钮同时出现;
Windows用户界面开发规范
Enya HCI Design UI Design CertenProgram
界面规范文档
关于界面规范饶霁2011-07-05 一、主要功能的规范B 添加义项?文案,原指放书的桌子,后来指在桌子上写字的人。
现在指的是公司或企业中从事文字工作的职位,就是以文字来表现已经制定的创意策略。
文案它不同于设计师用画面或其他手段的表现手法,它是一个与广告创意先后相继的表现的过程、发展的过程、深化的过程,多存在于广告公司,企业宣传,新闻策划等。
基本信息中文名称文案外文名称Copy目录1发展历程2主要工作3分类构成4基本要求5工作范围6文案写法7实际应用折叠编辑本段发展历程汉字"文案"(wén àn)是指古代官衙中掌管档案、负责起草文书的幕友,亦指官署中的公文、书信等;在现代,文案的称呼主要用在商业领域,其意义与中国古代所说的文案是有区别的。
以文案为务。
"《晋书·桓温传》:"机务不可停废,常行文按宜为限日。
" 唐戴叔伦《答崔载华》诗:"文案日成堆,愁眉拽不开。
"《资治通鉴·晋孝武帝太元十四年》:"诸曹皆得良吏以掌文按。
"《花月痕》第五一回:" 荷生觉得自己是替他掌文案。
"旧时衙门里草拟文牍、掌管档案的幕僚,其地位比一般属吏高。
《老残游记》第四回:"像你老这样抚台央出文案老爷来请进去谈谈,这面子有多大!"夏衍《秋瑾传》序幕:"将这阮财富带回衙门去,要文案给他补一份状子。
"文案音译文案英文:copywriter、copy、copywriting文案拼音:wén àn现代文案的概念:文案来源于广告行业,是"广告文案"的简称,由copy writer翻译而来。
多指以语辞进行广告信息内容表现的形式,有广义和狭义之分,广义的广告文案包括标题、正文、口号的撰写和对广告形象的选择搭配;狭义的广告文案包括标题、正文、口号的撰写。
微软软件界面设计规范
微软软件界面设计规范假如你在Windows环境下开发,微软定义了一套称为“用户体验”的参考规范(当然,“用户体验”的内容已经超出了狭义的“用户界面”)。
这个规范对菜单、按钮、图标、窗体、快捷键、消息框和文本等界面元素的设计,给出了一整套建议。
倘若不是编写游戏之类的东西,就没有理由不参照这个规范。
以下是我见过的一些糟糕的用户界面风格:过份使用各种奇形怪状、五颜六色的控件。
这些界面往往出自充满激情和想法的新手。
它很容易使人想起过去农村穿着红褂子、绿裤子的小媳妇,或者今天城市街头画着大花脸的扭秧歌的大妈。
界面元素比例失调。
我见过按钮巨大无比,其尺寸甚至超过显示重要内容的文本框的界面。
界面元素凌乱。
比如说,按钮和文本框摆放地点随意,相当于客厅当卧室,卫生间当厨房。
违背使用习惯。
你按下F1,它没有弹出帮助,却执行了一件绝对出乎你意料的动作。
消息框信息含糊、混乱。
下面是某软件弹出的消息框。
把“确定”和“取消”改为“是”和“否”会不会更清晰一些?就事论事,假如干脆自己做个form,改成“想”和“不想”,那更好。
还有一种糟糕的用户界面,乍一看很厉害,实际上完全是缺乏规划的结果。
这种软件本身的确提供了比较复杂的功能,但对于哪些是常用功能,哪些是很少用到的高级功能,缺乏评估。
什么功能都往界面上挤,占地方不说,用户会厌烦,弄不好还会被吓跑。
对于这种软件来说,默认界面只应该显示目标用户最常使用的功能,至于不常用到的高级功能,可以“隐藏”起来,比如说,放到菜单里,不要都做成按钮摆到界面上。
果真需要需要这些高级功能的话,用户自然会到菜单里去找的。
在这方面,微软Office软件堪称楷模。
比如Word,从编写“代办文凭”这样的电线杆上的“狗皮膏”,到排版严肃的长篇巨著,都游刃有余。
对于低级用户来说,它简单易用,对于高级用户来说,要的功能都有。
这个软件界面做得就非常有水平。
就象那些高级数码相机一样,操作之简单可以和“傻瓜”相机媲美。
用户界面设计规范
用户界面设计规范
1. 一致性
- 所有页面和功能应该有一致的外观和操作方式,以减少用户
的认知负担。
- 使用相同的颜色、字体和图标,以创建统一的界面风格。
- 保持一致的布局和排列方式,使用户能够轻松地导航和使用
界面。
2. 简洁明了
- 界面应该简洁明了,避免过多的视觉杂乱和冗余内容。
- 使用简洁的语言表达信息,避免过多的文字描述。
- 只显示与当前任务相关的必要信息,避免用户感到信息过载。
3. 易用性
- 设计易用的交互元素,如按钮、文本框和下拉菜单,确保它
们易于识别和操作。
- 提供明确的指导和反馈信息,使用户能够理解和判断每个操
作的结果。
- 对于复杂或多步骤的任务,提供合理的导航和操作流程,减
少用户出错的可能性。
4. 可访问性
- 界面应该对所有用户无障碍,包括具有视觉或听觉障碍的用户。
- 使用易于阅读和区分的字体和颜色,以提高可读性。
- 提供替代文本和描述,以便屏幕阅读器能够读出图像和图标
的含义。
5. 主题和布局
- 选择适合目标用户和应用场景的主题和颜色方案。
- 根据内容和功能的重要性,进行合理的布局和排列。
- 使用空白和间距来分隔不同的功能区域,提高可视性和美感。
以上是用户界面设计规范的一些关键指导原则。
通过遵循这些原则,我们可以设计出一致、易用、美观和可访问的用户界面,从而提升用户体验。
软件用户界面规范
软件用户界面规范1. 引言本文档旨在规范软件用户界面的设计,提供一致性和可用性的用户体验。
该规范适用于所有软件项目,并将指导开发人员在设计用户界面时遵循统一的设计原则和最佳实践。
2. 设计原则以下是设计软件用户界面时应遵循的原则:2.1. 简洁性用户界面应该简洁明了,避免过多的复杂元素和冗余信息。
通过将功能和选项组织得合理有序,以简化用户操作流程。
2.2. 一致性用户界面的各个部分应保持一致,包括颜色、字体、图标和布局等方面。
一致的用户界面可以提高用户的研究曲线和操作效率。
2.3. 可视化使用合适的颜色、图标和图形元素来增强用户界面的可视化效果。
通过视觉引导和提供清晰的信息层次结构,帮助用户更容易理解和使用软件。
2.4. 反馈机制用户界面应提供及时的反馈,确保用户知晓其操作的结果和状态。
例如,在表单提交后显示成功或失败的消息,或在长时间操作时显示进度条。
2.5. 易用性用户界面应尽可能简单直观,减少用户的认知负担。
避免使用专业术语和复杂的操作流程,提供明确的指导和帮助。
2.6. 可访问性用户界面应考虑到不同用户的需求,包括视力障碍、听力障碍和运动障碍等。
通过提供可调整的字体大小、语音辅助和键盘导航等功能,帮助用户克服访问障碍。
3. 设计指南遵循以下指南可帮助开发人员设计出符合规范的软件用户界面:3.1. 布局和组织- 界面布局应合理,使用户能够轻松找到所需功能和信息。
- 使用标准的界面组件和布局模式,以提高用户的熟悉度和可操作性。
3.2. 色彩和图标- 使用统一的颜色方案,以确保一致性和可视化效果。
- 选择合适的图标和图形元素,以增强用户界面的可视化效果和交互性。
3.3. 文字和标签- 使用简洁明了的语言,避免使用专业术语和晦涩难懂的表达。
- 标签和按钮应清晰明了,准确描述其功能和用途。
3.4. 错误处理- 提供友好的错误提示,告知用户发生了什么错误和如何解决。
- 在用户输入错误时,给予及时的反馈和相关的帮助信息。
用户界面设计规范范本
用户界面设计规范范本用户界面设计规范是指在软件开发过程中,为了提供更好的用户体验和用户界面的一致性,制定的一套设计规范和指导原则。
以下是一个用户界面设计规范范本的示例。
1. 介绍用户界面设计规范是为了确保软件的用户界面能够满足用户的需求,并具备一致性和易用性。
本文档旨在为设计师提供一个规范范本,以便他们在设计过程中参考和遵循。
2. 规范概述2.1 通用原则- 界面设计应简洁明了,避免过度装饰和冗余信息。
- 使用直观的图标和标识来表示功能和操作。
- 遵循用户习惯和期望,减少学习成本。
- 提供明确的导航和反馈,以帮助用户理解系统状态和操作结果。
2.2 布局和导航- 使用一致的布局和导航模式,让用户能够轻松找到功能和信息。
- 使用合适的字体、颜色和图标,以提升界面的可读性和可理解性。
- 避免过多的层级和复杂的操作流程,以简化用户的操作路径。
2.3 输入和交互- 提供明确的输入框和交互元素,以指导用户完成数据输入和操作。
- 验证用户输入,并及时给出准确和友好的错误提示信息。
- 避免弹出窗口和迷惑性的操作,以减少用户的操作困惑和错误。
2.4 可访问性和可用性- 遵循无障碍设计原则,确保用户群体的包容性和可访问性。
- 使用明确的语言和措辞,以避免歧义和误解。
- 提供帮助和文档,以帮助用户理解和使用系统。
3. 设计模板在进行界面设计时,可以使用下面的设计模板作为参考,根据具体的项目需求进行调整和修改。
3.1 首页- 页面布局:顶部导航栏、侧边栏、主内容区。
- 重点功能入口:放置在页面的显著位置,提供易于点击和识别的按钮或链接。
- 信息展示:从系统中提取信息或功能高亮显示,在主页上展示。
3.2 列表页- 列表布局:清晰的表头,列表项按照一致的格式显示。
- 过滤和排序:提供便捷的过滤和排序功能,以帮助用户快速找到需要的信息。
- 操作按钮:每一行都提供必要的操作按钮,如编辑、删除、查看等。
3.3 详情页- 信息展示:以易读的格式展示详细信息,使用合适的标题和格式。
用户界面设计文档范本
用户界面设计文档范本1. 引言在当前数字化时代,用户界面的设计是一个至关重要的过程。
一个好的用户界面设计可以提升用户体验,增加用户的满意度,进而促进产品或服务的成功。
本文将提供一个用户界面设计文档的范本,以帮助设计师在项目中进行系统性的设计和规划。
2. 项目概述本项目旨在设计一个易于使用和吸引用户的界面,以满足用户需求,并提供良好的用户体验。
设计的界面将应用于一个新型的社交媒体平台,主要功能包括用户注册、社交互动、信息分享等。
通过本次设计,我们希望能够在竞争激烈的市场中脱颖而出。
3. 用户分析在设计之前,我们需要对目标用户进行深入的分析,以了解他们的需求、偏好和行为方式。
通过用户调研和画像分析,我们得到以下关键发现:- 用户群体主要年龄段为18-30岁之间的年轻人;- 用户对新鲜感和个性化体验有较高的需求;- 用户喜欢简洁、直观的界面;- 用户偏好移动设备和平板电脑进行社交媒体操作。
4. 界面整体设计4.1 色彩选择基于用户分析和品牌定位,我们选择了明亮、活泼的颜色作为主要色彩,以增加用户的兴趣和活力感。
4.2 图标与按钮设计为使用户界面更加直观和易于操作,我们采用了简洁明了的图标和按钮设计。
每个图标和按钮都应具有直观的表达意义,以减少用户的学习成本。
4.3 布局设计我们通过分析用户需求和界面功能的重要性,进行了合理的布局设计。
主要的交互功能集中于屏幕的核心位置,以便用户可以轻松访问。
5. 用户交互设计5.1 注册流程用户在注册过程中,我们采用了分步骤的设计,以便用户逐步完成必要的信息填写,同时提供清晰的指示和错误提示。
5.2 社交互动为提升用户的互动体验,我们设计了点赞、评论和分享等功能,用户可通过轻触或滑动等简单操作完成。
5.3 个人信息管理用户个人信息的管理是一个重要的功能点,我们提供了友好的界面,使用户可以轻松地修改、查看或删除个人信息。
6. 响应式设计为了满足用户在不同设备上的访问需求,我们采用了响应式设计。
用户界面设计规范
用户界面设计规范版本:1.1作者:伍守林日期:2003年4月15日描述:用户界面设计规范本规范作为公司工具类软件和解决方案类软件的原型和最终产品的用户界面设计工作的指导文件,是Windows应用程序应该遵循的指导方针,没有特殊的情况,各项目组不得违反本规范。
如有规范内未尽的事宜,应与LPDT及品牌中心协商后解决。
用户界面设计前的准备工作确定用户界面风格在正式进行用户界面的设计工作之前,需要先确定产品的用户界面风格,用户界面风格是用户界面设计的指导性文件,这在多人同时进行用户界面设计的时候尤其有用。
在确定用户界面风格的过程中,往往需要回答诸如下面的一些问题:∙判断当前产品是解决方案类软件还是工具类软件?这是两种截然不同的软件,应该采用不同的用户界面风格。
∙确定是采用单文档还是多文档的方式∙确定窗体的整体布局方案,尤其是主窗体的布局方案。
∙确定系统的配色方案,包括需要使用哪几种颜色,分别在什么情况下使用等?∙确定系统所使用的字体,包括需要使用哪几种字体,分别在什么情况下使用等?∙确定系统推荐使用的分辨率。
∙是否支持复杂的鼠标操作,比如滑轮、拖放等?∙是否使用菜单(包括右键菜单)?∙对话框是尽量采用模式对话框还是尽量采用非模式对话框?是否采用泊靠形式?∙确定主要使用的控件尤其是一些关键的控件。
建立统一的术语在用户界面设计之前,为用户界面中的每一个重要的程序元件建立统一的术语是很重要的。
由于选择的术语经常以菜单、对话框、状态栏文本、帮助系统、文献等形式出现在实际的界面上,统一的术语能够使得界面清晰而一致。
普通外观∙一致性:一致的外观将使用户界面更易于理解和使用∙保持简洁明快,尽量少用无谓的装饰,应该考虑节省屏幕空间、以及各种分辨率的大小,缩放时的状态和原则等,并且为将来设计的按钮、菜单、标签、滚动条及状态栏等预留位置∙设计中将整体色彩组合进行合理搭配(参考颜色),将软件商标或产品LOGO放在显著位置。
∙布局:人们一般习惯从左到右和从上到下进行阅读,因此,应该将重要信息放在上面和左边。
winorm界面设计方案规范
封面作者:PanHongliang仅供个人学习Winform开发一般遵循的原则窗体类型4尺寸比例4窗体控件元素4Tab键次序6快捷键6右键菜单6区域排列6UI开发异常处理7执行动作要提示7文字表达8颜色使用恰当,遵循对比原则8窗体类型我们把UI理解成窗体以及窗体上用户的交互规则。
窗体主要包括主界面类型和对话框类型两种。
主界面指应用程序启动后最主要的界面,其生命周期一般与应用程序保持一致。
通过菜单或按钮的形式调用其它子界面和执行功能。
一般由以下几个部分组成。
标题栏,菜单栏,工具栏,目录栏,工作区,信息输出区(栏)。
此外很多应用程序中又增加一些漂浮的子窗体以面板的形式附加到主界面中。
对话框一般指应用程序中具有返回结果的窗体。
一般表现为模态窗体,包括信息展现部分,信息输入部分和结果选择按钮三部分组成。
此外,UI部分除了主窗体和对话框外还有浮动窗体,托盘菜单等方式与用户交互。
尺寸比例主窗体尺寸一般在运行期默认最大化,否则遵循纵横比为4:3, 1 6:9为益。
对话框除了和主窗体一样的原则外也有3:4(4:3旋转90度)的纵横比,总之窗体的尺寸只要保证纵横比屏幕一致。
当窗体元素太少,比如只有一个文本标签时,可以不遵循该原则,因为保证窗体尺寸纵横比之前首先要确定窗体不能有大范围的空白区域。
窗体控件元素主窗体一般按菜单栏,工具栏等组成部分分为上中下左右五个分布区(TO P,Client,Bottom,Left, Right,),根据实际需求可能舍去某些分布区。
分布区一般由Split Panel控件分隔,这样可以使用户自行调节各个分布区的尺寸大小。
注意处在不同分布区控件的Anchor属性,保证当窗体尺寸因鼠标拖动改变时控件尺寸按照分布原则变化。
下表为控件在不同分布区的Achor属性值。
对话框窗体布局按照结果选择按钮在窗体上的位置划分为以下三种形式:第一种窗体一般固定尺寸大小。
结果按钮居中,第二种和第三种可以是Sizeable的窗体,结果按钮需要设置Anchor值来保持窗口大小更改后离窗口边框的距离。
Windows界面设计规范
Windows界面设计规范Design Specification for Win UI (仅供内部使用Only for inside of HTFS)作者:徐长龙(Ben)日期:2005年5月31日宏图财务HFS版权所有不得复制Copyright by HTFS 2005,All rights reservedWindows界面设计规范-文档修改记录Design Specification for Win UI—Revision History目录一、目的 (4)二、适用范围 (4)三、文件命名规范 (4)四、控件命名规范 (4)五、控件外观规范 (6)六、界面设计规范 (7)6.1字体与颜色 (7)6.1.1 ForeColor(前景色) (7)6.1.2 BackColor(背景色) (8)6.2对齐与边距 (8)6.3窗体样式规范 (9)6.3.1 FormBorderStyle (9)6.3.2 KeyPreview (9)6.3.3 ShowInTaskbar (9)6.3.4 StartPosition (9)6.3.5 WindowState (10)6.3.6 FlatStyle (10)七、其他规范 (10)7.1 SDP Tools规范 (10)7.2 (11)7.3 (11)7.4 (11)文档名称File Name英文English Design Specification for Win UI密级SecretLevel内部(INSIDE)存放位置Locate作者AuthorBen一、目的为了使最终设计出来的Windows界面风格一致化,开发者之间相互协作更轻松,特制定此Windows界面设计规范!回目录二、适用范围1.此规范适合所有Windows Form的UI设计。
2.有关Web Form的UI设计请参考<<Web界面设计规范>>。
回目录三、文件命名规范Win Form扩展名Extension File Name 描述Description前缀Prefix.cs 窗体文件frm.cs 类文件/回目录四、控件命名规范控件类型Control Type 前缀Prefix例子ExampleLabel lbl lblStartSync LabelLink lbkButton btnTextBox txtMainMenu mnuCheckBox chk文档名称File Name英文English Design Specification for Win UI密级SecretLevel内部(INSIDE)存放位置Locate作者AuthorBenPrintDocument prdPageSetupDialog psdCrystalReportViewer crv回目录五、控件外观规范控件类型Control Type 宽度(像素)Width(px)高度(像素)Height(px)备注RemarkLabel LabelLink Button TextBox MainMenu CheckBox RadioButton GroupBox PictureBox PanelDataGrid ListBox CheckedListBox Combo ListView TreeView TabControl DateTimerPicker MonthCalendar HScrollBar VScrollBar TimerSplitter DomainUpDown NumericUpDown TrackBar文档名称File Name英文English Design Specification for Win UI密级SecretLevel内部(INSIDE)存放位置Locate作者AuthorBenProgressBarRichTextBoxImageListHelpProviderToolTipContextMenuToolBarStatusBarNotifyIconOpenFileDialogSaveFileDialogFolderBrowserDialogFontDialogColorDialogPrintDialogPrintPreviewDialogPrintPreviewControlErrorProviderPrintDocumentPageSetupDialogCrystalReportViewer回目录六、界面设计规范6.1字体与颜色1.多语言版本使用Times New Roman,9号字2.所有颜色使用系统颜色,不能用自定义和Web3.其他没有特别注明的控件使用其默认的背景色和前景色6.1.1 ForeColor(前景色)使用ControlText颜色文档名称File Name英文English Design Specification for Win UI密级SecretLevel内部(INSIDE)存放位置Locate作者AuthorBen6.1.2 BackColor(背景色)1.窗体和所有非输入框背景使用Control颜色2.所有能够输入的控件背景采用Window颜色3.网格(DataGrid)的AlternatingBackColor属性设为System.Drawing.Color.FromArgb(237,243,254) 6.2对齐与边距1.Windows Form界面设计的原则是控件对齐,边距和间距一致。
程序界面设计规则与规范(超详细)
一份界面规范(c/s),和大家共享(摘录)Posted on 2006-07-04 09:33 东人EP阅读(158) 评论(0)编辑收藏引用所属分类: .NET在参考了很多资料后,整理出来的一份界面规范(是c/s程序的,但其中的原则部分对任何界面都是具有参考价值的),希望能给大家带来帮助。
其中的图片没有贴上来,因为文字已经足够描述清楚了。
-------------------------------------1. 界面规范1.1. 总体原则l 以用户为中心。
设计由用户控制的界面,而不是界面控制用户。
l 清楚一致的设计。
所有界面的风格保持一致,所有具有相同含义的术语保持一致,且易于理解l 拥有良好的直觉特征。
以用户所熟悉的现实世界事务的抽象来给用户暗示和隐喻,来帮助用户能迅速学会软件的使用。
l 较快的响应速度。
l 简单且美观。
1.2. 原则详述1.2.1. 用户控制用户界面设计的一个重要原则是用户应该总是感觉在控制软件而不是感觉被软件所控制。
l 操作上假设是用户--而不是计算机或软件--开始动作。
用户扮演主动角色,而不是扮演被动角色。
在需要自动执行任务时,要以允许用户进行选择或控制它的方式来实现该自动任务。
l 提供用户自定义设置。
因为用户的技能和喜好各不相同,因此他们必须能够个性化界面的某些方面。
Windows为用户提供了对许多这方面的访问。
您的软件应该反应不同的系统属性--例如颜色、字体或其他选项的用户设置。
l 采取交互式和易于感应的窗口,尽量避免使用模态对话框,而使用"非模式"辅助窗口。
"模式"是一种状态,它排除一般的交互,或者限制用户只能进行特定的交互。
当最好使用一个模式或该模式只是可替换的设计时--例如,用于在一个绘图程序中选定一个特定感觉--请确保该模式是显然的、可见的,是一个明确的用户选定的结果,并且容易取消。
l 在后台运行长进程时,保持前台式交互。
