用户体验视角下的E-learning视觉设计要素研究

咸妍

摘要：本研究的目标是探究哪些视觉要素对使用者学习成效产生影响。研究在用户体验设计的视角下，通过运用文献调查、访谈和问卷调查的方法，对E-learnlng的视觉要素的类型和功能做了研究。本研究认为E-learning中文本和非文本都属于视觉资料的范畴。从使用者的体验视角研究发现，社交性要素是使用者潜在的需求，社交性是数字化学习的特性之一。因此，在现有Levin视觉五要素的基础上，形成具有“组织性”、“描述性”、“解释性”、“变形性”、“装饰性”和“社交性”的E-learning视觉要素六角模型，并区分了各要素与学习内容和学习持久度的相关程度。该模型能够为E-learning开发者提供视觉设计层面的理论依据，为使用者提供合理、系统的视觉信息资料，从而提升使用者满意度和促进E-learning的学习成效和使用者持久度。关键词：E-learning 视觉设计要素 社交性 六角模型 用户体验

中图分类号：J52文献标识码：A

文章编号：1003-0069（2019）11-0094-04

引言

十九大对中国未来的改革开放做出了全面的部署，全国教育大会对未来教育提出了新要求。E-learning作为数字化时代的产物，正逐步普及到各种类型的教学中。基于数字科技的快速发展，E-learning的应用场景也越来越广泛。视觉座位人类的第一感官，适合的视觉要素对E-learning的学习效果和学习持久度有紧密的关联。

一、E-learning的定义

20世纪90年代中期，随着基于网络信息通信技术的发展，电子学习的出现加强了整个社会追求效率的趋势。数字化学习降低了跨地域的学习成本，增加了分散在各地的使用者学习的新途径。最初，管理层强调了数字化学习的重要性，自这一术语最早被用于企业教育（Bates.a.t.，2005）。目前E-learning在学校教育领域中逐步普遍。除了电子学习之外，还有各种术语涉及E-learning教育，如远程学习，数字化学习、网络教育，在线学习和基于网络的培训等多种词汇。自2000年起，基于数字技术的成熟，大量的学者开始关注E-learning。从国际发展脉络来看不同时期E-learning的定义，如表1所示。

从上述发展脉络可以看出，Urdan&Weggen最早提出E-learning的学者之一，他们将E-learning定义为使用互联网、卫星广播，音频，录像带，CDROM等电子媒体传达学习内容的方法。Garrison.d.R（2011）提出了社交媒体和移动学习的新技术讨论。AISamarraie等关注用户学习的满意度。随着数字通讯技术的发展。E-learning的发展从最初对技术硬件软件技术的研究转向重视使用者所处的环境、满意度、情感需求等以人为中心的研究。这正符合体验时代HCD（HumanCentered Design）以人为中心的设计发展趋势。

二、E-learning数字学习资料中的视觉资料

从使用者的角度出发，E-learning与传统教学比较最大的变化是使用者学习认知的过程从听觉为主转化为以视觉为主。信息技术的革新改变了知识传播和学习认知的方式：听觉主导-转化为视觉主导。在数字化设备普遍应用于教学之前，教师是课程的主导人，学生听老师讲课来进行学习。教师在黑板上的板书和印刷材料是教学过程中主要的视觉要素。随着电视显示器和投影机的普遍应用，数字化课件逐步替代了教师的板书，甚至是教材。学生在数字化设备前，主要依靠视觉要素来引导教学活动的实施。因此，视觉要素在E-learning中重起到了主导地位，数字资料是学生获得教学信息的主要资料形式。

（一）E-learning中视觉要素的重要陸。E-learning学习过程中，主要调动人类五感中的三感，即视觉、听觉和触觉。视觉作为主要感官，引导使用者进行行为操作。听觉主要呈现在口述文本和音乐、音效部分。触觉关系到使用者使用电子设备的接触方式。其中视觉资料是数字学习资料中最重要的部分。好的视觉效果对学习提供潜在的好处。一些研究者对视觉要素研究表明，视觉记忆和回忆比普通文字记忆要好（Levin.1981;Clark&Lyons.2004）。适合的视觉效果可以引起读者的兴趣、好奇心和动机（Mayer.2001）。由于在E-learning学习时，视觉是体验者最重要的感官，因此，视觉设计要素的构架在E-learning设计中具有重要的地位，将直接影响体验者的学习效果和体验感受。

（二）Levin提出的5个E-learning视觉设计要素。作为将视觉资料功能分类的方法，应用最多的是Levin.Anglin&Carney（1987）分类的五个范畴。包括装饰、特征描写、组织、解释和变形，如图1。

装饰性视觉资料是用来使课程更具吸引力和激发内在动力的，与课程内容无直接关联。

特征描写性视觉资料能用于更具体地制作信息，帮助快速和容易传递信息。

组织化视觉资料能帮助使用者了解信息的结构，系列和层次，并统一其信息。为使用者提供整体的学习视野，帮助使用者看到各个要素间关系的图表等可以称为组织化的视觉资料。

解释性视觉资料能帮助使用者理解困难和模糊的内容。一般而言，解释性视觉资料有助于更好地了解文本的信息。

变形的视觉资料能更好地记住信息。在此可以理解为用于强化信息的視觉资料。

在目前被使用的E-learning场景中，大多数具有以上5点。

（三）ETearning的视觉资料的形式。E-learning的视觉资料是非语言性沟通的一种类型（Lohr.2008）。Mayer（2009）对多媒体语言和非语言要素进行了分类，如表2所示。语言分为口述文本和印刷文本两种形式，具体表现形式为在数字学习资料中显示的录像、文字等形式。

E-learning学习资料中的非语言归纳成固定图像和动态图像两种分类。具体内容包含绘画、照片、插图、地图、图表、排行榜、动画等形式。

一些学者试图将视觉资料按形态分类，Braden（1996）将视觉资料以符号学及电影/录像会议，符号，符号及图标，图像，多彩图像分类。这些图形，照片，插图等内容都是非文本非语言的要素。

在这些分类中，Lohr（2008）为了形成信息，添加了以特定方式提示单词或文字时使用的字体，将其视为视觉资料。Braden（1996）认为文本也包括在视觉资料中，因为在设计文本时，需要考虑文本的字体、大小、色彩和位置。因此，本研究认为E-learning中文本和非文本都属于视觉资料。

（四）数字视觉学习资料的优点与不足。数字视觉材料是一种用于从传统教科书到现代计算机学习环境的学习材料（Rau.2017;Renkl&Scheiter.2017）。视觉材料可以沿若干维度变化，例如真实性、动态和维度的变化（Mayer.2016）。大量的实证研究表明，与单独使用文本学习相比，文本和图形的结合激发了更深层次的处理，因为它要求使用者将信息整合到不同的环境中（例如，Alnsworth&Loizou.2003;Cromley.Snyder-Hogan&Luciw Dubas.2010;Mason.2015）。

数字视觉资料中的图像资料通常不是独立的，而是与诸如文本的附带信息源相结合。来自视觉表示的信息需要与文本的信息集成，以形成内容的全面，连贯的心理模型（Mayer.2013）。因此，在学习中使用视觉显示的关键问题是如何将视觉信息与其他类型的外部表示相结合。

尽管数字视觉资料能显示出E-learning的学习效果，但实际上在进行E-learning吋，使用者在视觉阅读方面存在一定的不足。E-learning的出现，在学习方式上提供了诸多积极的结果。屏幕上显示的视觉要素的改进将创造动态和快乐的环境并增加用户的满意度。经过调查表明，并非所有的视觉资料都能起到积极正面的效果。视觉表达作为数字学习资料首要的表现方式，如果运用不当可能产生负面的效果。尽管E-learning提供了视觉资料的多样性，从文本、静态图片到动态视频等，扩大了知识获取的范围，但是使用者在阅读和学习数字学习材料方面也遇到的困难（Gibbons.Peters&Bryan.2003）。

因此，E-learning中的视觉要素使用是否合理直接影响了E-learning的使用者的学习体验和学习效果，也影响了学习者是否能坚持使用E-learning。

三、用户体验视角下的E-learning使用者调查

约瑟夫在“哈佛商业评论”中指出，体验经济的时代已经到来。从那以后，“体验经济”这个词受到了人们的极大关注。在设计界美国认知心理学家的唐纳德，诺曼在20世纪90年代的第一次用户体验的概念。

使用者研究通常用于识别使用者的兴趣点，帮助设计师设定产品设计的方向。它能发现产品问题并优化产品体验（Xian Yan.Ju-youngChang.2018）。使用者作为E-learning的直接服务对象，其使用体验是E-learning教学效果评价项目之一。对使用者的研究，可以洞察使用者的潜在需求，结合E-learning的教学目的和教学技术，进行多元融合的E-learning开发。

本研究以访谈法和问卷调查法对使用者进行调查。从E-learning使用者自身体验的角度出发，寻找他们在使用E-learning时的潜在需求。并了解这些需求产生什么样的作用。

通过对10名E-learning的使用者访谈发现，E-learning学习过程中，相对学习内容，使用者更注重学习过程中是否能坚持学习。比如一些网站或APP平台学习后可以在SNS上发布打卡，以促进使用者每天持续学习。也有通过和一起学习的朋友进行Pk.以游戏的形式保持学习的热情。有趣的是，尽管社交性的内容与学习内容没有直接关系，但是受访者们普遍对社交性的要素很感兴趣，认为社交性要素是保持持续学习的重要动力。在访谈过程中，使用者们提出的社会性的视觉要素的展示形式主要包含以下内容：显示学习等级、显示学习身份、显示学习时间、显示相互评论、显示虚拟班级团体情况、显示教师评价、显示个性化等。

为了有量化的证据，本研究通过网络发放调查问卷对336人进行调查。其中有效问卷323件，受访男性121名，女性212名。从年龄分布来看，18-21岁大学本科阶段113人占33.93%，22-35岁158人，占47.45%。学历以大学本科最高，占55.56%，其次为硕士研究生和博士研究生，分别为18.92%和12.01%。

在323人中，273人使用过E-learning学习。其中，沪江网校、新东方在线和中国大学MOOC名列前三，如图2。

研究表明69.37%的使用者认为，对印刷资料学习时更仔细而数字资料阅读时更快。在E-learning学习时，受访者认为首要的视觉资料形式有：文字、图片和视频。其中视频要素占84.83%是其他类型视觉资料中最高值，如图3。

81.98%的受访者认为动态视觉要素更吸引人。73.27%的使用者认为动态视觉资料使人注意力集中。这说明了E-learning视觉学习资料中，动态图像受到使用者的關注。因此与文本有关的动态图像将更好地对教学内容进行描述和解释，如图4。

使用者在观看视频吋，68.17%的受访者倾向于视频内容以学习内容为主（文字、图像、动画等组成的教学视频），31.88%的受访者倾向视频内容是以教师为主体，可以观看教师口述的现场教学视频。由此可以看出，在E-learning的交过过程中，与传统教学相比较，教师的重要性正逐渐被淡化，如图5。

在E-learning的视觉要素中，80，5%的受访者认为对学习内容的结构和层次说明的视觉要素最为重要。其次，是对学习内容的解释占70，28%和特征描占69.66%居于第二和第三，如图6。

在访谈过程中，一些使用者提出有关于在E-learning过程中，体现社交性的问题。通过访谈，社会性的视觉要素包含以下内容：显示学习等级、显示学习身份、显示学习时间、显示相互评论、显示虚拟班级团体情况、显示教师评价、显示个性化等。79%的受访者希望看到社交性的视觉要素。其中，受访者中显示学习希望看到的社交性视觉要素是：37.46%的受访者希望向公众展现个人的学习时间;36.84%的受访者希望显示自己学习等级;33.13%的受访者希望展示教师对本人学习的评价信息，如图7。

从上述调查结果来看，现今E-learning使用者有潜在的对社交性视觉要素的需求。

E-learning随着互联网通信技术的发展，逐步体现出新的特质。比如MOOC.令使用者从终端独立学习发展到基于互联网的虚拟班级共同学习，这里就产生一个社会性的因素，如表3。

本研究选择在中国知名度高的三个E-learning平台：沪江网校、新东方在线和中国大学MOOC.以及欧美最大的E-learning平台COUR5ERA作为案例调查发现：这4个E-learning平臺均拥有上述大部分社交性要素。人具有社交天性（Matthew d.Lieberman.2016）虚拟班级学习排行榜、讨论室标签、学习的等级标识、评价等级标识等都是E-learning的社交内容的视觉体现。这些由社会性需求产生的视觉要素在各大E-learning学习平台上出现。通过调查结果得出，E-learning学习过程中，社交性要素是必要的视觉要素。它在使用者进行E-learning学习过程中，除了产生人机交互，同时产生人人交互。通过社交的存在感，不仅是使用者选择课程的因素，也是提高使用者学习的动力和学习满意度的重要因素。因此，本研究认为，从使用者视角出发，社交性视觉要素是E-learning必要的要素。

四、E-learning视觉设计要素六角模型

通过访谈和问卷调查结果表明，使用者对社交性的需求是E-learning必要的要素，因此本研究在原有Levin（1981）视觉要素的5个要素的基础上，增加了社交性要素，形成新的符合时代需求和使用者潜在需求的E-learning视觉6大要素。为了更科学地设置视觉要素在E-learning中的比重，本研究针对视觉要素与学习内容的相关程度做了桌面访谈，形成一个新的E-learning视觉6要素的设计框架。基于E-learning 6大视觉要素和学习内容、学习持久性的关联度，形成E-learning视觉设计要素六角模型，如图8。

E-learning视觉设计六要素模型从与学习的关联度分为三个维度。

（一）与学习内容密切相关的要素：

1.解释性视觉要素：为了学习者能够理解知识信息传达的内容，利用视觉手段对知识信息进行解释。

2.描写性视觉要素：利用视觉表现方式对知识信息进行描述。

3.强化变形视觉要素：利用视觉得静态表现方式或动态表现方式，为了强化某些必要的知识要点，使其进行变形，以达到吸引学习者注意的目的。

（二）与学习内容和学习持续性相关的要素：

1.组织性视觉要素：帮助使用者了解整体的学习信息的构架和层次，为使用者提供整体的学习视野，帮助使用者看到各个要素间关系的图表等可以称为组织化的视觉资料。

（三）与学习持久性相关的要素：

2.装饰性视觉要素：从使用者的爱好、习惯和情感方面考虑，具有装饰性的视觉内容虽然不能对学习知识起到直接的关联，但是它能使使用者心情愉悦，从而吸引使用者持续学习。

3.社交性视觉要素：基于互联网的高速发展和人们日益增长的精神文化需求，人们对自我的表达的需求也逐步增高，成为潜在的体验需求之一。

综上三个维度的6个要素是E-learning视觉设计的必要要素。

总结

E-learning视觉设计要素六角模型中的视觉要素分别是“组织性”、“描述性”、“解释性”、“变形性”、“装饰性”和“社交性”，它们是E-learning视觉资料的必要要素，它们从对学习内容的整理构架出发，重视教学的过程技术表现以及对使用者个陸和社会性需求的关注，覆盖E-learning中的视觉表达的各个功能。这个E-learning视觉设计要素六角模型将在用户体验的视角下，为E-learning设计者在视觉设计过程中提供理科学的论依据，对提高使用者满意度和学习成效具有指导的价值。

本研究后续将进行相关实证研究，来测试六角要素模型各要素的合理比重以及在实际应用中的长处与不足。