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

实验报告 学院： 计科院 专业： 班级： 成绩： 姓名： 学号： 组别： 组员： 实验地点： 实验日期： 指导教师签名： 预习情况 操作情况 考勤情况 数据处理情况 实验 5 项目名称： 交互设计要素之图标 实验目的 理解图标在人际交互中的作用，理解基本的图标设计技术方法，能够根据一定的设计要求设计图标。 实验内容 2.1 图标在人机交互中的作用 图标是图形界面中最为重要的交互元素。用户除了通过文本获取系统发出的信息外，主要就是靠识别图标来理解系统。为什么图标在交互设计中如此重要？原因是多方面的： 图标比文本更易回忆和识别。也就是说，用户更容易记住图标而不是文本的内容。 图标比文本更易于搜索和定位。由于图标之间的差异对比更强，因此用户在图标环境下更容易找到需要的对象（如某个功能按钮）。 图标比文本更节省屏幕空间。图标表达的丰富性使得能在方寸之间实现冗长文本所要表达的含义。 图标比文本更通用。对于有多国语言版本的软件，使用图标能改善文本翻译上的缺陷，尽管不同文化下可能对某一图标理解上可能有差异。 2.2 图标设计的技术基础 设计图标就是要将一定的含义转化为图形，或者说把文字语言“翻译”图形语言。尽管图标设计属于美术设计范畴，不过图标设计并非盲目入手，参考过往的范例能够得到很好的启发。同时，通过理解图标的表达方式及基本构成，能让图标设计有一定的规范可循。 2.2.1 图标的主要表达方式 象形图 象形图在图标设计中最为典型。图标与图标所表达的含义有直接的对应关系。如邮件图标： 表意符号 表意符号是表示思想或者概念的符号。图标与其说表达的含义不一定有直接的对应关系。如保存文件图标： 抽象形状 一些数学、逻辑、科学等符号，又或者音乐符号，语言中的标点符号都可以作为抽象形状表示一定的含义。典型例子是提供帮助信息的图标：。不过用户未必能理解这些符号背后的含义。 语标符号 所谓语标符号，是指表示一个词（组）的符号。典型例子有，IE浏览器的图标：。这在软件界面设计上也较为常见。 2.2.2 图标的构成 图标设计可以从最基本的构成开始。所有的图形都可以被分解为点、线、区域。线和点作为构成图形的基本元素能够组合产生复杂的符号，同时可以通过连接线形成基本的几何形状来创建区域。点、线和区域构成了图标设计的基本组合，这些组合通过与现实生活中的事物对应，就能形成表达一定含义的图标。当然后续还有很多工作要做，例如渲染颜色，立体化等等，这样才能成为一个真正有实用价值的图标。下图a-e展示了图标的基本构成以及演变过程。 进一步，可以利用组合一些已有的基础图标来得到含义更为丰富的图标。下面是几个典型的例子。 除此之外，为了获得表示动作、运动以及方向，常用各种线条和箭头。例如光线、声波表达，又例如打开文件夹图标中的箭头的使用，都是很好的借鉴例子。更多的例子还有，表示运动的加速线，和抖动线等等。 2.2.3 图标的大小和颜色 一般来说，图标应该是正方形的。常用的尺寸有32×32像素、48×48像素、64×64像素或者128×128像素。颜色方面，技术上可以支持16色或者256色，然而实际上，一个图标最好只使用较少数量并且易于区分的颜色，这样有助于用户的记忆和识别。 2.2.4 其他要点 含义清晰，易懂是图标设计的最重要也是最基本的要求。一些设计的原则要点可供参考： 图标要符合习惯。例如，搜索是一个放大镜图标，主页是一间屋子，而一辆小推车代表商务网站的购物车。图标作为一种语言，尽管没有十分严格的规范，但许多约定俗成是必须遵守的。这样才能地设计出图标。已有的基本图标是实现有效且快速设计图标的基本素材。 图标要尽量简单。过多的图标细节实际会对用户造成困难。因此在表达方式、颜色、线条上不能过于复杂。 图标的含义要尽量明确。同样一个放大镜图标，用在文件系统中表示的是搜索功能，但用在图像处理软件中却是表达放大图像的含义。因此图标的含义实际需要在一个具体的情景（上下文）中确定。这一点跟文字语言中的多义词是一样的。一些必要的组合和改动能有效地明确图标所表达的含义，例如用于放大图像的图标往往通过组合“放大镜”和“+”号来进一步明确图标说要表达的含义。 作业 分析你所用的手机软件系统界面，列出你认为的系统中表达最好的图标和表达最差的图标（最好能用图片说明），说明你的分析理由。 个人认为手机系统中表达最好的图标是计算器图标和电话图，因为两个图标都能形容地表达也其功能，只要看一眼就知道他的功能所在。 而表达最着的是照相机和快讯图标，照相机图标看不出他的功能，而快讯图标则不知是什么东西，两个都不能表达出其功能。 假设现在要为某图书馆的读者服务软件界面设计两套图标方