软件界面设计设计.doc

《软件界面设计设计.doc》由会员分享，可在线阅读，更多相关《软件界面设计设计.doc（27页珍藏版）》请在得力文库 - 分享文档赚钱的网站上搜索。

1、【精品文档】如有侵权，请联系网站删除，仅供学习与交流软件界面设计设计.精品文档.第一章 绪论1.1 课题的研究背景和意义用户来看一个软件首先是通过界面的，通过界面来感知软件的好坏，界面关乎着一个软件的形象。软件界面设计是产品开发中最重要的方面。界面设计师必须要牢记：界面是面向用户的。开发者开发的软件必须满足用户的需求，并且保证软件易于使用。重视用户界面设计有重要的意义。用户界面设计得越直观，越易用，越美观，用户就使用得越方便，越舒服，培训用户、维护系统的成本就越低。客户支持成本降低了，系统就会更便宜，同时，也将获得更多的用户好感和订单，企业的效益就会更好。1.2 软件界面设计的现状和基本对策尽

2、管软件行业有许多技术出色的软件工程师，但多数工程师开发出来的软件既不好用又不美观。客户对软件界面非常的不满意，经常要修改软件界面，导致极大的生产力浪费。用户满意的好界面都是软件企业想要做的，但是他们却不知道怎么做。软件界面设计一直以来都是中国软件行业的弱项，这里存在两方面行业共性问题：一是缺乏系统性的软件界面设计方法和相关的教育；这也导致了第二个问题“缺乏优秀的界面设计师和熟练的界面程序员”。千万不要认为软件开发就是编程，仅懂编程的人，绝不可能做出好的软件系统。要成为优秀的软件人才，仅学会编程语言是远不够的。系统性的科学技术教育是国内理工科大学的计算机和软件专业偏向的重点。基础课程有物理、数学

3、、电学等，专业课程有数据库、网络管理、编程语言等等。而且每门课程都有很好的教材，有的是国外外文的，而且有很好的老师。所以国内理工科大学要培养出大量技术功底扎实的软硬件研发人才并不难。相比照之下，软件界面设计专业的教育就差得远了。既缺乏好的教材，又缺乏优秀的教师。因为计算机软件专业学生接受的教育几乎都是科学技术理论知识，他们对于设计出易用美观的用户界面感到很茫然，许多人甚至不知道还有界面设计这回事。 我们把软件界面开发分为三个环节：交互设计、视觉设计和程序实现。企业希望界面设计师负责“交互设计和视觉设计”，由熟练的程序员实现这个界面，这个要求其实并不高，但现实情况却不理想。不少软件企业不但有程序

4、员，还有美工人员，但遗憾的是这两类人不会配合着工作。大多数人都认为界面设计是美工人员的事情，否则公司招聘美工人员有什么用？ 编程实现是在美工人员完成界面设计后进行，由程序员负责的，至于界面设计好不 好程序员不去管。美工人员大多是美术相关类专业毕业，他们的优点是擅长于视觉设计，缺点是：不知道待开发软件系统的业务逻辑，不了解用户的特征，难以开展交互设计；不懂得软件技术，他们不了解自己做出来的界面在技术实现方面的难易程度。千万不要低估界面实现的难度，界面不是想做就能做得出的。有些Web软件界面控件，不仅要功能好、性能好，还要易用，可以说技术难度非常高，这不是一般程序员能做得好的。 可见美工人员并不属

5、于理想的软件界面设计师。就目前情形来看，既能做好交互设计又能做好视觉设计的界面设计师还是比较少见的，能够在做好交互设计、视觉设计的基础上再做好程序实现的人更加罕见。 我作为一名学生，肯定不可能去改变中国的教育方法和体系，能做的只有总结一些软件界面设计的规范来供读者（开发人员）参考。第二章 软件界面设计应遵循的原则本论文总结了软件界面设计应遵循的原则：以目标用户为中心，容易被理解，反馈操作信息，排错性考虑，最少步骤（最高操作效率），合理的布局，色彩的选择与组合。读者（开发者）理解这些设计原则的含义后，要结合准备的开发软件的基本特征，进一步融会和细研究，从而确定开发软件的界面设计原则。2.1 以用

6、户为中心以用户为中心，这是第一重要的界面设计原则，关系着软件的好坏。不以目标用户为中心开发出来的界面，用户不会购买，即使买了也不会去用，即使界面美观也没用。有些通用的软件系统如操作系统、文字处理软件等，面向的用户十分地广泛。可是由于用户群体之间生活的环境不同，从而会存在年龄、性别、语言、教育程度的差异，进而导致使用习惯也有很大差异。在设计软件界面之前，各类用户群体的使用习惯是我们需要迫切了解的，努力使用户在操作软件界面的时侯感觉不到麻烦，一般要为了适应各种类型的用户提供多种操作途径。举例来说，Windows系统的文件管理器，对于一个初学电脑的人来说，他愿意使用鼠标、菜单一步一步慢慢地操作；但是

7、对于熟练使用电脑的人而言，快捷键也许是他更愿意用的。不要试图让一款产品在差异很大的用户群体中得到适用，要把广泛的用户划分为多个用户群体，根据自己所在企业的实力，选择一个分市场来开发产品。一款产品最好是只面向一个用户群体，这样容易设计而且质量也可靠。2.2 容易被理解在用户使用界面前，一定要确保理解界面的意图。以下措施可以提高用户界面的可理解性：1.用户界面中的所有元素都不能有错误文字，也不能出现让人费解的文字。2.图标一定要直观明了，最好让用户看到这个图标就能知道这是什么含义。假如图标比较抽象，则应给图标加上文字说明，不让用户误解。3.所有的界面元素应当给予有必要的提示。4.界面结构要能够清晰

8、地反映软件工作流程，这样用户就能有条不紊地操作。5.没有先后逻辑关系的选择项，如姓名、标题等，可以按照字母排序，便于用户选择。但是不要把功能菜单、有严格逻辑关系的状态集按照字母顺序排列。2.3 排错行考虑 用户在使用软件时，一些错误是时有发生的，当然也有一些是用户人为造成的，那么有什么方法来降低出错几率呢。1.排错应该遵循的细则。2.非正常中止的错误是最重要的，也最应该排除。3.应当尽可能防止用户无意输入无效的数据。4.采用一些控件限制用户输入数据的类型。5.如果可能作出的选择只有两个，可以采用单选框来减少用户输入的麻烦。6.当选择再多一些时，可以采用复选框。7.当选项很多时，可以采用列表框。

9、8.在一个应用系统中，应当避免未经授权的操作，然后没有意义的操作也要避免。9.对于某些输入字符，可能会引起严重错误甚至会让系统出错，应该要加以限制或屏蔽。10.对于特殊符号，输入会与系统使用的符号产生冲突，该字符应该被阻止输入的。11.当用户产生错误的操作时，软件最好能够提供取消系列操作。12.对有些等待时间可能较长的操作软件最好能够提供取消功能。13.与系统正在使用的保留字符可能会产生冲突的一定要加以限制。14.在用户已输入的信息被系统读入时，可以根据需要选择来判断要不要去掉前后空格。2.4 最少操作步骤 在设计用户界面的过程中，软件设计师应当尽可能多地为用户着想，让用户用最少的操作步骤完成

10、某项任务，保证使用效率达到最高，最大程度地让用户满意。尽管减少一个操作步骤所节约下来的时间很短，似乎可以忽略不计，但是让用户感觉起来，反差却很强烈。而且如果每个环节都能节约一点，整个工程下来，节约的时间就很长了，所谓聚少成多。界面设计师一定要在深入地分析熟悉软件的业务流程和用户使用习惯的基础上，才能设计出最少的操作步骤，使效率最大化。2.5 合理的布局 首先，一定的逻辑性要在界面的总体布局中体现出来，总体布局最好能够与工作流程吻合。界面设计人员要在全面地了解软件需求的前提下，才能找到对界面布局有一定帮助的信息。其次，对于窗口上的界面元素的布局有整齐清爽的要求。界面元素要在水平方向对齐，或者在垂

11、直方向上使界面元素对齐，还要保证一样的行、列间距。要保证合适的窗体尺寸，界面元素不要放得太拥挤，在边界的地方要留有一定的空间，但是也不能太宽松，那样会显得零乱。界面元素要保证一致对齐，以避免产生不齐整的视觉效果。同类型界面元素要尽量在大小上保持一致，最起码在高度或宽度上一定要保证一样。与逻辑有关系的元素应就近放置，这样用户方便操作一些。另外要善于利用窗体的空白，还有分割用的线条。 2.6 一致性 界面一致性的体现包含了诸多方面，其中最需要注意的是一下几点： 1.界面设计与企业营销的策略风格一致。 2.与不同产品操作界面的使用方法一致。 3.与同一产品不同版本的界面保持一致。 4.与用户的预期一

12、起。 5.与页面元素一致。 6.产品在隐喻上的设计一致。 每件产品的用户族群都相当广泛，要与所有用户预期一致其实是很困难的。但至少在评估这个话题时，可以首先界定目标用户群，分析用户需求，随之有效地探究界面一致性如何与用户预期吻合。2.7 色彩的选择与组合在界面设计中，色彩的色调和组合关系会短时间起到“凝聚”用户视觉的作用，同时也会使用户产生心理的变化。2.7.1 色彩的联想虽然色彩的联想作用在心理学范畴内，但是它的适用性却体现在了艺术设计中。若不能够预测人是如何感知色彩的、如何发生作用的，也就不可能有效地应用色彩。色彩的象征意义和心理暗示从人类的高级情感来分析，具体如下：1.红色红色是一种令人

13、激奋的色彩。它能使人产生冲动、愤怒、热情、活力的感觉。这种色彩在女性和男性之间、衰老和年轻之间、内向和外向之间、意志薄弱和坚强之间，均倾向于后者。红色最能引起人的视觉注意，因此，红色常被作为心理上的警示。在逐渐变暗时，红色变得深沉而庄重；反之则变得有激情而欢快。在色环上，当红色变向紫色时，红色就逐渐由兴奋变为安静，变得浪漫、豪华、严肃、富裕、强大和优雅。当红色在色环上偏近黄色时，红色就变得更加具有爆发力、煽动力和暴力倾向。2. 黄色黄色能体现出快乐、希望和轻快的个性，它的明度是最高的，是一种自我膨胀和寻求幸运的颜色。黄色还具有警示作用。可能是对于马峰或黄蜂身上的黄黑条纹的恐惧联想，一般能马上注

14、意到这种颜色搭配所暗示的危险的存在，这就是在现实生活中一些危险的地方，如变压器、停车位、放射性工作间等处，常能看见黄黑色设计的条纹和图表的原因。3. 蓝色 蓝色具有凉爽、清新、专业的个性。在视觉上往往给人一种被动、静谧、深邃、潮湿、谨慎、忧郁、科技和理智的感觉。他颇受成年人的喜爱，因为它表现得更加理智、更加成熟。蓝色越深，就越显得深邃、遥远；反之，便会引起人梦幻、童话、清凉的感受。4.绿色绿色具有黄色和蓝色的某些特征，使人联想到和睦、宁静、健康、坚定。在色环上绿色偏近黄色时，就变得温暖、活泼、健康而无危害。它加进一点白色，就可以产生一种女性的优雅和轻盈的感觉。当在色环上偏近蓝色时，绿色就变得更

15、加坚定、顽强和持久，这种颜色很能吸引那些能抵挡得住各种诱惑、有信念、办事稳妥并具有强烈自尊心的人。绿色已得到了广泛的运用，它已被人们理解为安全、正常和成功的象征。在街道上，绿色的灯表示可以安全通过。绿色的区域是安全的，绿色的逃生标志引导人们在紧急情况下的逃生路线；绿色的图标提示意味着一切正常等。5. 橙色橙色也像绿色一样具有其他两种颜色的特征。橙色是一种激奋的色彩，具有轻快、欢欣、开放、温馨、时尚、有活力、无拘束和感情洋溢的感觉。据研究，在橙色的氛围里时人的活动没有任何拘束，因此橙色在很大程度上代表了温暖和真挚的感情。6. 紫色紫色令人联想到昏暗、深刻、高贵、奢华、阴暗、悲哀、不可靠。紫色越深

16、，严格和呆板的效果就反映得越明显；反之，明亮的紫色会比较容易显得没有主见、脆弱、易受刺激、温柔、寂寞。值得注意的是，紫色特有的暧昧性、神秘性、不确定，在一些知识分子和社会文明程度较高的、想把处事和感情理性化的人群中受到普片的排斥。7. 白色白色具有纯洁、完美、纯真、不可触及、不可接近、神圣的、空洞的、无限的感受。白色常给人以光的联想，现在很多界面设计中具有透明质感的反光设计，实际上都是因为考虑到白色的特性。它可以让画面有一种透气感，使得界面不但有清新明亮的感觉，而且没有压迫感，也没有沉闷感。8. 黑色黑色具有深沉、神秘、寂静、压抑、高贵、消极、邪恶、坚定的感觉。任何颜色和它放置在一起都会显得醒

17、目而又有活力。9. 灰色灰色具有中庸、平凡、温和、中立、单调、矛盾、厌世、高雅的感觉。灰色越深，就越给人一种安定、沉稳、和谐的心理暗示。它本身是一种缺乏活力的颜色，在视觉上具有次要地位。综合灰色的特性，很多软件的界面设计都将不可执行的命令设计为灰色。有些色彩给人的感觉是两极的，比如黑色有时给人沉默、空虚的感觉，但有时也感觉庄严、肃穆。白色有时让人感觉到恐惧和悲哀，但有时却给人以无限的希望。每种色彩在纯度透明上略微变化，就会使人产生不同的感觉。2.7.2 色彩的心里感受色彩本是不带任何任何含义的，只是人的心里感觉把它们分成了不同的类别。例如，在夏天挂上深绿色窗帘，不见一丝阳光，就会在心理上感到非

18、常凉快。这并不是现实中的温度产生了某些变化，而是因为色彩影响到了人的内心。数字媒体界面的色彩是用户使用界面过程中引导用户行为和影响用户心里的重要因素。1. 冷暖暖色能使人感受到温暖，而冷色则使人感到寒冷。给人热情、刺激、前进、喜庆等感觉的是暖色；给人寒冷、收缩、后退等感觉的是冷色。在运用中常会见到色彩的冷暖对比，所以它非常重要。2. 轻重中性色有黑色和白色，但它们不容易分别出冷暖，轻重之分却很明显，给人厚重感觉的是黑色，给人轻快感觉的是白色。一般来说，重色彩明度不强，轻色彩明度强。3. 软硬色彩的软硬感主要由明度和纯度来衡量，一般来说有软感得色彩明度高、纯度低；有硬感的色彩明度低、纯度低。4.

19、 进退 色彩的进退感是色彩对比中“显”和“隐”现象使人产生距离上差异造成的。使人感到近的有红、黄、橙等暖色，使人感到远的有蓝、青、紫等冷色；让人感到远的那些是明度低和纯度低的色彩，让人感到近的是那些明度高和纯度高的色彩。5. 强弱 与色彩的强弱感相关的有色相、纯度,还有配色对比。在色相中，最强感的是红色；有强感的色纯度高，而且对比度大；有弱感的色纯度低，而且对比度小。在无彩色系中，最具强感的是黑色，最具弱感的是白色。 6.膨胀收缩 暖色有膨大感，明度高；冷色有收缩感，明度低。在无彩色系中，有收缩感得是黑色，有膨大感的是白色。 7.明快忧郁 色彩的明快忧郁感与明度、纯度、色相、配色对比均有关系。

20、暖色、鲜艳色有明快感，明度高，纯度高；冷色、阴晦色有忧郁感，明度低，纯度低。有明快感的配色对比大，有忧郁感的配色对比小。 8.兴奋沉静 给人以兴奋感的有暖色和明度高的色以及纯度高的色；给人以沉静感的有冷色和明度以及纯度低的色。有明快感的配色对比大，有忧郁感的配色对比小。 9.华丽朴素 给人以华丽感的色彩鲜艳、明度高；具有朴素感的色彩晦涩、深谙。有华丽感的色 彩配色对比大、有色彩系；有沉静感的色彩配色对比小；有朴素感的色彩无彩色系。2.7.3 色彩组合色彩组合原理基本上是从色彩的鲜明性、色彩的独特性、色彩的合适性、色彩的联想性4个方面来考虑的。而色彩组合的总体原则也是界面设计的主要原则，即一致性

21、。为达到色彩对界面的易用和舒适的心里影响这一目的，在对色彩进行组合的过程中，有以下几种方法可以采用借鉴：1.用一种色彩。界面的色彩变化均基于该颜色进行透明度或饱和度的调节。 2.用两种颜色。先选定一种颜色，然后选择其对比色，当然，这中间应考虑色饱和度的对比关系。3.用一个色系里的颜色进行组合。4.用黑色和一种彩色搭配。针对界面设计，需要注意的是以下几点：1.一个页面不要将所有颜色都用到，尽量控制在3中颜色以内。 2.背景和前文的对比差异尽量要大，花纹繁复的图案绝对不能用来作为背景，以免影响那些主要文字信息的读取。 3.避免不兼容得颜色大面积地放置在一起，如高饱和度的黄与蓝、红与绿等。普遍的理论

22、还有：一致的色彩被用来构建整个色彩环境，冲突的色彩被用来显示变化和提示，柔和的色彩用来增强用户的舒适度和减少疲劳，跳跃的色彩用来彰显个性，合适的对比度用来增强文字或图形的可读性等。2.7.4 色彩分析实例（音乐播放软件千千静听） 从外观上上看，千千静听有多重配色方案。高贵的黑色，淡雅的蔚蓝色，幽深的紫色，高贵的红色和银色，使每一个用户都能从中找到适合自己的、自己喜欢的外观。紫色与黑色整体颜色的搭配，看起来非常的典雅。中间又镶嵌点点蓝色，使得整个界面看起来富于变化,如图2.1。图2.1 紫色与黑色搭配橘黄色和黑色的搭配，很具有跳跃性，很活泼，如图2.2.图2.2 橘黄色和黑色搭配 浅蓝和深蓝的搭

23、配，清新自然，如图2.3。图2.3 浅蓝和深蓝搭配银色，深灰和蓝色的搭配，看起来很干净，简单，如图2.4。图2.4 银色、深灰和蓝色搭配第三章 界面元素的设计本文总结了常见界面元素的设计：字体编排与设计，动态元素设计，声音的设计与运用，图标设计。3.1 文字编排与设计文字是信息传递的主体。从最初的纯文字界面发展至今，文字仍是其他任何元素无法取代的重要构件。文字作为重要的界面构成元素，同时又是信息的重要载体，选用何种字体、何种大小、何种颜色、怎样与底色搭配、怎样排版，都深深影响着界面的视觉和运行效果。设计人员应当为用户设置一些舒适又易读的文字方案，同时也可以用户自定义文字的字体、大小和颜色，让应

24、用程序自适应用户的设定以保证文字的正常显示。系统还应保证在不同的平台、屏幕分辨率下字体的正常显示。界面设计中，文字除了注意显示问题，还应关注文字的表述方式需符合目标用户的语言认知习惯，这是实现界面易用性的一个方面。界面的类型和用途千差万别，针对不同的界面应该有不同的文字设计方案，因此，具体的设计思路和技巧需要放置在不同的界面类型和界面设计目的中区考虑。3.2 动态元素设计动态元素设计指的是界面中动与静的对比关系。一般情况下动态的图像是直接地呈现在页面中，而出现的时候伴随着交互则是另一种情况。画面也可以分两种情况呈现在画面中：第一种不改变动态元素本身的位置，在页面中利用适当的面积和节奏来做动态效

25、果，这样信息识别不会被扰乱。据研究，图形变化节奏越快，就越能吸引人的视线。所以，动态人员应保证动态的节奏以适应内容和信息传达的需要，比如可以让热点重要信息快节奏地闪烁来快速抓住用户的视线。剩下一种情况是也可以让变化的单位产生位移，这种效果能让页面气氛变得活跃，但是在用的时候要谨慎，因为它经常干扰人的注意力，有时甚至会使用户的心情变得糟糕。第二种情况指的是在交互设计过程中存在的动态效果，也就是切换页面和功能信息模块是产生的动态效果。其所需要支持的技术也很多。它可以通过变形、加入情景等方式新奇、有趣地过渡到下一页面。在交互的过程中，鼠标滑过图标上方和点击产生的效果也可以有不同的动态效果设计，以增加

26、交互过程中的趣味性和艺术行。3.3 声音的设计与运用声音一直是界面中非常重要的信息表达方式。虽然没有视觉信息那么强烈，但是恰当的声音设计可以让信息的隐喻更加丰富。声音信息的解读比视觉信息的解读更加容易，这主要依靠用户的直觉感受与生活经验。例如，警告音往往是对现实生活中警告的模拟。声音信息和视觉信息的配合也是常见的信息传递模式。在某些情境中，单有声音信息或视觉信息都无法准确表达出信息的含义，这时候两者的配合就显得很重要。界面中的声音设计主要分为指令音的趣味性设计和结合主题的背景音乐的愉悦感和想象性设计。1. 背景音乐不同的音乐有不同的感染力。正如电影配乐一样，选用什么样的界面背景音乐也是非常重要

27、的，好的界面背景音乐能给人带来美的享受，减轻操作上带来的疲劳和乏味，还可以烘托主题，让人产生丰富的联想，从而产生积极的互动行为和消极欲望。2. 指令音指令音虽然短暂，但它可以通过设计来烘托内容，提前给用户以心理的暗示。结合界面类型和风格而设计的指令音，不但可以体现界面使用的整体性和一致性，还因为反馈功能成为界面易用性实现的一个参考指标。在现实的界面设计中，并非是把界面的总体规划与界面元素设计分割开来进行，这两者虽然在考虑的顺序上存在很小的差异，但更加重要的是，作为一个界面系统整体的设计，任何割裂开来分析设计问题都是不允许和不明智的做法，因此，对界面各个方面的设计其实是互相穿插存在的，任何一方面

28、的设计都带有其他方面的元素思考。3.4 图标设计图标设计是界面设计中非常重要的部分，但很多书籍把太多的注意力投入到设计的过程和手段方面，对它的科学性关注不够。仔细研究当今的图标设计，可以发现有以下不足之处：常以美为导向，图标的外观效果被给予了太多的关注，却很少去关注内容的选择；常把设计当作导向，以设计师的爱好为图标内容的选择标准，不管用户的感受；图标的设计没有规则，即使同一系统的图标之间也没有任何关联性和相似性。以下是应该引起注意的一些地方：1. 识别图标区别于一般的图形，很好的视觉识别功能是他必须具备的。图标的出现和存在价值就是为了让人们识别，所以在图标设计中，形式美并不是关键，能不能准确地

29、被识别才是设计师的首要目标。好的图标有两个优点，一是功能一目了然，二是用户在明白图标的意思，可以引领所有相似的工具都使用和它一样的绘图语言。图标在变成范例后，它就不可动摇。有的软件开发者想试图改变范例，但这要承担令部分用户没有办法理解的风险。太简洁的符号会影响用户理解。即使用户以前知道意思，长时间后，也不可能留下很多印象。假如图标中没有唤起记忆的要素，那么要想靠表面视觉来理解图标的意思就会比较困难，这个有时会让用户放弃使用。因此在选择隐喻对象的时候一定要慎重。容易被识别的图标可以帮助用户使用某些功能，容易产生歧义的图标，尽管有好看的外表，甚至于具有一定的可比性，但那也是不可用的。2. 一致就图

30、标设计来言，一致性主要表现在3个方面。（1） 同一图标家族。从前面的介绍来看，同一图标需要根据具体的应用环境，来设计出不同尺寸和色深度的图标家族成员。但是尺寸和色深度的变动，使得设计师要保持图标外观上的一致成了一项困难的工作。但是不管怎样，大图标与小图标相比要相似，彩色的图标与黑白图标也要感觉不出差别，这样子用户在不同的显示环境下才能正常地使用软件。具体的来说，应该要从色深度较高的大图标展开设计，然后再根据具体要求，弱化那些不重要的内容，删除那些无法保留的内容，最后强化在图形中一些结构上的因素，这样各种版本感觉差不多就行了。（2） 应用程序和操作系统的图标要尽可能一致。每一次操作系统的更新也到

31、了应用软件更新的时候，软件开发商不仅仅要升级功能，还要在图形界面的风格上尽全力地追求与操作系统的一致性，这样做也是为了让用户能够在完美和谐的环境下工作。 3.兼容 图标的兼容指的是图标在不同的文化语义下都能被识别为同样的内容和意义。文件夹、画笔等等都是广泛隐喻的经典范烈。 在一种文化语义下理解的事物到了另一种文化语义下就可能不被理解，或者会被理解为其他意义。例如，用圆形、点和短线构成的图形，在大多数地方都能被理解为船舵，而在非洲某些没有船舵的部族则可能理解不了，他们可能觉得是太阳。在中国文化背景下，鱼可以理解为年年有余，是富裕的期望，在其他文化中，就会觉得中国人的这种联系很奇怪。即使在同一大文

32、化背景下，也会因为次级的语义环境而产生不同的理解。所以在设计图标时要充分考虑到各种用户在理解上的差异，确保不会发生理解上困难和偏差。4.避免文字尽量不要在图标中运用文字。图标中的文字可能会让人感到不知该怎么办，导致阻碍跨文化上的交流。图形的特点主要在于它的直观性，可以通过模拟已有的东西，让用户凭借简单的视觉对比和经验就能知道图形代表的内容及含义。语言则不是这样的，世界各地甚至于同一国家里人们使用的语言都是不太一样的，因此在母语国家看起来容易被理解的文字，对其他国家及地区的人来说那就是天书。5. 为显示而设计图标应该要在当前的显示器分辨率下，如果看起来比较好才行。因为一个个的像素点在一起就组成了

33、屏幕，水平或垂直的直线以及斜线具有较好的显示效果。曲线的显示效果不太理想，不规则的像素排列会形成锯齿状，影响线条的流畅性。即使现在许多系统都支持真彩色，对图标尺寸的限制也可以放宽，图标的设计自由度和变化越来越大，但这也并不意味着可以随意设计。一方面，用户的显示器不太一样，即便使用同一操作系统，也要照顾到好坏不一的显示效果。6. 图标示例l 操作图标操作图标说明新建绿色主色编辑具有笔状图形查询放大镜删除红色主色下载向下箭头l 提示图标提示图标说明下级目录省略号帮助问号警告感叹号返回上一级向左方向箭头返回首页房子第四章 软件界面设计流程4.1 目标用户研究在界面产品越来越面对个人用户的今天，以用户

34、为中心的设计方法成为设计人员的第一选择。在这一设计方法体系中，目标用户研究有着非常重要的位置，其工作有可能是在设计之初，也有可能贯穿于整个设计过程中。在用户研究中，人体工程学、心理工程学、社会学、和组织行为学都会提供有益的指导。用户的背景，如性别、年龄、文化背景、职业、受教育程度、经历、身体条件；用户的工作环境，如周围的物理环境、工作设备、社会和文化的影响；用户的任务组织，如任务种类、工作流程，都是需要深入调查与分析的。在目标用户研究的第一步，就是定义界面设计面向的用户群体，即如何定义目标用户并找到合适的用户研究对象。一般可以设定一些参数来对目标用户进行定义。例如，要设计一个用于手机无线环境下

35、的银行支付软件界面，可以使用两个参数来定义目标用户：使用手机无线平台的经验；使用银行支付系统的经验。进行用户定义的目的是为了在进行用户研究时找到正确的用户进行研究，而不会因为找不到恰当的用户导致结果错误。用户研究的方法有很多，常用的包括间接收集资料、展开问卷调查、实境调查、观察、访谈级焦点小组等。把这些方法进行分类，大致可以分为背景调查、观察、访谈3大类。1. 背景调查这一方法的核心是输入现有的背景资料，输出对于用户研究有用的信息。具体的方法有： （1）间接收集资料在分析类别中，最重要的研究方法是间接分析资料，也就是在图书、报刊、互联网上搜集与设计内容相关的各种背景资料。该方法的优势在于能在很

36、短的时间内获取大量与设计相关，也是非常有价值的。但是搜集的这些间接资料，有几个问题需要注意：1） 时效性。2） 重复资料。3） 非权威资料 （2）竞争对手分析无论是成功的产品还是失败的产品，竞争对手的产品都是非常重要的研究对象。对于成功的竞争产品，需要对其设计、商品表现进行分析，获得有益的设计经验；对于失败的竞争产品，则要从失败的原因入手，避免同样的错误发生在自己身上。2. 观察观察是用户研究方法中最常用到的类型。观察法需要设计人员进入到用户使用同类界面的情境中去，直接接触用户及系统，能够方便地获取大量的第一手资料。但观察法也有其弱点，那就是需要耗费较长的时间和较多的费用。通过观察，设计人员可

37、以获得一下信息：用户的使用环境；环境对界面的影响；用户完成一个任务的过程、用户是否同时还在使用其他的产品或界面；什么任务占去了用户大量的时间；用户使用产品交互系统的方式；用户在使用什么术语等。具体方法有以下两种：（1） 跟随影子法。由字面意思可想到，跟随影子法师指用户使用界面系统时设计人员跟随着用户的操作进行观察，就好像是用户的影子。在跟随过程中，设计人员可以了解到用户的使用习惯，体会到用户使用系统的感受，还可以和用户进行交流、沟通。当然，这些都是第一手资料，仅用笔来记录是完全不够的，应当同时进行拍照、录音或摄像，以便于进行整理和总结。（2） 观察视频。观察视频可以分为两种：一种是让用户都在实

38、验室进行，对于环境影响较小的界面系统研究是可以采用这种方式，如网页使用研究。而对于与环境关系密切的界面系统，如家庭娱乐系统，则可以把摄像设备安装在用户熟悉的环境里，如用户的家里。 3.访谈 访谈是一种传统的用户研究方法，由于其实施方便、成本低廉而被大量采用。主要方式如下：（1）面谈这种方法能够在面对用户的情况下进行深度的讨论，从而获得有价值的信息。主要缺点是效率低，因为面谈每个用户会花费较多的时间。面谈对于研究人员的要求较高，一是要求研究人员对相关界面系统了解程度必须很高，二是提问的方式和内容不能对用户有暗示或不良的引导，三是不能有让用户感到紧张的提问。不恰当的提问可能有一下几种：1） 带有引

39、导性的问题，例如：“这个产品有多不方便?”2） 不够中立的例子。3） 提问中带有设计人员自己的倾向。4） 不明确的问题，让用户无法回答。5） 过于直白的提问，容易引起用户的自我防备，例如：“你在使用过程中犯了多少次错误？” 设计人员应当尽量精心准备问题，“这个产品有多不方便？”这样的问题可以改成“谈一下使用这个产品的感受”，在放松的状态下，如果有不方便的地方用户自然会提到。“你在使用过程中犯了多少次错误？”这样的问题可以改成“你能谈一下这个产品不能完成某个任务的情况吗？” （2）问卷调查随着互联网的渗透，使用互联网进行问卷调查已经变得非常方便和快捷。如果是简单的用户数据收集与研究对象招募，可以

40、使用一些社交网站上的调查工具，。一些专业的问卷调查也可以帮助设计人员轻松地完成调查。4.2 交互设计界面中的交互设计是指用户面对界面系统时对信息进行的各种操作以及系统对用户额反馈。交互设计的主要目的是让用户顺利地使用界面，因此，界面设计的易用性因素是交互设计的重点。交互设计主要有一下要点：1. 预设用途预设用途一次也能翻译成示能性，是指物品被认为具有的性能以及实际上的性能。在界面设计中，这一概念非常重要。与直接模拟形象的设计方法不同，预设用途主要提供了一种使用界面的线索以及使用界面上某一元素的因果关系，而不仅是形象上的相似。界面中最常见的预设用途是网页中的链接。蓝色的文字会告诉用户此处是一个链

41、接热区，单击就会有新的页面或内容出现，鼠标经过时链接也会显示出下划线进行提示。这样的预设用途对于大多数用户而言，是不言而喻的，如果设计人员设计了一个蓝色文字而不是链接热区，就会让很多用户产生误解，以至于认为界面很糟糕。2. 控件控件是预设用途最好的案例。在计算机出现前得很多年里，人类就开始使用一些具有固定功能的设备来完成特定的任务，这些就是界面控件的原型，如开关、把手、旋钮等。控件的作用是用来完成设定好的操控。用按键来激活或关闭某个功能；旋钮调整在一定范围内的变化；拨动开关来在两种状态中切换。可以把固定功能的界面元素都看做是控件，几乎每个界面上都会出现各式的控件。 （1）按钮。按钮是界面中常用

42、到的控件。一个界面上往往会存在几十个按钮。按钮可以完成控制页面状态的转换，也可以控制界面元素做各种动作。在标准化程度要求较高的界面中，如软件界面和手机界面，按钮的样式较为固定，而在一些个性化较强的网页界面中，按钮的设计往往能成为吸引眼球的亮点。 （2）滑块。滑块可以提供在一定范围内的调整操作，一般用来调整音量、亮度或范围。有的滑块其两端会有微调按钮，这种控件也被称为滚动条。 （3）文本框。文本框可以提供输入文本的空间，这种控件往往会包含在搜索框或各种表单中。如图4.1QQ空间的说说文本框。图4.1 QQ空间的说说文本框 （4）进度条。进度条用来表示一个复杂进程进行的程度。进度条也可以做成丰富的

43、图形动画。如图4.2是打开QQ空间的进度条。 控件的优势有以下几个方面： 1）控件是一些容易理解的预设用途，用户不必过多学习就可以直接使用。2）易于标准化。使用标准控件能让用户快速地把使用一种界面的经验转移到同类界面中。3）让界面更加简洁。控件可以保持界面的一致性，从而在视觉上减轻用户的负担、提高界面的易用能力。在使用控件时，首先要注意不要在一个页面放置过多的控件，可以考虑分页面显示多项内容。其次，应该将核心的控件突显出来。每个页面都有核心功能的控件，精心设计这类控件的外观，并调整尺寸和位置，使之处于最醒目的状态。再次，把相关联的控件放在一起，把不相关的控件按照功能分组，以免产生误解。最后，至

44、于控件的摆放顺序，如果在界面中出现多个控件，设计人员应该要仔细研究它们的摆放位置。如果控件来自于现实生活，那么可以以控件原型的摆放习惯为参照，使控件与原型一一对号。图4.2打开QQ空间的进度条3. 反馈反馈是指用户进行操作后交互系统出现的某种提示。如果系统对于用户的操作没有反馈或者反馈较慢，这可能会导致用户重复此操作，整个交互过程就会产生问题，用户进行的任务可能会失败。因此，恰当的反馈是交互设计的重要组成部分。（1）反馈的要点。 1）及时。反馈必须要及时，哪怕就是耽搁一小会也会给用户带来疑惑和不满。想象一下在饭店里招呼服务员的场景，如果没有服务员理会，顾客将会感觉很糟糕。当顾客有需求时，服务员

45、如果不能马上服务客户，也应该及时地反馈给客户表明已经收到了他的请求。这种情景和界面设计中的反馈是一样的。当用户单击一个按钮时，界面上应立刻有所反应，如果这个反应过程时间较长，系统要提供一个进度条表明系统正在做出反应。 2）明确。系统的反馈也要明确。当系统正对用户的操控进行处理时，可以提供类似“载入中”或“请稍候”这样的提示。当然，提供进度条是一种更为明确的方式。但当系统中断或异常终止时，系统必须明确地告诉用户系统已经终止操作或者退出，否则用户会在等待中失去耐心，做出更多错误的操作。（2） 反馈的类别。反馈在整个交互界面系统中无处不在。没有反馈，用户就无法和界面系统继续交流，不同类型的反馈都有着

46、各自的特点。 1）悬停反馈。悬停反馈能够指示出光标目前的位置，并能告知光标经过的位置上是否有特殊的元素等待进一步操作。在界面中按钮必须设置悬停反馈，否则用户会识别不出按钮，从而没有操作的意识和机会。复杂的悬停效果可以给界面增加亮点，以丰富用户的交互体验。 2）单机反馈。单机反馈是界面元素在被单击后产生的反应，表明此元素已经被单击。 3）选中反馈。当元素被选中后，显示出与未选中状态的区别，提示用户已经选中并可以进行下一步操作。 4）进度反馈。进度反馈分为确定性反馈和不确定性反馈两种，确定性反馈可以告知用户进程大致的完成比例。 5）激活反馈。有些元素，特别是不应占据页面重要空间的控件，给他们设置动

47、态反馈可以区分激活与非激活状态。在非激活状态下元素尽量消隐在页面中，需要它们时再将其突出显示。 4.错误 错误信息提示是界面交互系统中也要顾及的方面。在用户进行了错误的操作时，系统需要提供错误信息，往往也伴随着提示音。 用户可以撤销操作也是界面设计的重要方面，这样才能给用户出错后弥补的机会。用户出错后的错误报告页面应尽量提供准确的信息，也可以设计一些有趣的画面缓解用户的焦躁情绪。4.3 视觉设计视觉设计师一般由负责美工的人来担任，在已经确定了的交互设计方案基础之上，尽量使界面变得美观，让用户看了更加舒服。视觉设计的主要内容有：界面布局，颜色搭配，图标设计，字体编排与设计，界面元素的背景图案设计等。做出的成果通常是效果图，例如设计一种按钮，要制作“正常、加亮、按下、禁用、焦点”五种状态的效果图。为了提高视觉设计的效率，设计人员需要有一套界面素材