《网页中交互设计的应用研究》由会员分享，可在线阅读，更多相关《网页中交互设计的应用研究（14页珍藏版）》请在金锄头文库上搜索。
1、网页中交互设计的应用商量摘 要：交互设计又称互动设计，是从“目标导向”的角度解决产品设计方面的问题。交互设计的概念源于20世纪80年月，由IDEO设计公司创始人之一比尔莫格里奇提出。从理论上来看，交互设计在人机工程学的基础上更加强调认知心理学、社会学及行为学的指导作用；从人机沟通的实践上来看，交互设计更强调产品对人的反馈交互作用。交互设计是网页界面设计的重要设计环节之一。交互设计的视觉体现表现在用户扫瞄页面时能够一目了然地知道哪些地方可以进行操作，以便用户迅速锁定目标，完成操作任务。当前，基于web2.0的新一类互联网应用更注意用户的交互作用，本文中所要商量的界面交互设计就是以用户为中心，探究
2、交互设计如何令用户更轻松更快捷和愉悦地完成界面操作任务，着重强调界面的可用性和易用性。关键词：交互设计 网页界面 人机沟通当今社会，互联网作为第四媒体已经将全球信息共享变为现实，它正逐步转变着人们的生活和工作方式。最为明显的特征就是各种各样的基于扫瞄器的应用充斥在我们身边，随着智能化设备及其功能的日趋增多，新的人机交互不断涌现，用户体验对交互设计的需求越来越明显。计算机或网络与人最直观的接触点就是界面，而致使界面与人之间产生互动沟通的就是交互设计。交互设计是一门商量在人机沟通过程中人的心理模式和行为模式的学问，并依据商量结果设计出易于用户使用产品的人机交互方式，其涉及学科知识广泛。本篇论文中所
3、谈及的交互设计仅仅是商量计算机信息的图形化用户界面设计领域中的交互如何引导用户体验。2014年11月19日，首届世界互联网大会在浙江乌镇开幕，奇虎360董事长周鸿祎在会上表示：移动互联网的进展带来了智能硬件的富强，我们将进入一个万物互联的大数据时代。随着由万维网衍生出的图形用户界面（GUI）被发明，企业的决策者们就开头理解并接受用户中心设计（UCD）的语言。各大小企业面对扑面而来的网络浪潮，都纷纷投身于电子商务的行列中，建立网站和制作网页来宣扬自己的形象，与顾客和群众沟通信息，网络营销以及推广活动应运而生。网络营销和推广的根本目的在于争取目标客户，扩大市场影响和突出品牌形象。而一个网站的最终营
4、销效果如何，交互设计就显得尤为重要。由于网站的扫瞄者受到个人背景、文化水平、行为习惯、对眼前事物的生疏程度以及期待看到什么内容的影响，他们在网站上观察的内容未必符合设计者的构想。所以设计者要分析物体的内容架构并设计展现方式来引导扫瞄者注意特定的内容，尽量做到让客户不用思考就可以看出哪里可以进行交互，节省客户时间，提高网页的可用性和易用性。一个拥有好的概念模型的工业产品是不需要说明书的，同理一个好的网页也应该是不言而喻的，一目了然的，自我解释的。本课题中我所要商量的就是让交互设计更好的引导人们的视觉以此来帮助用户更快更好的完成任务。一、 网络时代下的页面交互设计二、 （一）网页界面的视觉元素 1
5、、文本文本是网页界面的主体。在网页界面设计中，文字是传达信息的主要元素，由于文字在平面设计中是一种感性的直观行为，与其他视觉元素相比，文字更具有信息传达的明确性，能够精确地表达信息的内容和含义。设计者可以依据版面需要对文本的字体、大小、颜色和段落等属性进行设计，风格独特的页面文本设置能给扫瞄者以赏心悦目的感觉。网页中的文本主要有标题、内容信息和文字链接等形式. （1）文字标题 网站的首页或者一条独立的文章一般都会有一个醒目的标题，以告知扫瞄者网站的主旨或文章的主题。文字标题要简洁明白、引人注目才能得到扫瞄者的青睐。通常标题应该放置在醒目的位置，使用较大的字体，但是为了保证显示的效果，在网站中通
6、常被设计成图片格式。 （2）内容信息 文字信息是对标题的解读，是传达信息的主体部分。文字信息的作用是任何其他页面构成元素都不能取代的。在页面设计中，由于内容信息通常占得面积比较大，因此对文字信息的字体、大小、颜色和编排方式都要考虑到用户对简单性和干扰的容忍度而细心设置，以达到较好的扫瞄效果。 （3）文字链接文字链接是网页中最常见的超链接。文字链接为主页面减轻负担，使页面分区更加明显，同时也便利了扫瞄者对信息的检索。 2、图形图像图片是除了文字以外最早引入到互联网中的多媒体对象，网站的Logo、页面背景、帮助文字信息和链接等都可以使用图片。相对于文字来说，它传达信息显得更生动、直观，而且图形图像
7、的引入也大大美化了网页的视觉效果。尤其是后来动画和视频的消失，由于动态效果具有很强的视觉冲击力，能够很快吸引扫瞄者的眼球，所以网页中动画通常是第一视觉中心，在传达信息时动画是特别有效的手段。 图形元素包括标题、链接图标、主图和背景四种，需要特别注意的是主图和背景的运用。背景图片能够烘托主题的表现，同时增加页面的层次感，使网站具有风格而不再单调枯燥。而主图则是突出表现主题。主图一般是页面的视觉中心，它直观性强，能为单调的文字信息增强活力，传递出强烈的视觉信息。 3、颜色颜色是信息传播的符号之一，它能传达或代表某些明确的意义，是设计网页界面时必不行少的视觉元素。由于颜色在人们心中有固定的象征，当看
8、到某种颜色时，自然唤起了人们头脑中储存的视觉阅历，从而产生相关的心理感受，这样就达到了信息传播的目的。在网站页面设计中，设计人员一般遵循“总体协调，局部对比”的颜色应用原则，使网站各个页面达到总体和谐统一的效果。网页中颜色的运用没有固定的模式，但也不能毫无节制地接受多种颜色，通常情况下，设计者会依据客户对网站风格的要求来确定主色和帮助色。随着电子商务的迅速进展，越来越多的企业开头注意在互联网中的形象和地位。对于企业网站的设计，设计者会依据企业所在行业、产品特性以及企业的VI系统来确立颜色。很大程度上，一个网站给用户的感官感受是由颜色决定的。色相、色调作用于人的视觉和心理，与人的阅历和知识产生联
9、系，使人产生出诸如冷暖、轻重、软硬之类的情感。颜色对于不同国家和地域的人来说具有不同的情感认知，但是大多数人对于颜色的联想意义在某种程度上还是趋于全都的。 4、留白 “留白是中国画构图中形式美的法则之一，它关系着整个画面的协调性和旋律美，体现了一种以虚化实的境界。1”空白是网页界面设计中很容易被忽视的视觉元素，但我们不能低估空白的价值。当一个网页上全部的版面都显示信息特别密集，会不利于扫瞄者阅读有效信息，引起用户反感，甚至会给人网页制作粗劣的感觉，破坏该网站的形象。因此，在界面设计中适当的留白能够更好的衬托主题、集中扫瞄者的视线，同时给页面营造视觉上的空间层次，使页面看起来轻松简洁。原研哉的无
10、印良品招贴设计，将空白的形式美感以及留给观者的无限想象演绎的淋漓尽致（见图1.1.3）。 5、交互 交互是网页界面设计中的一个特别的视觉元素。“所谓交互设计，是指在人与产品或系统之间创建一系列对话3。”一个好的交互设计能够预见人机沟通的整个互动过程，它在不阻碍产品和服务的交互行为时能够美化界面，奇妙的设置交互效果甚至能把界面艺术化。交互设计的本质是人与人之间的沟通，网页交互设计师在设计网页时不得不考虑一般人在一般任务执行过程中的耐受力，时刻遵循“以用户为中心”，考虑网页的可用性和艺术性，从而给用户供应愉悦的操作体验和审美享受。 （二）网页中的交互设计 1、界面与交互设计网页界面设计与传统的平面
11、设计有很大的区分，做网页界面设计不得不考虑页面的交互性。网页设计尤为关注用户与产品之间行为上的交互以及二者交互的过程4。网页界面中的全部组件，包括布局，风格，样式等都应该为交互设计服务，交互设计在肯定程度上约束着界面设计。例如在网页中主导航的位置，设计者只能依据设计的需要将导航放在页面顶部或者banner下方，并且主导航必须在电脑第一屏的中上部消失，否则就会给用户带来怀疑，造成不良的用户体验，因此在界面设计中无论出于什么缘由都不能破坏页面的交互行为。下图1.2.1和图1.2.2你看哪个比较舒适呢？据调查，更多的用户偏爱图1.2.1，由于它更符合我们阅读的视觉流程。 交互设计（Interacti
12、on Design）又称互动设计，是从“目标导向”的角度解决产品设计方面的问题。交互设计的概念源于20世纪80年月，由IDEO设计公司创始人之一比尔莫格里奇提出。从理论上来看，交互设计在人机工程学的基础上更加强调认知心理学、社会学及行为学的指导作用；从人机沟通的实践上来看，交互设计更强调产品对人的反馈交互作用。当前，基于web2.0的新一类互联网应用更注意用户的交互作用，交互设计致力于了解目标用户的期望，通过对产品界面和人机互动行为进行有效的设计，使产品和用户之间建立一种有机关系，从而能够有效地使用户达到目标。本文中所要商量的界面交互设计就是以用户为中心，探究交互设计如何令用户更轻松更快捷和愉
13、悦地完成界面操作任务，着重强调界面的易用性和可用性（概念见图1.2.3）。简洁和易于操作是网页界面设计的最重要的原则。Steve Krug将可用性视为交互设计的第肯定律。 2、交互设计的进展趋势随着移动互联网上社交需求的不断增长，“以人为中心”的人机沟通成为人们日常生活和工作中必不行少的一部分。随之而来的移动终端、共性化主页、企事业单位网站、用户界面的交互式设计已经呈现出跨越式进展趋势。 （1）交互设计的国内进展现状 目前，交互设计在我国各大高校及商量机构还没有形成专门的专业商量领域，只有部分计算机或设计相关专业略有涉及，无论从理论还是成果上看均不成体系。我国的交互设计集中在移动互联网方面，关
14、注的重点是社交网站和电子商务的界面设计以及用户的需求商量3。商量的热点是用户体验，包括构建用户模型、用户界面和产品交互设计等方面。国内的交互设计涉及的领域较为单一，集中在互联网中数字界面设计上，这使得我国网页交互设计和手机界面交互设计等得到飞跃进展。随着交互设计的娴熟，交互设计的应用领域得到进一步进展，现在越来越多的交互设计融入到工业产品设计领域，如平板电脑、智能家电等，交互设计的消失为工业产品带来新的竞争优势。国内交互设计的商量对象更多的停留在人机界面的设计上，仅仅能够满足人们基本需求的低层次阶段。由此可见，我国对于交互设计的商量还缺乏对人的情感化相关的商量方法及用户模型。 （2）交互设计的
15、国外进展现状国外交互设计起步较早，但是由于交互设计本身还在属于创建阶段，而且其商量者和实践者来自不同的领域，以致交互设计理论和实践进展不同步，还有很多的问题尚未达成共识。国外的交互设计已经同产品设计及视觉设计等设计领域形成类似的学科。在理论商量上已形成了相对较为完整的方法和理论成果。其中Giles Colborne撰写的简约至上：交互式设计四策略、Steve Krug撰写的DONT MAKE ME THINK、Alan Cooper撰写的About Face 3交互设计精髓和交互设计之路等著作是交互设计商量总结的优秀成果。这些书籍讲解了信息产品界面交互设计、交互产品规律设计，并都着重强调了用户
16、体验的重要性，体现出交互设计“以用户为中心”的人性化设计理念。国外商量交互设计涉及的领域特别宽泛，热点集中在训练、文化、游戏、娱乐、用户认知、人机交互设计和时尚设计等众多方面，例如虚拟仿真设计、虚拟交互环境、3D建模、城市规划、儿童训练互动式读物、娱乐领域的多种APP应用以及近几年在电子商务中流行的虚拟购物和虚拟试衣技术等。其商量的重点是用户体验、视觉效果以及人机交互中人的认知程度。由此可见，国外的交互设计商量是围绕“人”展开的，并已经扩展到生活中的诸多方面。换言之，国外的交互设计已经上升到解决生活中的实际问题，关注人们的生活品质和体验，而不再仅仅局限于人与机器的互动上。二、交互设计在网页中的视觉体现 （一）按钮的功能与表现 交互设计是网页设计的重要设计环节之一。交互设计的视觉体
