实验5 交互设计要素之图标

《实验5 交互设计要素之图标》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、实验报告学院：计科院专业：班级：成绩：姓名：学号：组别：组员：实验地点：实验日期：指导教师签名：预习情况操作情况考勤情况数据处理情况实验5项目名称：交互设计要素之图标1、实验目的理解图标在人际交互中的作用，理解基本的图标设计技术方法，能够根据一定的设计要求设计图标。2、实验内容2.1图标在人机交互中的作用图标是图形界面中最为重要的交互元素。用户除了通过文本获取系统发出的信息外，主要就是靠识别图标来理解系统。为什么图标在交互设计中如此重要？原因是多方面的：l图标比文本更易回忆和识别。也就是说，用户更容易记住图标而不是

2、文本的内容。l图标比文本更易于搜索和定位。由于图标之间的差异对比更强，因此用户在图标环境下更容易找到需要的对象（如某个功能按钮）。l图标比文本更节省屏幕空间。图标表达的丰富性使得能在方寸之间实现冗长文本所要表达的含义。l图标比文本更通用。对于有多国语言版本的软件，使用图标能改善文本翻译上的缺陷，尽管不同文化下可能对某一图标理解上可能有差异。2.2图标设计的技术基础设计图标就是要将一定的含义转化为图形，或者说把文字语言“翻译”图形语言。尽管图标设计属于美术设计范畴，不过图标设计并非盲目入手，参考过往的范例能够得到很好

3、的启发。同时，通过理解图标的表达方式及基本构成，能让图标设计有一定的规范可循。2.2.1图标的主要表达方式l象形图象形图在图标设计中最为典型。图标与图标所表达的含义有直接的对应关系。如邮件图标：l表意符号表意符号是表示思想或者概念的符号。图标与其说表达的含义不一定有直接的对应关系。如保存文件图标：l抽象形状一些数学、逻辑、科学等符号，又或者音乐符号，语言中的标点符号都可以作为抽象形状表示一定的含义。典型例子是提供帮助信息的图标：。不过用户未必能理解这些符号背后的含义。l语标符号所谓语标符号，是指表示一个词（组）的符

4、号。典型例子有，IE浏览器的图标：。这在软件界面设计上也较为常见。2.2.2图标的构成图标设计可以从最基本的构成开始。所有的图形都可以被分解为点、线、区域。线和点作为构成图形的基本元素能够组合产生复杂的符号，同时可以通过连接线形成基本的几何形状来创建区域。点、线和区域构成了图标设计的基本组合，这些组合通过与现实生活中的事物对应，就能形成表达一定含义的图标。当然后续还有很多工作要做，例如渲染颜色，立体化等等，这样才能成为一个真正有实用价值的图标。下图a-e展示了图标的基本构成以及演变过程。进一步，可以利用组合一些已有

5、的基础图标来得到含义更为丰富的图标。下面是几个典型的例子。除此之外，为了获得表示动作、运动以及方向，常用各种线条和箭头。例如光线、声波表达，又例如打开文件夹图标中的箭头的使用，都是很好的借鉴例子。更多的例子还有，表示运动的加速线，和抖动线等等。2.2.3图标的大小和颜色一般来说，图标应该是正方形的。常用的尺寸有32×32像素、48×48像素、64×64像素或者128×128像素。颜色方面，技术上可以支持16色或者256色，然而实际上，一个图标最好只使用较少数量并且易于区分的颜色，这样有助于用户的记忆和识别。2.2.

6、4其他要点含义清晰，易懂是图标设计的最重要也是最基本的要求。一些设计的原则要点可供参考：l图标要符合习惯。例如，搜索是一个放大镜图标，主页是一间屋子，而一辆小推车代表商务网站的购物车。图标作为一种语言，尽管没有十分严格的规范，但许多约定俗成是必须遵守的。这样才能地设计出图标。已有的基本图标是实现有效且快速设计图标的基本素材。l图标要尽量简单。过多的图标细节实际会对用户造成困难。因此在表达方式、颜色、线条上不能过于复杂。l图标的含义要尽量明确。同样一个放大镜图标，用在文件系统中表示的是搜索功能，但用在图像处理软件中却

7、是表达放大图像的含义。因此图标的含义实际需要在一个具体的情景（上下文）中确定。这一点跟文字语言中的多义词是一样的。一些必要的组合和改动能有效地明确图标所表达的含义，例如用于放大图像的图标往往通过组合“放大镜”和“+”号来进一步明确图标说要表达的含义。作业（1）分析你所用的手机软件系统界面，列出你认为的系统中表达最好的图标和表达最差的图标（最好能用图片说明），说明你的分析理由。个人认为手机系统中表达最好的图标是计算器图标和电话图，因为两个图标都能形容地表达也其功能，只要看一眼就知道他的功能所在。而表达最着的是照相机和

8、快讯图标，照相机图标看不出他的功能，而快讯图标则不知是什么东西，两个都不能表达出其功能。（2）假设现在要为某图书馆的读者服务软件界面设计两套图标方案，设计如下功能按钮的图标：l用户状态信息查询按钮l图书检索功能按钮l图书续借功能按钮l缺书登记功能按钮l用户意见反馈功能按钮最后，请为该软件设计一个标志性图标，该图标将显示在程序的标题栏以及快捷方式等地方。图标大