首页>>新闻资讯>>行业动态

华为用户界面设计规范

2023-11-14 20:33:56 30

原标题:华为用户界面设计规范

后台回复 竞品 免费送你《10份精选竞品分析文档》

用户界面:又称人机界面,实现用户与计算机之间的通信,以控制计算机或进行用户与计算机之间的数据传送的系统部件。

GUI:即图形用户界面,一种可视化的用户界面,它使用图形界面代替正文界面。本系统坚持图形用户界面(GUI)设计原则,界面直观、对用户透明。用户接触软件后对界面上对应的功能一目了然、不需要多少培训就可以方便地使用本应用系统。

1、界面设计介绍

界面设计是为了满足软件专业化标准化的需求而产生的对软件的使用,界面进行美化优化规范化的设计分支。

1)软件启动封面设计

应使软件启动封面最终为高清晰度的图像,选用的色彩不宜超过256色,大小多为主流显示器分辨率的1/6大。

启动封面上应该醒目地标注制作或支持的公司标志、产品商标、软件名称、版本号、网址、版权声明、序列号等信息,以树立软件形象,方便使用者或购买者在软件启动的时候得到提示。

插图宜使用具有独立版权的、象征性强的、识别性高的、视觉传达效果好的图形,若使用摄影也应该进行数位处理,以形成该软件的个性化特征。如果是系列软件还将考虑整体设计的统一和延续性。

2)软件框架设计

软件的框架设计要复杂得多。软件框架设计应该简洁明快,尽量少用无谓的装饰,应该考虑节省屏幕空间,各种分辨率的大小,缩放时的状态和原则,并且为将来设计的按钮、菜单、标签、滚动条及状态栏预留位置。

设计中将整体色彩组合进行合理搭配,将软件商标放在显著位置,主菜单应放在左边或上边,滚动条放在右边,状态栏放在下边,以符合视觉流程和用户使用心理。

3)软件按钮设计

软件按钮设计应该具有交互性,即应该有3到6种状态效果:点击前鼠标未放在上面时的状态;鼠标放在上面但未点击的状态;点击时状态;点击后鼠标未放在上面时的状态;不能点击时状态;独立自动变化的状态。

按钮应具备简洁的图示效果,名称易懂,用词准确,能望文知意最好,让使用者产生功能关联反应,群组内按钮应该风格统一,功能差异大的按钮应该有所区别。

4)软件面板设计

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

5)菜单设计

菜单设计一般有选中状态和未选中状态,左边应为名称,右边应为快捷键。如果有下级菜单应该有下级箭头符号,不同功能区间应该用线条分割。对与进行的操作无关的菜单要用屏蔽的方式加以处理,如果采用动态加载方式,即只有需要的菜单才显示最好。

主菜单的宽度要接近,字数不应多于四个,每个菜单的字数能相同最好。主菜单数目不应太多,最好为单排布置。

6)标签设计

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

7)图标设计

图标设计色彩不宜超过64色,大小为16x16、32x32两种,应该加以着重考虑

视觉冲击力,它需要在很小的范围表现出软件的内涵,在设计时使用简单的颜色,利用眼睛对色彩和网点的空间混合效果,做出精彩图标。

8)滚动条及状态栏设计

滚动条主要是为了对区域性空间的固定大小中内容量的变换进行设计,应该有上下箭头,滚动标等,有些还有翻页标。

状态栏是为了对软件当前状态的显示和提示。

9)安装过程设计

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

10)包装及商品化

最后软件产品的包装应该考虑保护好软件产品,功能的宣传融合于美观中,可以印刷部分产品介绍。

2、界面设计原则

1)易用性

完成相同或相近功能的按钮用Frame框起来,常用按钮要支持快捷方式; 完成同一功能或任务的元素放在集中位置,减少鼠标移动的距离; 按功能将界面划分局域块,用Frame框括起来,并要有功能说明或标题; 界面要支持键盘自动浏览按钮功能,即按Tab键的自动切换功能; 同一界面上的控件数最好不要超过10个,多于10个时可以考虑使用分页界面显示; 分页界面要支持在页面间的快捷切换,常用组合快捷键Ctrl Tab; 默认按钮要支持Enter及选操作,即按Enter后自动执行默认按钮对应操作; 可写控件检测到非法输入后应给出说明并能自动获得焦点; Tab键的顺序与控件排列顺序要一致,目前流行从上到下、从左到右的方式; 复选框和选项框要有默认选项,按选择机率的高低而先后排列,并支持Tab 选择; 界面空间较小时使用下拉框而不用选项框; 选项数较少时使用选项框,相反使用下拉列表框; 适当使用相关的专业术语,提倡使用通用性字眼。

2)规范性

通常界面设计都按Windows界面的规范来设计,即包含“菜单条、工具栏、工

具厢、状态栏、滚动条、右键快捷菜单”的标准格式。

小型软件一般不提供工具厢。

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

3)合理性

屏幕对角线相交的位置是用户直视的地方,正上方四分之一处为易吸引用户注意力的位置,在放置窗体时要注意利用这两个位置。 父窗体或主窗体的中心位置应该在对角线焦点附近; 子窗体位置应该在主窗体的左上角或正中,多个子窗体弹出时应该依次向右下方偏移,以显示出窗体标题为宜; 重要的命令按钮与使用较频繁的按钮要放在界面上注目的位置; 与正在进行的操作无关的按钮应该加以屏蔽(Windows中用灰色显示,没法使用该按钮) ; 对可能造成数据无法恢复的操作必须提供确认信息,给用户放弃选择的机会。

4)美观与协调性

按钮大小基本相近,且与界面的大小、空间要协调,忌用太长的名称; 避免空旷的界面上放置很大的按钮,放置完控件后界面不应有很大的空缺位置; 前景与背景色搭配合理协调,反差不宜太大,最好少用深色,常用色考虑使用Windows界面色调; 界面风格要保持一致,字的大小、颜色、字体要相同,除非是需要艺术处理或有特殊要求的地方; 如果窗体支持最小化、最大化或放大时,窗体上的控件也要随着窗体而缩放; 对于含有按钮的界面一般不应该支持缩放,即右上角只有关闭功能; 通常父窗体支持缩放时,子窗体没有必要缩放。

5)界面一致性

在界面设计中应该保持界面的一致性。一致性既包括使用标准的控件,也指使用相同的信息表现方法,如在字体、标签风格、颜色、术语、显示错误信息等方面确保一致。

显示信息一致性

① 标签提示:字体为不加粗、宋体、黑色、灰底或透明、无边框、右对齐、不带冒号、一般情况为五号;

② 日期:正常字体、宋体、白底黑字;

③ 对齐方法

左对齐:一般文字、单个数字、日期等

右对齐:数字、时间、日期加时间

④ 分辨率800*600,增强色16色;

⑤ 字体缺省为宋体、五号、黑色;

⑥ 底色缺省为灰色。

这些信息的排列显示风格供参考, 在同一软件中应当注意表现形式的一致性。

布局合理化

应注意在一个窗口内部所有控件的布局和信息组织的艺术性,使得用户界面美观。布局不宜过于密集,也不能过于空旷,合理的利用空间。

在一个窗口中按tab键,移动顺序不能杂乱无章,先从上至下,再从左至右。一屏中首先应输入的和重要信息的控件在tab顺序中应当靠前,并放在窗口上较醒目的位置。布局力求简洁、有序、易于操作。

鼠标与键盘对应

应用中的功能只用键盘也应当可以完成,即设计的应用中还应加入一些必要的按钮和菜单项。但是,许多鼠标的操作,如双击、拖动对象等,并不能简单地用键盘来模拟即可实现。

例如在一个列表框中用鼠标单击其中一项表示选中该项内容,为了用键盘也能实现这一功能,必须在窗口中定义一个表示选中的按钮,以作为实现单击功能的替。

又如在一个窗口中有两个数据窗口,可以用鼠标从一个数据窗口中将一项拖出然后放到另一个中,如果只用键盘,就应当在菜单中设置拷贝或移动的菜单项。

快捷键

在菜单项中使用快捷键可以让使用键盘的用户操作得更快一些,在Windows及其应用软件中快捷键的使用大多是一致的。本系统中应用的快捷键在各个配置项上语义必须保持一致。

Ctrl-O 打开 Ctrl-Tab 下一窗口

Ctrl-S 保存 Ctrl-Esc 任务列表

Ctrl-C 拷贝 Ctrl-F4 关闭窗口

Ctrl-V 粘贴 Alt-F4 结束应用

Ctrl-D 删除 Alt-Tab 下一应用

Ctrl-X 剪切 Enter 缺省按钮/确认操作

Ctrl-I 插入 Esc 取消按钮/取消操作

Ctrl-H 帮助 Shift-F1 上下文相关帮助

Ctrl-P 打印

Ctrl-W 关闭

其它快捷键

其它快捷键使用汉语拼音的开头字母,不常用的可以没有快捷键。

向导

对于应用中某些部分的处理流程是固定的,用户必须按照指定的顺序输入操作信息,为了使用户操作得到必要的引示应该使用向导,使用户使用功能时比较轻松明了,但是向导必须用在固定处理流程中,并且处理流程应该不少于3个处理步骤。

用户帮助

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

常用的帮助设施有两种:集成的和附加的。集成的帮助设施一开始就是设计在软件中的,它与语境有关,用户可以直接选择与所要执行操作相关的主题。通过集成帮助设施可以缩短用户获得帮助的时间,增加界面的友好性,附加的帮助设施在系统建好以后再加进去,通常是一种查询能力比较弱的联机帮助。

帮助文档中的性能介绍与说明要和系统性能配套一致; 操作时要提供及时调用系统帮助的功能,常用F1; 最好提供目前流行的联机帮助格式或HTML帮助格式; 用户可以用关键词在帮助索引中搜索所要的帮助,当然也应该提供帮助主题词;在帮助中应该提供我们的技术支持方式,一旦用户难以自己解决可以方便地寻求新的帮助方式。 出错信息和警告

出错信息和警告是指出现问题时系统给出的坏消息,信息以用户可以理解的术语描述。

(1)信息应提供如何从错误中恢复的建设性意见;

(2)信息应指出错误可能导致哪些不良后果,以便用户检查是否出现了这些情况并帮助用户进行改正;

(3)信息应伴随着视觉上的提示,如特殊的图像、颜色或者信息闪烁;

(4)信息不能带有判断色彩,即在任何情况下不能指责用户。

一般交互

(1)一致性:菜单选择、数据显示以及其它功能都应使用一致的格式;

(2)提供有意义的反馈;

(3)在数据录入上允许取消大多数操作;

(4)减少在动作间必须记忆的信息数量;

(5)允许用户非恶意错误,系统应保护自己不受致命错误的破坏。

数据输入

(1)尽量减少用户输入动作的数量;

(2)维护信息显示和数据输入的一致性;

(3)交互应该是灵活的,对键盘和鼠标输入的灵活性提供支持;

(4)在当前动作的语境中使不合适的命令不起作用。

独特性

如果一味地遵循业界的界面标准,则会丧失自己的个性。在框架符合规范的情况下,设计具有自己独特风格的界面尤为重要,在商业软件流通中会有很好的潜移默化的广告效用。安装界面上应有单位介绍或产品介绍,并有自己的图标。

关于陪学网(www.pexue.com):我们6年来专注于产品管理类课程的开发与制作,志在为产品经理、交互设计、平面设计、需求人员分享最新、最好的产品类课程。学员遍布国内外知名互联网产品团队:百度、新浪、腾讯、领英等返回搜狐,查看更多

责任编辑:

相关标签:

发表评论:

评论记录:

未查询到任何数据!