（设计艺术学专业论文）网页交互设计的视觉体验.pdfVIP

i n t e r a c t i o ni nt h ef o r mo fi s s u ei st h ek e yl i n kd i r e c t l yt ot h ea u d i e n c e i nt h ev i s u a ld e s i g no fw e bi n t e r a c t i o n ，t h eu s e re x p e r i e n c eh a sb e c o m ea ni m p o r t a n t e l e m e n t ，a n dt h es t u d yo fu s e re x p e r i e n c ei se s c a l a t i n gw h e t h e rf r o md e p t ho rf r o mb r e a d t h f r o mt h eb e g i n n i n go fp u r s u i to ft h em a s sp s y c h o l o g yo fe m o t i o n a le x p e r i e n c et oah i g h e r l e v e lo fi m m e r s i o n , i ti n d i c a t e dt h a tt h em a i nw a yo fa c h i e v et h ef u l lr e l e a s eo fh u m a n e m o t i o n a lw a st oe l i m i n a t eas e n s eo fd i s t a n c e 删嘲l yb e t w e e np e o p l ea n dm a c h i n e s a tt h ep r i m a r yl e v e lo fi n t e r a c t i v ev i s u a ld e s i g n , t h ei n t e r a c t i v ep r o g r a m sc a l lb em o r e a c c u r a t eu n d e r s t a n d i n ga n db eu s e db yt h eu s e ri nag o o dv i s u a le n v i r o n m e n t , w h i l ea tt h e t l i g hl e v e lo fu s e re x p e r i m e n t i ti sn o to n l ya i ma tt r a n s m i s s i o no fc u l t u r a li n f o r m a t i o na n d a e s t h e t i ci n f o r m a t i o n ，b u ta l s oa ta h i 【g hd e g r e eo fe m o t i o n a li d e n t i f i c a t i o no fu s e r s ，e v e nm o r e t h r o w i n gt h e m s e l v e si n t ot h ed e s i g n e r si n t e n t i o n s s ot h ec o n n o t a t i o no fi n t e r a c t i v ev i s u a ld e s i g ne x p r e s s e di sb e c o m i n gt oas t a t u r eo f r e g a r d l e s so ft h i n g sa n d if r o mt h ed i f f e r e n c ei no n e - w a yc o m m u n i c a t i o no fi n f o r m a t i o n h o wt oc o n n e c t 、丽n lt h ev i s u a lf o r ma n du s e re x p e r i m e n t 7 h o wt oa p p r o p r i a t et h ev i s u a l f o r mt oe x p r e s st h ec o n t e n to fi n t e r a c t i v ep r o g r a m sa n dw h a tk i n do fi m p a c to nu s e rv i s u a l e x p e r i e n c ea r et h em a i nc o n t e n t so fm ys t u d y n eu l t i m a t eg o a lo fw e bp a g ev i s u a ld e s i g ni s t o ： 1 e n h a n c et h ee m o t i o n a lf a c t o r so f p e o p l ei nt h ew e bp a g ed e s i g n , m a k et h e i n t e r a c t i o n sm o r ei n t e r e s t i n ga n de m o t i o n a l 2 s t u d yo fh u m a nf r e e d o mt od e s i g na n ds a t i s f ya e s t h e t i cn e e d i n g ，b u t n o tj u s ts t a y o nt h es u r f a c eo ft e c h n i c a l 3 u n d e r s t a n d i n go ft h ec o r r e s p o n d i n gc u l t u r eb yt h ev i s u a lw e be x p e r i e n c e t h e r e f o r e ，i ti sn e c e s s a r yt oa n t i c i p a t et h e i ri n t r i n s i ce m o t i o n a lr e a c t i o n sa n db e h a v i o r a l h a b i t st h r o u g hs t u d y i n go ft h et a r g e tu s e r sc u l t u r a lb a c k g r o u n da n ds o c i a lb a c k g r o u n da n d u s i n go ft h ee f f e c t i v ev i s u a l ，o ra u d i t o r y , t a c t i l ea n do t h e ra l l - r o u n df o r mo fo r g a n i z a t i o n , t o p l a n , d e s i g n , i m p l e m e n tt h ed e s i g no fw e bs i t ei n t e r a c t i v ep r o c e s s a p p l y i n gt h ec l o s e rt o “n a t u r a lf o r m ”t oi m p l e m e n tg e s t a l to fap r o c e s so ft e c h n i c a l ，a e s t h e t i ca n de m o t i o n e x p e r i e n c eu l t i m a t e l y k e y w o r d s ：w e bp a g e i n t e r a c t i o nd e s i g nv i s u a ld e s i g nu s e re x p e r i e n c e t h e s i s ：a p p l i c a t i o nr e s e a r c h o oo 1 0 00 00 00 00 1 qoo ”2 4 4 o q o 4 4 5 5 5 ”5 1 2 网页交互设计现状分析6 2 网页中的交互1 1 2 1 信息的交互1 1 2 1 1 交互信息的内涵1 1 2 1 2 交互者问的关系1 1 3 。网页交互的视觉体验1 3 3 1 虚拟情境中的情绪1 3 3 2 视觉体验的个性与共性1 3 3 3 体验的乐趣1 4 3 4 视觉的体验与沉浸1 5 3 5 适度传达1 9 4 交互状态下的视觉重建2 1 4 1 自然与规则2 1 4 2 富有情感的整体页面2 3 4 3 网页交互的虚拟环境2 4 4 3 1 页面类型分析2 5 4 3 2 谋篇布局2 7 4 3 3 关于我的设计2 9 5 结论3 2 绪论 1 选题背景 “交互越发频繁的存于我们身边的大小事件之中，从游戏软件、应用程序、网页 浏览，到同用家电、手机、汽车，几乎任何与科技相关的物品都会存在交互的内容。而 由此出现的交互设计，也逐渐成为了- - f - 新兴的设计门类，它集合了工业设计学、美术 设计学、心理学、人体工学与市场营销学等相关学科。 本文主要针对网页交互进行视觉体验的分析研究。众所周知，用户浏览网页面对的 不是一个固定的事物，而是依据用户操作的变化而不断变化，作为交互的载体，它会随 时间、空间而变动，网页设计是否成功，从表面看是取决于网站的流量，而流量的本质 则是看网站的设计是否能支撑有效的交互，而这种“有效”，除了指代信息被准确捕捉 之外，更有赖于受众的情感体验过程。 2 0 0 1 年美国人巴伦李维斯和克利夫纳斯两位作者在斯坦福大学传播系的合作成 果媒体等同进入国内，书中指出，人们在和电脑打交道的时候，总是会像对待真人 真事一样去对待它们，并且分析了人与机器间交互过程中的情感特征。以网络媒体为例， 当人们面对电脑时，其情感是由人发出的，而这种情感无法分离出对电脑，或对人的情 感，情感体验是同一的，而让电脑程序更具备人化的特性，是未来，也是现在正在发生 的事，这种人化的特征不仅蕴含在交互程序中，还体现在视觉表现、声音效果等其它与 人的感官系统密切相联的许多方面。 因此，优秀的交互程序如何被外化出来，也就是要使用何种恰当的视觉形态来表现 交互的内涵? 这种视觉形态带给用户怎样的情感体验? 这是作者要研究的具体内容。鲁 道夫阿恩海姆在视觉思维中谈到，“视觉是选择性的，视觉乃是一种积极的 器官。那么，这种积极，应该是由人类的情感需求所决定的，情感需要我们对周 围事物的体验做出反应，而视觉器官则是情感体验的媒介之一。 这就意味着，通过良好的视觉设计，交互设计更能被用户正确理解和使用，这是一 种趋势，也是一种定势，从我们身边大大小小的物件，如：手机、汽车、建筑、书籍、 服装，甚至一个小小的签字笔等等，都在不断的产生视觉上的设计变化，在实现功能的 基础之上，尽可能的被设计的美观，这是人类视觉的本能，也是情感的需要，如果说“美 观的物品更好用 ，那么，在这句话中，“美观 满足了视觉的需要，而“更好用 则 是要达到情感体验的结果。 在交互设计中，包含着三个信息层面，最基础层面是指交互的程序设计，主要体现 在产品功能上，侧重于人与机器之间的操作流程；第二层面是指交互的视觉设计，主要 回情感化设计( 美) 诺曼付秋芳，程进三译电子工业出版社p 2 体现在产品的外观上，侧重于程序的表现与审美诉求；最上层面，即体验研究，“体验 主要是通过从个体收集的情感信息中，总结出普遍情感规律，而由此，再将这种体验规 律应用于交互设计中，来增强产品的人性化意味。 在交互设计的基础层面，交互的程序设计，主要侧重在数据信息的传递方式上，包 括思维方式、行为方式等等，这些方式的确定来自于对目标用户的详细分析，以及对所 要传递的数据的分析，简而言之，就是如何将网页要传达的数据信息以某种顺序表现出 来? 先说什么，后说什么，而这一过程，又要根据用户的不同操作行为发生相应的变化。 在交互的视觉设计层面，即交互程序的视觉化。例如：手机屏幕设计、网页页面设 计、软件界面设计等，最初考虑的是视觉上的美感，主要依托美术设计法则的注入。而 现在需要将视觉层面与情感体验研究融合在一起。因为，交互设计是否到位，在信息的 有效传播上发挥着至关重要的作用，更进一步说，要关注网站和其受众之间信息交互的 有效性，不仅仅关注这些交互过程的形式问题，而是更深层次的情感认同。 而这种情感认同首先来自于对目标群体文化的理解，通过了解目标用户的文化背 景、社会背景等，预测其内在情感反应和行为习惯，从而紧密围绕信息、人机、情感等 一系列交互内容，进行体验研究，最终运用有效的视觉，甚至听觉、触觉等全方位形式 来组织、策划、设计、实施网站设计的交互过程，通过更恰当的视觉形式，最终实现技 术体验、审美体验与情感体验一系列过程的完形。 因此，交互设计的实质就是，基于对用户文化与习惯的研究，而应用某种手段传达 相应的功能信息、审美信息与情感信息。 未来的网页设计是要求在更快、更有效的功能前提之下，同时融艺术和技术为一体， 具备高度即时交互的人性化的网站设计，体现人的主动性和能动性，只有将设计者自身 做为用户来换位思考，而非单项思维的信息传达。信息传递的极简或极繁，即批量传输 技术的极尽，或个性化的凸现都是多样而丰富的世界的一部分，平淡也好，过激也罢， 都是这体验世界中的一份子，而真正要做的，是要恰当地应用不同的体验原则，把握度 的合适，恰当地选择，而不是全盘否定或接受。打破已有定势的影响，发掘更多人性化 的自由设计空间，是必须的，也是必然的结果。同时，技术的不断发展也为开拓新的视 觉会产生深远影响，网络世界应是多样的，虽然程序化使得大容量信息传输迅速，但是， 未来的信息传达不会只是一种数字和符号的简单传递，而是更多蕴涵情感的人性化交 流，富有个性与人情味，这是一种可能性。 2 国内外交互理论的研究成果 近年来，出现了“互动设计 一词，似乎有着要取代“交互设计的趋势。其实， 交互和互动两个名词都是从英文i n t r a c t i o n 翻译而来，而为了区别交互设计的阶段性， 2 以表达交互设计中融入的更多的人化思想，因此改用“互动”这个名称。如果一定要区 别出两者的不同，百度词典( b a i d u ) 中有这样的解释：“互动设计是一个新的领域：是 审美以及文化、技术以及人类科学的融合。他所关心的设计是包含这些技术是否能给予 服务，以及和他们互动经验的质量。 吲 如果忽略这种为了区别而加入的名词，交互设计一直在自我演变着。从一直研究交 互设计的美国“v b 之父 a l a nc o o p e r 的一系列著作来看，已经明显表现出了对最初交 互设计定义的改变，1 9 9 5 年a b o u tf a c e ：t h ee s s e n t i a l so f u s e r 曼嘞鲤p 曼她理、2 0 0 3 年 a b o u tf a c e2 0 ：t h ee s s e m i a l so f 曼髀蛔r ；臻j l 肆p 曼豳翔、2 0 0 4 年t h ei n m a t e sa r e r u n n i n gt h ea s y l u m ：w h yh i g h - t e c hp r o d u c t sd r i v eu sc r a z ya n dh o wt o 取第煦豫地曼 曼罂鱼噬、2 0 0 7 年 a b o u tf a c e3 ：t h ee s s e n t i a l so f 鲤牌蜊的哩q 曼曼豳曼、2 0 0 9 年( ( d e s i g n i n g f o rt h ed i g i t a la g e ：h o wt oc r e a t eh 哩鼎帆篓曼毗曼驰随p r o d u c t sa n ds e r v i c e s ) ) ，仅从这些著作 的名称上就可获悉，从最早的i n t e r f a c ed e s i g n ( 界面设计) 到i n t e r a c t i o nd e s i g n ( 交互设 计) ，再到最新的h u m a n c e n t e r e d ( 以人为中心) 不难看出，作者从程序设计角度研究了 软件开发流程中的人化方式的创新，为人机交互中的人性化作出努力。 而2 0 0 7 年由美国长岛大学副教授s t e v e nh e i m 所著的t h er e s o n a n ti n t e r f a c e ：h c i f o u n d a t i o n sf o ri n t e r a c t i o nd e s i g n ( 和谐界面交互设计基础) 一书，则开始从程序和 视觉两方面开始阐述人机交互的和谐问题，他的著述从界面的角度表达了视觉设计的重 要性，在其第九章简要阐述了文化、情绪与色彩的问题，虽然篇幅较短，但还是显现出 了界面设计的文化依托。 最后，还要提到j e s s ej a m e sg a r r e t t ，他在2 0 0 0 年首次将“用户体验要素 发布在 互联网上，他所著的t h ee l e m e n t so fu s e re x p e r i e n c e ：u s e r - c e n t e r e dd e s i g nf o rt h e w e b ( 用户体验的要素以用户为中心的网页设计) ，从用户使用的角度研究网页交互 中的问题，描述了用户体验开发的5 个层面，即：“战略、范围、结构、框架和表现 刨 其中“表现层主要阐述了视觉设计的内容。 国内交互设计的发展，也呈现了从侧重“界面设计”的人机交互研究到开始步入“用 户体验”设计研究，2 0 0 4 年清华大学出版的数字图形界面艺术设计提出了“人本界 面思想，以及动态交互的设计作品，从软件界面到网站界面，再到多媒体产品界面等， 试图从整体上阐述高科技产品的人性化视觉设计问题，但是具体内容，大多还是在延用 平面设计理论中的审美法则，似乎离“体验还有一段距离。但这一现状正在逐步改变， 随着世界信息交流的便捷与迅速，新的理论及技术研究会不断影响国人的意识与认识， 。信息来自互联网百度百科，网址：h t t p ：b a i k e b a i d u c o r n v i e w 2 3 7 8 0 4 0 h t m 用户体验的要素：以用户为中心的w e b 设计( 美) 加瑞特，范晓燕译，机械工业出版社p 1 7 这种差距也会在未来逐步缩小。 3 研究目的 提升网站设计中的人的情感因素，使得交互行为更加有趣、富有情感。 研究用户对网页交互的“体验”过程。 通过对网页视觉的体验，理解其对应文化的内涵。 4 研究意义 发挥设计中人的情感体验作用，使得设计更加具有人性化的自由，满足审美追求， 而不仅仅停留在技术的表面。 交互页面恰当的视觉设计有助于页面更具有亲和力，以及被理解力，从而更好地 传达用户所需要的信息。 5 研究思路 通过对现存的国内外网页设计的研究，分析网页中的交互过程，与设计结构；互动 过程中产生的视觉页面有哪些；分析这些视觉页面的基本元素是什么；而后从审美角度 分析，交互设计带给用户的视觉体验；总结出网页交互视觉设计的最终目的与结果；最 后通过一系列实践活动找到作者的设计依据和设计方法。 6 存在的困难 一方面，互动设计的技术问题是目前最大的困难，因为良好的互动视觉设计是一项 与技术紧密结合的工作，有时优秀的构思由于技术的难题，不得不退而求其次，因此在 现时的技术条件下，只能最大限度的挖掘设计的可能性；另一方面，找到适度的视觉设 计，避免两种极端。过度使人厌烦，会削弱主题的传达，不及则显得枯燥，缺乏传达的 力度，不能有效吸引用户。因此，度的把握就需要以前期认真的用户分析为依据。 4 1 关于交互 1 1交互设计的扩展 随着计算机技术的发展和越来越广泛地被普及使用，更多的人投身到了互联网行业 之中，互联网也自然而然成为了大众日常生活的一部分。而近年来，“交互 一词已经 广泛存在于我们生活中的方方面面，人们在谈论着“交互 这一看似新鲜的事物，这不 是一种追求时髦，而是因为“交互 的确存于我们身边的大小事件之中，从游戏软件、 应用程序，到网页浏览，再到日用家电、手机、汽车，几乎任何与科技相关的物品都会 存在交互的内容。 交互表现在“人与人、人与物 两方面，我们常常用“互动 来描述“人与人之 间的交互，而“人与物”主要是指人与机器之间的相互作用，常用“交互”来描述。 乍看起来，交互似乎是个舶来品，其实不然，早在我国礼记曲礼中就有：“往 而不来，非礼也；来而不往，亦非礼也。”即表示对别人施加于自己的行为作出反 应。因此，这种“来与往”的关系，其实质就是一种交互，这种关系就是一种“相互 参与的关系 。 1 1 1 交互设计 对于交互设计，目前还没有一个大家公认的定义，v i s u a lb a s i c ( 简称v b ，即可视化 b a s i c 语言，是一种由微软公司开发的编程语言) 之父，a l a nc o o p e r 认为，”交互 设计首先旨在规划和描述事物的行为方式，然后描述传达这种行为的最有效形式。 吲； 另外也有学者认为“交互设计关注于描述可能的用户行为，以及定义系统如何配 合与响应这些行为，创等等。这类定义更多地是从程序编辑角度对交互设计进行的 定义，即交互设计应该是对于交互关系的发生、经过、结束这一系列过程的设计。交互 设计的内容是一个完整的过程，而不是某一个固定不变的点。而时过境迁，随着信息传 播学、人文概念等的融入，体验研究成为了交互设计新的内涵。交互设计就更加广义化 了，其中不仅仅是一系列程序的安排，还包括了人机之间的情感定义。 1 1 2 交互艺术 随着图像艺术媒介的深入发展，而衍生出来的媒体艺术，包含了以计算机为媒介的 交互艺术( i m e r a c t i v ea r t ) ，这其中的虚拟现实艺术走得更远，国外不乏研究“遥在与 生成 的艺术创作和试验。而从中出现的新的名词“沉浸( i m m e r s i o n ) ”吲成为了虚拟 现实艺术追求的目标。网络应用中也不再仅局限于产品开发、网络营销之类的商业目的， 而是更多地萌生出了以“交互文化、交互观念 为目的的艺术作品与艺术行为，可以说， 。软件观念革命交互设计精髓( 美) 库玎i 等詹剑锋，张知非等译电子t 业 j 版社p 2 7 。用户体验的要素：以用户为中心的w e b 设计( 荚) 加瑞特范晓燕译，机械工业出版社p 8 1 o 虚拟艺术( 德) 格劳陈玲主译，清华大学出版社p 9 5 交互艺术使网络应用得到了升华，使其脱离了工具的实体地位，而上升到抽象概念，成 为了艺术传播的载体。 交互艺术借助的媒介从影像装置到网络应用，逐步显示出了高科技条件下的艺术演 变，已经越来越多地借助科技来产生新的思维方式和行为方式，交互，也不再仅仅是科 技的代言，也更多地扩展到艺术、哲学等文化领域。宾夕法尼亚大学的技术哲学博士， 麦克尔海姆的著作：虚拟实在论、从界面到网络空间一虚拟实在的形而上学等， 从哲学观点对人们在虚拟环境中的意识感知方面进行分析考察与研究。 1 9 8 7 年，奥地利设立了“林茨电子艺术奖( t h ep r i x a r se l e c t r o n i c a ) ，不仅用来奖 励那些利用数字媒体来传达艺术概念或行为的艺术家或艺术团体，还包括在技术和社会 层面进行设计创作的人。在清华大学新闻与传播学院副教授，陈玲女士所著的新媒体 艺术史纲中，作者以极大篇幅介绍了大量世界各地艺术家们的交互艺术作品，其中， 从最早的计算机图像艺术，到动态影像艺术、影像装置艺术，再到全息摄影的幻觉艺术， 以及智能装置艺术以及遥在艺术等都作了细致的说明。 从中我们看到，交互艺术正在以不断的媒介演进的方式更新着，交互艺术与技术几 乎同时的发展，表现出了现代科技为交互艺术所作的技术支撑，与此同时，信息的不断 艺术升华，也使得人们的视觉想象更加神奇，视觉艺术正在以不同于以往的新姿态呈现 在大众的面前，艺术情感的细胞的融入，进一步提升和加强了电子媒介中情感研究的深 度和广度，而更高层次的艺术情感体验成为了更加广泛的实践活动，艺术更加广泛化了。 1 2 网页交互设计现状分析 对于多数国内、国外的网站而言，各有千秋。之所以不能笼统地以国籍来区分孰优 孰劣，是因为对于网页设计来说，有一个全球共用的设计平台，即设计的软件环境，虽 然这是一个多元化的信息媒介，但在设计的工具上或编程语言，以及数据传递的主要途 径互联网、硬件显示器等诸多方面都有着彼此相似的环境，因此，除去各国文化在 表现上的差异之外，可以统一来研究网页设计的视觉语言。 总体来说，网站交互设计的视觉表现大致分为两个类型，一类是占有主流位置的栅 格型视觉表现，另一类是异军突起的自由式视觉表现。 栅格型视觉表现，主要是一种借用平面设计的方法与风格，运用固定的格子来设 计版面布局，其风格工整简洁。网站设计借用这种方式，有其优点和缺点，优点是页面 显得整齐划一，比较规整，既有利于交互程序的快速调用，也利于后期交互数据的更新， 这样就大大降低了网站管理的人力、物力，也缩短了用户与网页交互之间的信息交换速 度；但缺点是视觉上容易倾向机械、呆板，页面缺乏情趣，大容量的信息如果不经过细 致地编排，这种栅格模式就成了文字与图片的无章罗列，反而导致用户在搜索所需信息 6 t ( 圈卜1 ) 联合国儿童基金会主页网址：w w w u n i c e f o r g 相比图卜2 是美国的v i c t o r i a ss e c r e t 主页设计，似乎有更少、更集中的重点要传达。 它的主页包括其他二级页面上的图片只有几张，以一个整屏为限制，这样就减少了用户 鼠标操作中不断移动食指以滚动屏幕的次数，页面信息给用户留下更深的印象，页面上 的产品也更加突出，这样就能够使用户很快注意到重点，从而缩短了用户检索产品的时 间。 7 s 竹r i m n i l k 叫出i l 嘲r ko 巾啊“- l ，币l l ( ；船t i i _ 1 l 、m i r 托i d i 如t l l _ u l d 删t l _ f h c 蚺山c t d 。l e , & m o r l i l l 对舶f m i 亓l k k f l i p - d o p , i唧m b d kl 、 。掣- 一叫n ，n c k 驴瞄 m i m i m t u - c i d u l l j “n u y r 1 d it - i ，v m - p 组s 螂a 一c l e e c k - d e ，5 u t u p e 坼肿晴“且却坩 - v “t 埘“，机l 叽p i “_ ；憎y呻”中l 州f f l u - j j c 持。时“一c u ：r l 卅憎f m d 一，o o e i k _ 、o u p i l p _ 吨c 一川4p l w y 0 l 一l “州k ， q c - 岫c 州矿t l h 哪一c l d et i b0 一e c i 眦e”b 删e ： ( 图1 - 2 ) 美国购物网站v i c t o r i a ss e c r e t 地址：w w w v i c t o r i a s s e c r e t c o i t i 栅格型的视觉设计主要集中在信息浏览、在线销售等，以集合形式出现的网站中。 当用户浏览这类网站时，总有以下体验出现：是否能够迅速找到我想要的；顺着格子走 下去，我能否找到结果；我能一眼看到感兴趣的话题马；浮动的广告条是否遮挡了我的 视线，或者它在一旁的闪烁是否影响我的情绪 这些体验所产生情绪的好坏，可以从栅格的编排设计方面得到相应地改进，利用审 美及营销手段，采用具有视觉美感的编排以及符合用户使用习惯的程序规则，两方面结 合，就可以达到较好的体验结果。 自由式视觉表现，是目前越来越流行的设计手法，即应用较新的技术手段，加上 强烈的艺术视觉效果，晟终达到页面风格的与众不同。这种类型的优点在于，使人印象 8 深刻、富有个性，具有时代感，在与用户的交互过程中有更多的情感诉求；缺点在于， 页面内容更新较少，技术要求高，设计不当时会使用户迷失方向，不易操作。用户在此 类网站中，常常体验到：这个动画是什么意思；我能够明白该怎样找到我的目标：速度 怎样：我的电脑能否支持这种动态效果；怎样回到主页等等。 自由式设计以个体形式出现居多，通常是某单个企业、产品或服务的专门性网站。 此类网站面对更小范围的用户，因此在设计上，多数一改栅格的模式，融入许多新技术 以达到视觉上的特殊形式，从而加强网页的视觉冲击与品牌意识，形式多样，更加富有 个性。 图1 3 是英国g e tl o n d o nr e a d i n g 网站，主要是帮助用户找到在伦敦的各大书店的位 置，页面以伦敦城的街道大照片为背景，主要信息被设计成一本打开的动态书籍，所有 信息都以书籍内容的形式表现出来。 f ? _ ? 4 琴沁澎粕 一_ 豫- 曩谓飘羁j ，戮k 懈，嚣一 r 一 蜘峨： i 冀翌。篓。i 埘。一。，潮 一妇 _ 曩一kr l k ：嘉。翳。 ，：m j ，i l i ：；：+ ； j i 嗣 r i 鑫 。一，i i j 蓬虱静蒸二引 耋薹 窑lg 。州“慷“加g ：省o ：蛊罟篇出? ! = ：篡= ：。l ： 。l 必 j j 。 ；j 。e r ro u t 。a , j 曲 , 3 ，艺篓孑。协l o 。c + t 。湍。、k 。n o “q 嚣i 煞。：器：等k 。i - ：、 差。j b hq 口ie j r 口u ”* l j ； ，。淼。二t 豳j 魏 篙黜z 鬻 一j 氧 。霎一一一- _ 躲私盎。器絮出蛊高：= ：絮：= 嚣：嚣 量太多；8 5 的网民认为网络广告缺乏特色和创意。虽然这是一篇对于网络广告的调 查报告，但从调查中出现的数据可以得出：由3 2 网民提出的“方式”；1 7 网民提出的 “数量”，以及8 5 的网民提出的“特色、创意 ，都集中在视觉表现上，那么总结起来 就是有5 7 5 的用户针对网络视觉体验提出了不满，进而导致对于网络广告的“不喜欢 恰恰显示了视觉引起的情感体验结果。 。信息来源于中国通信网c l l 4 ，网址：h t t p ：w w w c 1 1 4 n e t n e w s 4 3 a 3 6 1 7 8 h t m l l o 2 网页中的交互 2 1 信息的交互 信息的多方位传达已经成为现代生活中为人们习以为常的事情，从静态的图片到动 态的影像，再到数字化图形，人们通过发展着的媒介不断改变着信息的传递方式。从纸 张、到影碟，到磁盘，到芯片，这些新媒介的载体成为了人们日常生活中的装饰物：手 机、数码相机、m p x ( x 是指数字3 、4 、5 等，随着技术的发展，这一娱乐硬件不断升 级) 、掌上电脑等等。而相关的媒介设计也产生了，其中有电脑界面设计、手机界面设 计、触摸屏界面设计等等，这诸多的与用户行为密切相关的设计中，与交互相关联的视 觉信息就成为了交互外化的关键核心。 2 1 1 交互信息的内涵 交互设计传达的信息可以被分为三大类，一类是视觉信息，如：网站的色调、线条、 编排等这类点、线、面等的视觉信息，另一类是实用信息，如：具体的消息、新闻等具 有实用价值的数据信息；最后还有交互过程中的行为信息，行为信息是指各类诉诸于交 互动作的提示、引导等的指示用户操作的信息。 这三者之间，实用信息是用户的直接目标；视觉信息是对用户审美的潜意识影响； 行为信息是交互的中间桥梁。 实用信息只有通过行为信息的中间作用，才能够被用户接收，而视觉信息则会影响 用户对行为信息的识别、理解和应用。例如：用户到达一个网站后，首先映入眼帘的是 网站的整体色调和排版，这是用户被吸引的首要一环。这也是首先的视觉信息的传达， 也可以说，视觉信息是无时无刻不再影响着用户；其次，在这种既定的氛围中的人机交 互，是通过用户使用鼠标与页面上的行为信息进行交流互动，从而完成实用信息的接收。 2 1 。2 交互者间的关系 交互设计业已成为当前网页设计的主角，并逐渐成为了一门独立的课题。它体现在 网页设计的各个阶段，从前期设计到中期数据整合，再到后期的数据测试，信息交互的 有效性成为判断一个网站有用或有价值的首要标准。 众所周知，用户浏览网页面对的不是一个固定的事物，而是依据用户操作的变化而 不断变化，作为交互的载体，它会随时间、空间而变动。 ( 1 ) 半主动关系 对大多数网络用户来说，阅读网页上的信息是一种单方面的接受，就象是看一本书 籍或报纸，只是将其中固定的信息通过眼睛接收到大脑中。这是一种半主动的接受，之 所以称之为半主动，是因为这种阅读行为不是一种完全被动，完全被动包含一种强制， 而对于网页阅读，用户对于不需要的信息完全可以忽略。 ( 2 ) 主动关系 在交互的前提下，网页能够根据不同用户的登录信息，为其显示不同的信息，这里 的信息可以是用户自己预定的，也可以是网页信息管理人员根据用户需求分析帮助其制 定的一些信息，这里就形成了一种主动关系。而另一方面，又不是完全主动，因为这里 所看到信息，只是网页单方面传达给用户的。这里似乎需要一种巧合，那就是网页信息 恰好是用户所需要的，于是这就产生了一种单方面的看似主动的关系。 无论主动或是半主动关系，都属于动态的关系，即，两种关系不是固定不变的，而 是融合在一起的，也时常发生相互变化，简言之，主动或半主动来自用户的使用目的， 用户的目的变化了，人与机器之间的交互方式也就发生了变化，那么他们之问的关系也 就产生相应变化。 人和机器的关系，实质是人与人的关系，而良好关系的建立，也直接体现在交互设 计的流程和视觉表现两方面。只有在设计者对用户进行良好的分析与理解的基础上，才 能建立良好的交互设计。 1 2 3 网页交互的视觉体验 3 1 虚拟情境中的情绪 每个人都会产生情绪，这是与生俱来的，目前，还没有一个对于“情绪 的公认的 定义，大多数心理学将情绪定义为一种复杂的变化过程，包括生理唤醒、主观感觉、认 知过程、行为反应。 从目前的情绪定义来看，行为被定义在情绪之中，是情绪的一部分，也是最后一部 分，是在生理唤醒、主观感觉，认知过程之后产生的。从这里可以看出，行为反应的产 生来自于前面诸多过程的结果，而第一位就是生理唤醒，这不难理解现在为何如此多的 商业巨制的出现，首先都在满足人的生理需求。对于网页的互动性来说，引起行为的前 提是，必须使人产生行为的欲念，这种欲念更多来自感官上的触觉，从而引发相关的感 觉和认知过程，最终产生行为反应。 美国心理学家普拉契克将人类的主要情绪分为八种：“喜悦、接受、恐惧、惊奇、 悲伤、厌恶、愤怒和期待”。这些情绪都会产生不同的行为反应，虽然人的情绪是复杂 的，但是，对于研究视觉课题，我还是将它们，简化为“良性情绪”与“不良情绪”， 通俗来讲，就是喜悦与不悦，因为，我们的确不需要为一个网站而产生愤怒或悲伤。 情绪到底是一种物质，还是一种意识，这需要留给哲学家们去思考。根据目前相关 研究的结果，能够肯定的是，情绪不是无端形成的，而是来源于各种生理体验，是由客 观环境、周边事物相互作用而产生的。有一本心理学改变生活的书籍，描述了各种 常态或非常态的人的心理研究，其作者认为，“情绪体验不只发生在个体内部或大脑中， 而更多是发生在我们与环境的关系中。这是一种开放式的观念，与“事物不能独立 存在 一样，情绪也来自于一种动态的关系，也可以理解成一种事物或现象之间的引起 和被引起的因果联系。 在互联网中，随着用户触摸和移动鼠标所关系到的虚拟环境的变化，产生相应的视 觉与触觉的生理体验，就成为了引起情绪反应的关键。对于浏览网页的用户来说，页面 环境这种虚拟物，也同现实中的环境一样，尽管这个环境是虚拟的，但人在这种虚拟中 产生的情绪，不是虚拟，而是真实存在的。 3 2 视觉体验的个- 陛与共性 正如德加所说：“乔托和凡高不同，是因为他们看事物的方法不同 。视觉体验是具 有个体差异性的，除了与用户的心理、经验有一定关系之外，与用户的当时环境也有极 大联系，另外由于每个人的生活方式、个性，所受教育，以及成长环境等的差异，具有 。心理学改变生活( 美) 卡伦达菲张茕，丁云峰，杨洋译世界图书出版公司p 2 0 5 心理学改变生活( 美) 卡伦达菲张莹，丁云峰，杨洋译世界图书出版公司p 2 0 6 不同文化背景的人，看待事物的方式必然不同，都就会产生不同的情感体验结果。 这一点看来，体验似乎无法进行归纳，似乎是一种没有规律的事物，但是，规律是 普遍存在的，因此，体验的种种差异不是绝对。 首先，从文化环境角度来说，对于某一特定人群来说，一定能够找到他们情感体验 的交集，这些交集就是类似情感需求的来源。例如：生活在同一地区的人，会有着相类 似的生活习惯；而在一种文化氛围中熏陶的人，其审美习惯也大致相同。通过对特定人 群的情感研究，可以预测其体验的共性，也就是一种情感共鸣的群体性体验。 其次，从行为方式上来说，由于互动方式的共性也可导致群体体验的结果，也就是 说大家的浏览思路是在既定的一个流程中发生，即：大家面对的是相同的交互流程，这 个流程是预先被设计好的一种或几种，用户的行为都在这个范围之内进行。因此，这种 行为上的相似，也有可能使得目标人群达到体验过程的相似。 因此，个体情感研究和群体情感研究是体验研究的两个方面，前者是区别个体差异 性的个性研究，后者是挖掘特定人群情感体验中的共性研究，这些结果成为视觉设计开 始的源点。 3 3 体验的乐趣 人类发明工具，还要不断在工具之上找回人不借助工具的自我能力，找到符合人的 自然属性的舒适度，因为人的情感体验是驱使科技进一步升华的动力。 美国西北大学教授诺曼( d o n a l d a n o r m f l l 1 ) 在一篇访谈中说到“以人为本 不对， 应该“以使用为本”，强调的是用户体验( u s e r e x p e r i e n c e ) 。他认为，仅仅研究人类学 ( e t h n o g r a p h i cr e s e a r c h ) 是不够的，还要关注用户体验的全过程中的各种因素。例如： 商业模式有多重要、价格有多重要，服务质量有多重要；用户期待的从购买到使用到的 是一种什么姿态和享受等等。 他的理论无疑是基于商业目的来研究用户体验，对于“以人为本的思想显然有些 咬文嚼字，其实他强调的“以用为本”中的用，也是人的用，而非其他机器或动物，因此， 无论。以人为本一，还是“以用为本刀，都是在以人的情感体验为基础，都是“为体验而 设计 。 诺曼在其著作未来产品的设计的后记中说到机器们的观点，他以机器的口吻， 列出了五项与人交互的原则，1 尽量简单；2 清晰的概念模型；3 给出理由； 4 掌握着控制：5 持续的信心。从表面看，文章的语言幽默、风趣，谈到了人 类缺乏信任；喜欢简单的过程等等，实际上是作者用了拟人化的手段，提出了人机交互 过程中的情感体验问题，人们总相信自己亲眼所见、亲耳所听；喜欢即时反应；相信自 未来产品的设计( 美) 诺曼刘松涛译电子工业出版社p 1 7 0 1 4 己的感觉 人类依赖于感官，这是一种本能，因为人类具有情感这一客观因素。我们一直都在 乐此不疲地利用和开发着这种本能，使其不断上升成为一种享受的愉悦，感官刺激产生 行为的冲动，就好像看到一个漂亮的突起的按钮，总能引起人点击的行为。人类需要体 验，只有通过自身的感官体验，才能达到情感的满足。 马斯洛的需求层次理论中描述到，“我们的需求和动机以从低到高的等级结构方式 运行”，他描述了五个需求层次：生理、安全、爱和归属、尊重、自我实现。这之中， 生理需求被安排在首位，也即说明，人类首先是通过感官知觉与外部世界相联系，人类 一切更高层次的知觉体验，首先要有物质的基础，即，人类自身的躯体感受。 网站交互不仅仅为满足用户查询资料的简单目的，而是在此基础之上发展出的更多 合目的的享受功能。感受网站的整体传达信息是否符合自己的审美及心灵需求，只有当 页面的传达高度契合目标用户的精神需求时，才能使用户达到审美心理的平衡，以及对 网站审美价值的肯定，网站给与用户的情感体验是愉悦或是失望，决定了用户对于网站 效率感的判断。 因此，优秀的交互视觉的体验设计，就是在降低交互过程中产生的模糊因素的同时， 使用户轻松地理解并把握交互的流程，并且能够消除用户对于网站虚拟环境的陌生感与 距离感，消除用户心理上的消极心态，达到更愉悦的体验状态。 3 4 视觉的体验与沉浸 如果说，体验还在追求大众心理的情感感受，那么沉浸已经开始尝试试图将人的意 识与肉体进行分离，实现情感体验的完全释放。最新上映的3 d 电影阿凡达，利用新 科技的视觉