网页设计对PAD情感体验的影响

网页设计对PAD情感体验的影响 本文关键词：网页设计，影响，体验，情感，PAD

网页设计对PAD情感体验的影响 本文简介：内容摘要：用户的情感体验对网页的可用性评价与网页设计有直接关系。本文通过眼动实验研究用户体验中的PAD情感对网页设计的影响，设计了网页界面色彩、版式、文字、图片等的眼动实验，根据实验结果总结了布局、色彩、图片等设计元素对喜悦度（P）、激活度（A）、主导度（D）的影响。本文弥补了传统可用性研究对用户P

网页设计对PAD情感体验的影响 本文内容：

内容摘要：用户的情感体验对网页的可用性评价与网页设计有直接关系。本文通过眼动实验研究用户体验中的PAD情感对网页设计的影响，设计了网页界面色彩、版式、文字、图片等的眼动实验，根据实验结果总结了布局、色彩、图片等设计元素对喜悦度（P）、激活度（A）、主导度（D）的影响。本文弥补了传统可用性研究对用户PAD情感体验过程的不足，还强调了用户体验对网页界面可用性影响的重要性，眼动实验的加入更增加了其结论的科学性。

关键词：网页设计、用户体验、眼动仪、PAD情感体验

视觉设计是网站内容、架构与交互模式的最终呈现，是和用户进行交流的对话层，它的好坏直接影响用户的使用感受。当人们处在愉悦情感状态时，认知能力和行为能力会有显著增强，页面整体浏览时间、各兴趣区停留时间都长于在不愉悦情感状态下，部分数据的差异达到了显著水平或边缘显著水平。当人们处于不愉悦情感时，其注意范围和认知范围会变狭窄。此时，个体会更加关注局部的细节信息，浏览网页时注视顺序会产生变化。[1]在用户的情感体验对网站影响的研究中，PAD的情感状态空间模型(以下简称PAD情感体验)受到关注。它由Mehrabian和Russell于1974年提出，是一个可以表达情感维度的模式，目前已被VirtualHuman和NECA等研究领域的众多学者所认同。它将人类的情感表示为三个维度，分别是:喜悦度（Pleasure），用于显示用户正负的情感状态；激活度（Arousal），用于显示用户的神经生理激活水平；主导度（Dominance），用于显示用户的控制情况等。网页界面的布局是基于布局组合的图形、文字、色彩、版式等，并与用户发生互动。[2]一个设计优秀的网页交互界面可以保证用户在使用过程中保持激活度、喜悦度、主导度等体验的提升。[3]为了实现网页界面设计良好的PAD体验，即喜悦度、激活度、主导度，设计者可通过眼动实验来研究调查网页界面的信息表达形式。通过第一注视点、注视时间、浏览轨迹等眼动指标，研究网页界面元素对喜悦度、激活度、主导度的影响。[4]本文将通过实验来分析PAD情感体验在交互过程中的表现，以总结PAD情感体验的规律，指导网页交互界面的设计，期望有助于设计师通过适当改变设计形式来达到用户的要求。实验采用的是Arrington固定式眼动仪，测试软件ViewPoint-USB-220，分析软件DataAnalysis，主要任务是自由浏览任务和补充任务。

一、自由浏览任务

指用户在无明确任务目标时对特定页面区域进行的浏览行为。实验对象分类别进行，有门户网站、企业网站、高校网站。考虑到高校网站首页呈现内容较为相似，对比实验的结果可比性较强，故本次先选取10个具有代表性的学校网站首页界面作为对象，被试为接触互联网较多的在校大学生。每个图片播放时间不定，用户可随意进行浏览。目的是了解用户对特定页面的感知体验，分析在交互过程中影响用户情感体验的是什么，以及用户的情感体验需求在网页设计上的体现。1.第一注视点分析和注视时间分析首先对10个高校首页进行注视点的分析。可看出用户的第一注视点通常落在网页当中比较显眼的位置上，例如比较鲜艳的颜色、图案上面，而文字很少被注意到。这是因为人的视觉焦点一定会被刺激类的颜色吸引到，当图片和文字共同出现时，人的本能反应是先看图片而后才看到文字，因为用户在获取信息时希望可以得到不需要经过再处理的、能直接获得的信息，所以避开“麻烦”的文字，而选择情感上容易接受的图片浏览，可以减少信息再处理的压力。对实验样本的注视时间进行统计，发现：（1）人们会对纯度相对高及和缓的颜色产生持续浏览的兴趣，浏览时间较长；（2）如果网页界面排版合理，呈模块化排列，不显得过于拥挤，用户就不会出现“厌恶”的情感。这说明纯度高的色彩、合理排版的版式会提高喜悦度（P）。从平均注视时间表可看出，样本中布局不合理、色彩使用较少的网页界面反而受注视的时间会相对较长。这是因为文字的排列不当会使得网页整体界面呈现局促的视觉感受，由于心理的紧张感和压力感，往往就会忽略掉一些信息，视觉高度集中在密集的句子之间，延迟了人获取信息的速度，同时造成视觉和心理的双重疲劳，影响使用感受，从而影响到用户的主导度（D）和激活度（A）。2.区域图和浏览轨迹分析设计良好的网页界面在扫描路径上的特点是脉络清晰、条理清晰，喜悦度（P）和主导度（D）较高。观察用户在网页中的浏览轨迹可分析其浏览习惯。实验将网页分为四个区域来观察其区域图的注视点个数及注视轨迹。通过对20位测试人员的眼动数据图的结果统计整理，发现1区与3区在注视点个数上没有产生明显差异，而1区与4区却差异明显，被试在1区内的回试次数多，在4区回视次数较少。原因是人们日常阅读的习惯是从左往右来回浏览，如果反向而为就会阻碍用户获取信息的效率，浏览时间加长。心理学研究还表明，用户在同一平面上的不同位置有不同的感觉。例如：上半部分会让用户感到轻松、舒适，较低的部分会显得更稳定或沮丧；左半部舒展、轻松，而右半部相对拘谨和受限。在视线规律上对原始轨迹图整理发现，用户的视觉路线可总结为：从左往右，左侧又强于右侧，从上往下，视觉在上半部分的注意力强于下半部，如图1所示，基本符合视觉运动规律。从某样本的轨迹图（图2）来看，途中会有一段折返线路，是经过了一些文字信息后返回刚刚浏览区的图片。这说明图片比文字更具有吸引力，在设计时可考虑在大篇的文字信息出现时适当加入图片以吸引用户，提升用户的兴趣。3.色彩使用分析经过问卷调查后选取样本b的网页界面进行测试，来分析色彩使用对被试者的影响。图3为样本b网页的注视轨迹图，可直观地看出，除了图片对注视点的吸引，基本上都是色彩吸引着用户的注视点转移并形成轨迹，色彩比较强烈的地方都有被试者的注视点散布。这说明色彩对比是有效牵引用户视线的手段。问卷调查结果也显示，样本b的网页是所有网页中比较受用户喜欢且印象深刻的，页面中使用清淡的蓝色及灰色，使得界面中的元素之间呈现出简单、直观的对比，而少量黄色对比的加入，会提升对整个页面的喜悦度（P），被试者也能对元素有足够的视觉注意。图4所示的注视热点图中，注视热点区域较多且均匀分布在整个界面中，说明界面中元素收到了吸引足够视觉注意的效果，这也说明多数被试者的兴趣倾向于具有清晰、简单、直观色彩对比显示的交互界面。图5样本d的网页界面热点图中，红色热点区明显集中在上半部分，下半部分虽有注视，但停留时间不长，次数不多且分布不均匀，表明该网页的界面设计较差，在调查里的用户评价也是最低的，无法引起用户的共鸣。

二、补充任务

补充任务没有针对以上10个高校网站，而是对网页的部分设计元素进行分析。实验对象选取的是文字、色彩、符号有一定对比的图片，被试依据喜好有意识地去浏览和切换图片，分析眼动数据，得到设计方法来提升用户使用网页时的情感体验。1.文字的应用分析通过文字的间距排列及文字颜色的饱和度对比，分析哪种更能引起用户的认同感。从图6的注视轨迹图看出，上图的段落浏览轨迹并不流畅，有不断的回视，浏览线路混乱，不能完整浏览完整段文字信息；下图的浏览轨迹则较为流畅、整齐，这说明字间距、段距、行距会对视觉产生影响，适当的间距和排距会使阅读更加流畅，而字距过小的会产生视觉密度和认知压力，用户无法继续浏览体验。在注视时间上，两个段落也呈现出明显差别。字体颜色饱和度偏低，字间距、行距较大的段落相对注视时间会较长，说明用户在这个段落能够获取足够的信息，获得比较好的用户体验，喜悦度（P）和主导度（A）高。2.图片的情感分析改变图片中能够传达情感的元素，适当加入符号或文字信息，以此观察被测对象注视路线的改变。对原始眼动数据图整理得到以下注视轨迹图。（图7）从上图看出，用户首先注意到图片中女士的眼睛，且注视时间长，之后视线开始转移到面部，最后到右边的产品上。下图则是注意到图片中女士的眼睛后立即转移到右边的产品上，并对产品进行浏览，对产品的注视时间点也相对较长。这说明图片能够引导用户行为，不同的图片类型可以传达出不同的情感。图片中的具象事物可以刺激人的激活度（A）和主导度（D），以帮助网页达到更好的易用性。对图片适当加入符号、文本信息后，注视轨迹图也有变化。当用户看到没有加入符号的注视轨迹图时，视线轨迹呈现犹豫不决、左右移动的状态，而后视线转向下面的用品展示区；在观察图片上加入符号的网页时，视线轨迹就不再呈现往复左右移动，而是经过图片符号指示后直接转向下方的用品展示区。（图8）说明图片是一种视觉的引导，可以传达出情感指向，提高了主导度(D)。图片如果有着特定语义，更易被用户熟知和理解，从而提高浏览效率。

结语

本文通过对眼动实验结果的分析和总结，得出网页界面设计元素对喜悦度（P）、激活度（A）和主导度（D）的影响，弥补了定性分析结论的感性与不足。鲜艳的色彩、图片、颜色的对比、元素之间清晰和简单的对比可以提升激活度（A）和喜悦度（P），但色彩量过多会使人放弃浏览，色彩的对比因而未能起到该有的作用。符合视觉规律的版式设计对主导度（D）影响较大。字体颜色饱和度偏低，段落字间距、行距较大，会提升喜悦度（P）和主导度（D）。分布合理的图片会提升激活度（A），有一定语义的图片、加上符号或文本信息的图片等对主导度（D）的提升有帮助。

作者：薛艳敏 戴毓

《网页设计对PAD情感体验的影响》由：免费论文网互联网用户整理提供；
链接地址：http://www.csmayi.cn/show/213668.html
转载请保留,谢谢!

• 上一篇：提升学生英语写作能力的途径
• 下一篇：高校教育管理策略