征集网锐志网络淘途找素材上91
创意在线首页
平面设计交互设计CG动漫工业设计建筑环境数码影像创意搜
 首页大赛征集资讯教程画廊访谈作品集创企同盟设计招聘人才专区竞赛台专题论吧 找素材看酷站设计网址库
交互设计首页
当前位置:首页 > 交互设计 > 观点 > 正文
用户界面设计风格说明
作者: 来源:chinaui 发表时间:2006-8-23 21:44:44 浏览:

1引言 
1.1设计说明 
本文档是对系统界面设计风格进行描述,和用户交互的最终界面在《详细设计说明书》中设计和解释。 

1.2概念和定义 
用户界面:又称人机界面,实现用户与计算机之间得通信,以控制计算机或进行用户和计算机之间得数据传送得系统部件。 
GUI:即图形用户界面,一种可视化得用户界面,它使用图形界面代替正文界面。 

1.3用户假定 
将使用本系统的用户定义为:对应用程序或计算机的一般用法有一定了解,用户希望界面符合WINDOWS9X特别是OFFICE97风格,对易用性、简洁性有比较高的要求,对界面快速交互没有很强的要求(即不希望通过命令方式快速交互)。 

2用户界面设计规范 
2.1用户界面设计原则 
本系统坚持图形用户界面(GUI)设计原则,界面直观、对用户透明:用户接触软件后对界面上对应的功能一目了然、不需要多少培训就可以方便使用本应用系统。 
界面设计员应该明白软件中用户是所有处理的核心,不应该有应用程序来决定处理过程,所以用户界面应当由用户来控制应用如何工作、如何响应,而不是由开发者按自己的意愿把*作流程强加给用户。 
界面设计必须经过确认才能完成。 

2.2界面一致性 
在界面设计中应该保持界面的一致性。一致性既包括使用标准的控件,也指使用相同的信息表现方法,如在字体、标签风格、颜色、术语、显示错误信息等方面确保一致。 
1)显示信息一致性标准 
(1)标签提示:字体为不加重、宋体、黑色、灰底或透明、无边框、右对齐、不带冒号、一般情况为五号(10号); 
(2)日期:正常字体、宋体、白底黑字、3-D lowered; 
(3)对齐方法: 
l 左对齐:一般文字、单个数字、日期等 
l 右对齐:数字、时间、日期加时间。 
(4)分辨率为800*600,增强色16色 
(5)字体缺省为宋替、五号、黑色 
(6)底色缺省采用灰色 
这些信息的排列显示风格供参考, 在同一个应用中,这些信息的表现方式不一致,会使得用户分散注意力,影响这一软件的使用,因此开发者应当注意在同一软件中表现形式的一致性。 
2)布局合理化原则 
应注意在一个窗口内部所有控件的布局和信息组织的艺术性,使得用户界面美观。 
在一个窗口中按tab键,移动聚焦的顺序不能杂乱无章,tab 的顺序是先从上至下,再从左至右。一屏中首先应输入的和重要信息的控件在tab顺序中应当靠前,位置也应放在窗口上较醒目的位置。 布局力求简洁、有序、易于*作。 
3)鼠标与键盘对应原则 
应遵循的是可不用鼠标的原则:应用中的功能只用键盘也应当可以完成,即设计的应用中还应加入一些必要的按钮和菜单项。 
但是,许多鼠标的*作,如双击、拖动对象等,并不能简单地用键盘来模拟即可实现。例如在一个列表框中用鼠标双击其中一项可以表示选中该项内容。为了用键盘也能实现这一功能,必须在窗口中定义一个表示选中的按钮,以作为实现双击功能的替代(或其它方式)。又如在一个窗口中有两个数据窗口,可以用鼠标从一个数据窗口中将一项拖出然后放到另一个中。如果只用键盘,就应当在菜单中设置拷贝或移动的菜单项。 


1 2
在线编辑:52design
本文链接:


推荐阅读:
·2021第十五届“创意中国”设计大奖 征稿章程
·2021第七届“学院派奖”全国艺术与设计大赛征集公告
·青春唯美插画培训网络远程班正在招生
·第八届中国高等院校设计作品大赛启动
·第十二届中国高校美术作品学年展获奖名单公布
·2021第七届“学院派奖”全国艺术与设计大赛征集公告
·第六届“包豪斯奖”国际设计大赛获奖名单揭晓
免责声明:本站刊载此文不代表同意其说法或描述,仅为提供更多信息。对本文有异议,请联络本站!
转载要求:文章作者及来源信息必需保留。转载之图片、文件请不要盗链本站地址,且不准打上各自站点的水印!

近期推荐报道 返回首页更多精彩等着你!

Illustrator| 用AI创建精细矢量插图徽章Photoshop| PS经典合成张开血盆大嘴樱桃
Photoshop| Photoshop自制个性的黑色翅膀摄影佳作| 德国Thomas Wuhrer长腿女郎性
Photoshop| Photoshop制作超酷的边缘发光的荧CorelDraw| CorelDRAW制作编织效果详细教程
Illustrator| illustrator制作潮流海报字体摄影佳作| 惊艳的Francesco Marconi
Photoshop| 利用画笔及图层样式制作方格子艺术纹理背景Photoshop| Photoshop制作简单时尚的彩色放射
关于本站 | 联系方式 | 商业服务 | 合作伙伴 | 站点地图 | 免责声明 | 版权声明 | 在线投稿