硕士学位论文-基于web_的远程教学系统交互设计研究.pdf

i 密级：密级： 保密期限：保密期限： 硕士研究生学位论文 硕士研究生学位论文 题目： 基于题目： 基于 web 的远程教学系统交互设计研究的远程教学系统交互设计研究 学学 号：号： 076878 姓姓 名：名： 付增福付增福 专专 业：业： 教育技术学教育技术学 导导 师：师： 文福安文福安 学学 院：院： 网络教育学院网络教育学院 2010 年年 6 月月 11 日日 ii iii 独创性(或创新性)声明 本人声明所呈交的论文是本人在导师指导下进行的研究工作及取得的研究 成果。尽我所知，除了文中特别加以标注和致谢中所罗列的内容以外，论文中不 包含其他人已经发表或撰写过的研究成果， 也不包含为获得北京邮电大学或其他 教育机构的学位或证书而使用过的材料。 与我一同工作的同志对本研究所做的任 何贡献均已在论文中作了明确的说明并表示了谢意。 申请学位论文与资料若有不实之处，本人承担一切相关责任。 本人签名： 日期： 关于论文使用授权的说明 学位论文作者完全了解北京邮电大学有关保留和使用学位论文的规定，即： 研究生在校攻读学位期间论文工作的知识产权单位属北京邮电大学。 学校有权保 留并向国家有关部门或机构送交论文的复印件和磁盘， 允许学位论文被查阅和借 阅；学校可以公布学位论文的全部或部分内容，可以允许采用影印、缩印或其它 复制手段保存、汇编学位论文。(保密的学位论文在解密后遵守此规定) 本学位论文不属于保密范围，适用本授权书。 本人签名： 日期： 导师签名： 日期： iv v 基于 web 的远程教学系统交互设计研究 基于 web 的远程教学系统交互设计研究 摘要 国内的远程教学系统界面拥挤凌乱，往往让使用者找不到重点。 在页面上堆积了有用的和没用的信息， 功能貌似强大繁杂， 其实不然。 国外的教学系统却呈现了相反的状况，它们给人一种简洁大方的感 觉。简洁实用的特征让用户的工作变得容易、高效和愉悦。 笔者采用文献调研和案例分析的方法， 从基于 web 的远程教学系 统的设计与普通网站的设计的区别出发，综合交互设计的基本理论， 研究了多个远程教学系统的交互案例,对这些系统进行了介绍、功能 分析以及评价，总结了这些系统的优点，最后得出远程教学系统的交 互设计的核心原则以及评价指标。 现在国内外关于英语学习活动模板的研究还比较少。 在这样的背 景下，笔者对 31 种英语学习活动模板进行了系统的交互设计，并分 析了这些学习活动的特征。 本文研究的主要内容包括： (1)总结分析了最新的远程教学交互的类型，从而提醒新手在进 行教学系统交互设计需要注意的事项。 (2)阐述了交互设计中比较有名的理论和一些常见的误区，主张 以用户为中心的交互设计。 (3)分析研究了 5 个国际知名教学系统的交互和界面，从中得出 10 点启示，这些启示对以后进行教学系统的交互设计非常有帮助。 (4)设计了 31 个英语学习活动的交互界面， 设计了易用的学生录 音采集器和教师录音播放器。 关键词：教学系统 交互设计 界面设计 英语教学活动模板 vi vii Interactive Design Research of Web-based Distance Learning System Abstract The interface of the domestic long-distance teaching system is crowded and messy; often making the users can not find the key point. Useful and useless information are accumulated on the page, features seemingly powerful and complicated, in fact not. The interface of the distance education system abroad presents the opposite situation. They give a simple and generous feelings, features seemingly simple but very useful that allows users to easily learn and efficient work. For that reason, the author starting from the differences between the web-based distance education system interaction design and the interaction design of the general site, combining the basic theory of interaction design, studied a number of distance learning systems on interactive design. Finally, summed up the core principles, process and evaluation indicators of the remote teaching system on interaction design. The research on the English learning activities template at home and abroad is still relatively small. In this context, the author did systematic interaction design with 31 kinds of English learning activities template, and made a classification on the English template. The main contents of this paper include: (1) Summarized and analyzed the latest type of interaction on distance learning to remind the novice what should be paid attention on the interaction design of distance teaching system. (2) Described the well-known interactive design theory and easily understanding with the interaction design, advocates user-centered interaction design. (3) Analyzed the interaction and interface of five internationally renowned distance education system, and got points of drawn inspiration. These revelations are very helpful to the interaction design of teaching system on the future. (4) Designed 31 interfaces in English learning activities and easy-to-use students sound collector and teachers record player. viii Key Words: teaching system, Interactive design, Interface design, interaction Evaluation, English teaching activity templates ix 目录 目录 第 1 章 序论.1 1.1 研究背景及现状1 1.1.1 研究背景.1 1.1.2 研究现状.2 1.2 研究内容4 1.3 远程教学中交互的界定与交互类型4 1.3.1 交互的界定.4 1.3.2 穆尔的交互分类理论.5 1.3.3 希尔曼等人的交互理论.6 1.3.4 特里安德森扩展了的交互分类理论.7 第 2 章 交互设计概念与相关理论.9 2.1 交互设计的概念9 2.2 交互设计 VS 界面设计9 2.3 交互设计的目标 VS 交互设计的任务.10 2.4 流与透明性11 2.5 和谐12 2.6 色彩学基本原理和色彩的心理效应12 2.7 以用户为中心的界面设计13 第 3 章 教学系统交互设计案例研究.14 3.1 基于 Web 的教学系统交互设计.14 3.1.1 基于 Web 的系统特征14 3.1.2 学习者特点与网络教学环境.14 3.1.3 学习系统案例选择的依据.15 3.2 Moodle 及其交互评价15 3.2.1 Moodle 简介15 3.2.2 Moodle 的交互特征 16 3.2.4 Moodle 交互评价18 3.3 Atutor 及其交互评价.19 3.3.1 Atutor 的简介 19 3.3.2 ATutor 的交互特征.19 3.3.3 Atutor 的交互评价.20 3.4 eFront 及其交互评价.21 3.4.1 eFront 简介21 3.4.2 eFront 交互特征21 3.4.3 eFront 交互评价27 3.5 Bodington 及其交互评价.30 3.5.1 Bodington 介绍.30 3.5.2 Bodington 交互特征31 x 3.5.3 Bodington 交互评价32 3.6 英国开放大学的 OpenLearn 项目及评价.33 3.6.1 OpenLearn 项目简介.33 3.6.2 OpenLearn 项目交互特征.33 3.6.3 OpenLearn 项目的交互评价.38 3.7 以上几种教学系统的对比分析.39 3.7.1 从功能方面进行比较.39 3.7.2 从界面风格上进行比较.41 3.8 研究启示.42 3.8.1 合理组织复杂的界面元素和布局.42 3.8.2 合理使用色彩、图片和动画.44 3.8.3 严格遵循教学设计和课件设计的结果.45 3.8.4 合理保留有意义的信息.45 3.8.5 善于利用导航.46 3.8.6 尽量使用非模态反馈.47 3.8.7 让有用的信息飞起来.47 3.8.8 最小开销法则.48 3.8.9 “最熟悉”法则.48 3.8.10 保持“完整性”.49 第 4 章 英语教学活动模板设计.50 4.1 英语教学活动分类50 4.2 英语学习活动模板特征分析55 4.2.1 视音频材料录音特征.55 4.2.2 文本材料录音特征.56 4.2.3 自创录音特征.57 4.2.4 同步做题特征.57 4.3 英语教学活动模板的交互设计57 4.3.1 活动基本信息.57 4.3.2 口型对照.58 4.3.3 跟读对比.59 4.3.4 对话跟读.60 4.3.5 广播跟读.62 4.3.6 电视跟读而且，通过与他人的交流，学习者可以学习其它学习者的知识和智能。 因此，这种新技术条件下，学习者与学习者之间的交互愈来愈凸现出其重要性， 因为在某些特定类型的课程学习中它可能会直接影响到远程学习的效果3。 穆尔提出了“三种类型的互动”，即学习者与学习内容、学习者与教师以及 学习者与学习者之间的互动， 作为一个概念框架来理清远程教育中产生互动的不 同活动。事实上，学习者和学习内容之间的互动是所有教育活动的基础，因为教 学首先要考虑的就是为学习者提供有组织的学习内容。 增进学习者和学习内容之 间的互动对远程教育工作者尤其重要，而且极富挑战性，因为他们在组织学习内 容的时候必须充分考虑教学媒体所能发挥的作用4。 1.3.3 希尔曼等人的交互理论 1.3.3 希尔曼等人的交互理论 在穆尔交互分类的基础上，希尔曼、威利斯和冈纳瓦德那(Hillman Willis & Gunawardena 1994)建议将远程学习者与交流媒体的互动作为以上提到的三 种类型的互动的中介界面，提出了第四种类型的交互，即学习者与媒体界面的交 互。 学习者与学习内容、教师、其他学习者的交互于是就通过学习者与 Web 教 学软件的交互实现的。学习者与 Web 教学软件的交互与其他三种类型的交互的 关系如图 2-1 所示： 7 图 1-1 学习者与 Web 教学系统的交互和其它三种交互之间的关系 1.3.4 特里安德森扩展了的交互分类理论 1.3.4 特里安德森扩展了的交互分类理论 安德森与盖瑞森(Anderson&Garrison，1998)扩展了穆尔交互分类的划分类 型，增加了三种新的交互类型： 教师与教师间的交互。可以提高教师的专业水平，促进教师和同事们保持在 传统教育机构中的伙伴关系， 也激励教师不断更新自己的专业知识。 远程教育中， 一门课的教学通常不只是由一位教师完成的，而是由一个团队合作完成的，只有 各成员间的紧密合作才能完成一整门课从设计制作发送教学 反馈的全过程。因此在远程教育中对教师与教师的交互有更高的要求。 教师与学习内容的交互。在传统教学中，教师与教学内容的交互主要体现在 教师备课，用自己的方式将教材中的内容表达出来。在线学习的环境下，知识的 学习已经超出了教材的限制，教师与教学内容的交互也不在停留在备课上，而是 更多的体现在教师创建和更新学习内容和设计教学活动中。 教师必须不断的更新 自己的知识，才能满足学习者的需求。 学习内容间的交互。新技术条件下一种新型的教育交互形式。伴随着新兴技 术的产生和元数据标准的推广。学习内容(代理)可以自动在网络上搜索其它相关 的学习资源，不断的更新自己的内容，增加更多有效的信息。就像天气预报程序 可以搜索网上最新的天气消息，并从离它最近的服务器上下载新的天气消息一 样。我们可以将更多的事情交给代理去做，智能代理能让学习变得更方便的。 随着 IT 技术的成熟，网络越来越能满足我们的需求。我们不仅要自己开发 教学资源(课件、试题、软件等)，我们还需要利用别的教学系统的教学资源。为 8 了方便，我们要求能直接从别的教学系统或者其他地方抓取资源，于是还需要教 学资源的标准化等。学习者、教师、学习内容以及 Web 教学系统相互之间的关 系如图 2-2 所示： 图 1-2 学习者、教师、学习内容以及 Web 教学系统相互之间的交互关系 9 第第 2 章章 交互设计概念与相关理论交互设计概念与相关理论 2.1 交互设计的概念 根据工业设计师 Victor Papanek 的定义， 设计(design)是为构建有意义的秩序 而付出的有意识的直觉上的努力。但也有人这样理解： 理解用户的期望、需要、动机和上下文。 理解业务、技术和行业上的需求及限制。 将这些所知道的东西转化为对产品的规划(或者产品本身)，使得产品的形 式、内容和行为变得有用、能用，令人向往，并且在经济和技术上可行5。 我更认同第二个定义。这个定义可以适用于设计的所有领域，尽管不同领域 的关注点从形式、内容到行为上均有所不同。如果采用适当的方法，设计可以为 技术产品提供通常所缺少的人性关系。 交互设计(Interaction Design)是一门关注交互科学的新学科， 始于二十世纪八 十年代，由 IDEO 的一位创始人比尔莫格里奇在 1984 年一次设计会议上提出， 他一开始把它命名为“软面(soft face)”，由于这个名字容易让人联想起当时流行 的“椰菜娃娃(cabbage patch doll)”，他后来把它更名为“Interaction Design” 交互设计6。 从用户角度来说， 交互设计是一种如何让产品易用， 有效而让人愉悦的技术， 它致力于了解目标用户和他们的期望，了解用户在同产品交互时彼此的行为，了 解“人”本身的心理和行为特点，同时，还包括了解各种有效的交互方式，并对 他们进行增强和扩充。交互设计还涉及到多个学科，以及和多领域多背景人员的 沟通。 通过对产品的界面和行为进行交互设计， 让产品和他的使用者之间建立一种 有机关系，从而可以有效的达到使用者的目标，这就是交互设计的目的7。 对 Web 教学软件的交互设计来说，就是通过对 Web 教学软件的界面和行为进行 交互设计，让产品和学习者与教师建立一种有机关系，从而可以有效的达到教学 目标与学习目标。Web 教学软件的行为从深层次上来说，它体现的是学习者、 教师、学习内容以及 Web 教学系统相互之间的交互关系。 2.2 交互设计 VS 界面设计 有很多人会问，交互设计，不就是界面设计吗？尤其是在理解同软件产品的 交互时。人们在界面设计方面已经有了一定的关注，然而，交互设计更加注重产 品和使用者行为上的交互以及交互的过程。 10 界面是一个静态的词，当进行界面设计的时候，我们关心的是界面本身，界 面的组件，布局，风格，看它们是否能支撑有效的交互，但是，交互行为是界面 约束的源头，当产品的交互行为清清楚楚地定义出来时，对界面的要求也就更加 清楚了，界面上(如果存在可视界面的话)的组件是为交互行为服务的，它可以更 美，更抽象，更艺术化，但不可以为了任何理由破坏产品的交互行为8。 Cooper 说他更喜欢用交互设计一词，因为界面设计一词给人的印象是，一 些代码在这里，人在那里，而用户界面在两者之间传递信息。这意味着只有界面 才能回答用户的需要。界面设计只告诉人们如何打扮现有的行为(东西)，这就像 让匈奴人穿上西装一样。例如，对于数据报告工具，界面设计会从数据表去掉不 必要的外线框，整理凌乱的东西，用颜色强调重要数据，在点击数据项时提供丰 富的视觉反馈，等等。这比什么都不做要好，但是还远远不够。微软公司在界面 设计商投入数百万美元，但是微软的产品还是没得到人们的普遍喜爱。所以，用 界面设计一词很容易让人把设计推迟到编程之后，这时已经为时已晚2。 行为设计告诉软件的元素应该如何表现与交流。在上面的例子中，行为设计 告诉我们应该对数据表应用哪种工具，如何将平均数和合计数加入表中。交互设 计师应该从外向里工作，从用户想要达到的目标开始，兼顾技术的能力。 可以更加深入到我们称之为概念设计的设计。 概念设计首先要考虑什么才是 对用户有价值的。在上面这个例子中，概念设计告诉我们，用户阅览数据表只是 偶然的工作；用户的真正的目标是掌握数据走向。也就是说，用户可能根本不需 要什么数据报告工作，他需要的是数据走向报告工具。为用户提供强力而愉悦的 软件，交互设计师首先创建概念，然后考虑行为，最后考虑界面8。 2.3 交互设计的目标 VS 交互设计的任务 这里的目标是用户的目标。用户目标常常与我们猜测的不一样。例如，我们 可能会猜测一个会计的目标是高效的处理发票。这可能不是事实，有效的发票处 理更可能是会计雇主的目标。 会计的个人目标更可能是关心自己能否显得胜任本 职工作，以及在完成例行的重复任务同时保持这份工作。 如果你仔细研究当前大多数的 Web 站点及数字产品，你会发现它们的用户 界面经常无法满足用户目标并且不停地发出警告。反复的让用户觉得自己很笨， 导致用户犯更大的错误，降低用户速度，以至于用户不能完成足够的任务，导航 带来的不便让用户无法获得乐趣，且让用户感到厌烦。 目标不等于任务。目标是终结条件，相反，任务只是有助于达到目标的中间 步骤。目标激发人们去执行任务。不混淆任务和目标非常重要，但它们很容易搅 到一起。目标受人的动机驱使，很难随时间的推移而改变，甚至根本不变。任务 是短暂的，几乎完全基于身边的技术。 11 有人认为，将界面设计的容易学习应该始终是设计的一个目标。容易学习是 一个重要的指导原则，但在现实中，正如 Brenda Laurel(1990)所提到的，设计目 标实际上依赖于具体上下文谁是用户，他们在做什么，以及他们的目标是什 么。 2.4 流与透明性 当人们全身心地关注于某活动时，他们不会意识到外面的干扰。这种状态称 为流(flow)，由 Mihaly Csikszetmihalyi 首创的概念。Mihaly Csikszetmihalyi 是芝 加哥大学心理学教授及流：最佳体验的心理学一书的作者。 有人将流描述为“深入的，几近沉思的状态”。流经常产生“平静的欢娱”， 能够让你忘记时间的流逝。 尤其当你从事面向过程的任务时， 例如 “工程、 设计、 开发和写作”。我们应该创建促进和加强流的软件交互，而不是可能会打断或者 干扰流状态的软件交互。 如果程序不断的打断用户的流状态， 那么对于用户来说， 回到原来的生产率非常困难。 要创建流，我们与软件的交互必须成为透明的。换句话说，用户没有注意到 界面是可视的人工制品，相反，界面每时每刻服务用户，在恰当的时候和恰当的 地方向用户提供他恰当的服务。有很多使用户界面隐身的极佳方式，如下所示： 遵循用户心智模型。在用户的想象中，屏幕上显示的只不过是图片与文字而 已，他们不关心这些内容的底层实现是怎么样的，这就称为用户的心智模型，或 者概念模型。 引导， 但不要讨论。 很多开发人员认为理想的界面应该与用户进行双向交流。 然而，大多数用户不这么想。程序员很习惯看到一个警示框，但并不意味着用户 也希望这样。 没有人希望他要使用的机器来责备他。 软件经常把用户引到对话框， 指出我们的缺点，并且要求我们做出响应。从用户的角度看，软件颠倒了自己的 角色应该是用户提要求，软件来响应。 将工具放到顺手的地方。工具最好在工具栏和工具条上。这样，用户容易看 到，而且单件就可以进行选择。如果用户必须转移注意力去寻找工具，那么他对 应的专注就会受到干扰。这就像他必须从座位上起身，沿着走廊寻找铅笔一样。 他永远都不应该四处寻找工具。 提供无模态反馈。 当程序向用户提供信息或者反馈时， 可以有多种表达方式。 最常见的方式是在屏幕上弹出一个对话框，这种技术就是模态。他让程序处于一 种模式，在返回常态之前，也就是在用户能够继续任务之前，必须进行处理。通 常，通知用户更好的方式是无模态反馈。如果无论在什么时候，用户的信息主要 在主要界面中显示，而且不会停止系统的正常流程和交换，那么这种反馈就是无 模态的。在 Word2003 中，仅仅看屏幕底部的状态栏，你就可以无模态的发现你 12 在哪一页，哪一节，当前文档有多少页指针在什么位置。但是查看文档有多少字 却麻烦多了。 2.5 和谐 当用户与程序交互良好时，交互机制隐身，让用户直接面对自己的目标，意 识不到软件的介入。Webster 将和谐定义为“协调一致的组织”，这是一个合理 的短语，我们应该能从软件的交互中体会到。 对于很多事情来说，多比少好。然而在界面设计中，反过来才对。我们应该 不断减少界面元素的数目，但不降低系统的能力。为了实现该目的，我们必须用 更少的元素实现更多的目标。在这种情况下，和谐变得很重要。我们必须调整和 控制产品的所有功能，而不是让界面成为窗口的堆积，不是让界面上散布着很少 使用的，彼此之间没有联系的控件。 交互， 通常不必要以对话框的形式出现在用户界面中， 但这样的例子太多了。 出现这种情况的原因是程序面临选择。程序员倾向于把可能性和概率等同起来。 如果用户可以选择结束程序时保存或放弃他已经工作了 6 个小时的文档。 从数学 角度讲，两种选择都有可能，但反过来，用户放弃他们工作的概率可能小至千分 之一。 然而， 大多数程序都有询问用户是否想保存工作的对话框， 如图 1-3 所示。 图 2-3 中的对话框既不合适也不必要。 你选择放弃文档修改的概率是多少？ 弹出这个对话框就像你每次吃饭时别人都提醒你不要把汤洒在身上一样。 图 1-3 不必要的对话框 2.6 色彩学基本原理和色彩的心理效应 色彩是自然美、生活美和艺术美的重要组成部分。色彩设计是指遵循科学与 艺术的内在逻辑，对色彩进行富有鲜明创建性及理想化的过程，是理性与感性相 结合的创造过程。 从认知论的角度来看，色彩心理是人对客观世界的主管反映。色彩在传递信 息的同时，还可以有力的表达感情，能够隐性的对人们的情绪、精神和行动产生 一定程度的影响。因此，对色彩设计的研究更应该考虑到色彩与人的行为及心理 之间的关系。色彩的心理效应应具体体现在色彩的好恶、色彩的表情、色彩的联 想等几个方面9。 13 对于人来说，物体的颜色在视觉感受上往往留下“第一印象”，给人以先声 夺人的感觉，因为色比形更具有吸引力和感染力10。 如人们常常对不同的颜色赋予不同的意义， 把刺激强烈的红色与危险、 故障、 停止联系在一起；把舒适宁静的绿色与安全、正常、通行联系在一起；而把情况 有变化、提请注意与黄色联系在一起。因此，在进行用户界面设计时，必须与人 们所形成的这些概念相一致。另外，在进行用户界面的颜色设计时还应注意，整 屏颜色的数目不易过多，一般不应超过 5 至 7 个元素。 由于眼睛对蓝色最不敏感，特别是小区域蓝色最不易感知，所以蓝色不是适 用于文本、细线或较小面积的形状上。但用蓝色作背景色是比较理想的。 2.7 以用户为中心的界面设计 交互设计所提倡的以人为中心的设计，应该更多的用与现有的界面设计当 中。 以用户为中心的开发需要了解用户及用户的任务， 并使用这些信息指导设计。 众所周知，以用户为中心的设计，就应该了解用户的需求。这就需要我们研究不 同用户的性格爱好、生活习惯和价值取向。为儿童设计的界面就应该设计出丰富 的界面和情趣内容，来吸引儿童的目光。要设计出这样的界面，就需要我们研究 儿童在色彩上的偏好以及儿童所认为的流行趋势。还有在儿童界面设计中，需要 我们考虑到儿童的使用方式， 例如考虑触摸式的交互设计来满足儿童行动不灵活 的状态。同样为老年人设计的画面，需要简介明了的内容和好的使用向导，用少 的操作来满足更多的功能与查询，花哨的界面设计有些时候是不可取的。还有考 试系统的界面设计，就应当设计的相对简单并且符合学生日常答题的行为规范， 尽可能减少考生在电脑测试所带来的不适应。所以，一个出色的界面设计一定是 以用户为中心的设计，少了用户为中心的设计必然不是一个好的界面设计 11。以 用户为中心的交互设计中， 怎样才能更好的了解用户的需求？这就需要用户来参 与设计。为了确保整个开发过程都能充分考虑用户的需要，最好的办法就是让真 实的用户参与开发，这样开发人员就能更好的了解用户的需求和目标，最终的产 品就会更加成功。 14 第第 3 章章 教学系统交互设计案例研究教学系统交互设计案例研究 3.1 基于 Web 的教学系统交互设计基于 Web 的教学系统交互设计 3.1.1 基于 Web 的系统特征 3.1.1 基于 Web 的系统特征 基于 web 的系统有具有免下载安装、能够实时更新、覆盖面广、操作方法简 单等特征。 基于 web 的系统不需要下载安装文件， 只需要一个网络浏览器就可以访问使 用。任何时候任何地方，只要有网络，就可以访问 web 系统。由于不必下载安装 文件，所以基于 web 的系统基本不占用硬盘空间。 基于 web 的系统服务器端更新完毕，客户端就可以使用最新的版本，非常快 捷。 基于 web 的系统的控件有限，所以操作起来比较简单，只要是上过网的人都 可以胜任。 3.1.2 学习者特点与网络教学环境 3.1.2 学习者特点与网络教学环境 用于远程教学的网站在设计中考虑的是教师和学生， 而普通网站设计中考虑 的对象是普通的人。 在远程学习环境中，我们经常更多考虑的是技术。在考虑完硬件环境、学习 内容和教学计划之后才会考虑到学习者。 但是在远程学习系统中学习者才是决定 性的因素。在计划和实施远程学习经验的早期就需要考虑学习者。教师对学习者 理解的越多，远程学习经验对学习者来说越好12。 远程学习者的年龄范围很广， 已受教育水平不等， 有着各种各样的教育需求。 远程学习者的一个普遍特点是更加致力于学习。 虽然有一些人认为学习者之间的 差距不大，但成人带来了独具特色的远程学习环境。他们所拥有的是很多的关于 学习、生活以及职业的经验。相信成年人对课堂的贡献很小就是限制了成年人学 习者对任何学习环境的贡献。 但年轻的学习者向远程教育的教师提供了一个更有趣的挑战。 他们不一定是 自己选择参加一个在很远的地方的班级的， 而且往往没有考虑自己的动机或者作 为一个学习者自我激励的作用就进入了远程教育。此外，年轻的学习者对学习环 境带来了与信息导航有关的读写能力13。任何年龄段的学习者都有很多在课堂 15 内通过 Internet 查找资料的经验。年轻的学习者更容易在联网的环境中四处浏 览，因为他们没有耐心呆在教学环境中。 3.1.3 学习系统案例选择的依据 3.1.3 学习系统案例选择的依据 1、这些系统均是基于 web 的应用，与本文研究对象一致。 2、这些系统在国内外知名度比较高，大部分使用范围较广，具有一定的代 表性。 3、这些系统大部分是开源的，或是发放免费账户的，提供了良好的研究条 件。 4、这些系统大部分支持 windows 运行环境，以便于安装、测试和分析。 5、这些系统大部分都可以获得集成安装包，为研究它们减少了阻力。 3.2 Moodle 及其交互评价 3.2.1 Moodle 简介 3.2.1 Moodle 简介 Moodle 是澳大利亚教师 Martin Dougiamas 基于建构主义教育理论而开发 的课程管理系统， 是一个免费的开放源代码的软件， 目前在各国已广泛应用。 Moodle 这个词是 Modular Object-Oriented Dynamic Learning Environment ， 即模块化面向对象的动态学习环境的缩写。 是一个用来建设基于 Internet 的课 程和网站的软件包。 Moodle 平台依据社会建构主义的教学思想，即教育者(老 师)和学习者(学生)都是平等的主体，在教学活动中，他们相互协作，并根据自 己已有的经验共同建构知识。 Moodle 平台界面简单、精巧。使用者可以根据需要随时调整界面，增减内 容。课程列表显示了服务器上每门课程的描述，包括是否允许访客使用，访问者 可以对课程进行分类和搜索，按自己的需要学习课程。 Moodle 平台还具有兼容和易用性。可以几乎在任何支持 PHP 的平台上安 装，安装过程简单。只需要一个数据库(并且可以共享)。它具有全面的数据库抽 象层，几乎支持所有的主流数据库(除了初始表定义)。利用 Moodle ，现今主要 的媒体文件都可以进行传送，这使可以利用的资源极大丰富。在对媒体资源进行 编辑时，利用的是用所见即所得的编辑器，这使得使用者无需经过专业培 训， 就能掌握 Moodle 的基本操作与编辑。 Moodle 注重全面的安全性，所有的表单 都被检查，数据都被校验， cookie 是被加密的。用户注册时，通过电子邮件进 行首次登陆，且同一个邮件地址不能在同一门课程中进行重复注册，所有这些， 都使得 Moodle 的安全性得到了加强。目前，Moodle 项目仍然在不断的开发与 完善中。 16 3.2.2 Moodle 的交互特征 3.2.2 Moodle 的交互特征 像许多著名的学习管理系统一样，Moodle 可以管理内容元件，但是更针对 教育训练设计，另外，更加强了学习者的历程纪录，让老师们更能深入分析学生 的学习历程。 （一） 教师管理系统的界面基本分为三部分： 位置导航模块、 功能导航模块、 当前工作区。如图 3-1 所示： 图 3-1 教师管理系统界面 标号为 1 的部分是位置导航栏。它能很清楚地说明系统的层次结构，让用户 时刻对自己所处的位置有一个清楚的了解。 在这一栏的最右端， 是状态转换按钮， 点击它就可以打开“功能导航”编辑功能，包括：权限设置、是否隐藏、删除、 上移、右移等。 标号为 2 的部分是功能导航栏，它是管理员管理所有功能的一个索引。功能 导航栏是树状结构，点击父节点就可以显示或者隐藏子节点。这个功能导航栏分 类比较细，把细小的功能叶添加进来，这就导致用户必须时刻依赖它才能找到自 己想要的功能。 标号为 3 的部分是当前工作区，这里显示实际的设置，这才是管理员真正需 要的部分。在每个下拉框的下方都有很大一块区域显示这个下拉框的操作说明。 页面简洁，没有太多的装饰，不会分散用户的心思。 （二）学生学习的界面分为四部分：位置导航模块、左功能导航模块、当前 工作区域和右功能导航模块。如图 3-2 所示： 17 图 3-2 学生学习界面 标号为 1 的部分是位置导航栏，它能很清楚地说明系统的层次结构，让用户 时刻对自己所处的位置有一个清楚的了解。 标号为 2 的部分是左功能导航栏，这一部分又分为两种类型的功能导航：列 表形式的功能导航与概要形式的功能导航。 列表形式的功能导航是指把功能名称 加上链接以列表的形式显示出来； 概要形式的功能导航是指把功能的一部分重要 信息也一同显示出来，就像搜索功能的搜索文本框和搜索按钮。 标号为 3 的部分是课件内容显示区，按照时间的不同把课件分类。点击此区 域右边的小方框就可以把没有显示教学内容的区域都隐藏起来， 换成一个下拉列 表框，用户选择哪个时间段就显示哪个时间段的教学内容。 标号为 4 的部分是右功能导航栏。这里的全部都是概要形式的功能导航栏。 （三）帮助功能 Moodle 的帮助功能是笔者见过的所有系统中最好的。在每一个用户不容易 理解的地方，Moodle 设计人员都在该区域的后面添加一个帮助图标，用户点击 图标就可打开关于此控件、名词或者小功能的使用说明。使用说明以弹出窗口的 形式出现，在该弹出窗口的下方有“关闭窗口“按钮，用户阅读完帮助说明之后 就可以随手关掉。在使用说明窗口的最下方有“Index of all help files”链 接，用户点击之后就可以打开包含所有帮助的一个文件。具体如图 3-3 所示： 图 3-3-1 帮助功能 18 图 3-3-2 帮助功能 Moodle 的帮助功能告诉我们一个道理：用户喜欢随手拈来，但又不喜欢界 面变得凌乱。所以我们不仅要把用户需要的东西放在最方便的地方，而且也要统 一格式，不能让对用户对有帮助的东西产生恶感。 3.2.4 Moodle 交互评价 3.2.4 Moodle 交互评价 Moodle 为学生提供了可以自定义的界面，使系统显得更个人化。 学生和教师可以按照单元或者主题组织信息并把这些信息以相应的布局显 示界面上。学生和教师可以隐藏当前使用不到的信息，也可以展开所有信息，这 样设计的好处就是：不强迫用户接收用户不喜欢的信息，增加界面友好度。 有一部分信息以弹出窗口的方式显示，比如查看个人的信息、给别人发邮件 等，这些活动能够均是短暂的活动，与其它活动相比只是一个小插曲，所以，用 户在不希望改变当前活动状态的情况下发完邮件，然后返回到当前活动继续工 作。 笔者发现一个规律： 当用户从一个占用时间比较久的活动中跳出进行一个短 暂的活动时，他希望做完短暂的活动能够立刻回到原来的活动中，不希望做任何 额外的操作。 文档类型的文件均可以在线打开，在线浏览，避免了因为用户机器内没有按 照相应的文档阅读器而不能阅读下载的文档的情况。 19 3.3 Atutor 及其交互评价 3.3.1 Atutor 的简介 3.3.1 Atutor 的简介 Atutor 是加拿大的一个平台,是一个 LCMS 系统(Learning Content Management System),支持 SCORM,IMS 等,对于企业方面的应用是不错的，有比较 好的中文的汉化。 3.3.2 ATutor 的交互特征 3.3.2 ATutor 的交互特征 (一) 用空白分割多组控件，如图 3-4 所示： 图 3-4 用空白分割组件 标号为 1 的部分是当用户操作不当时系统给的反馈信息。 这些信息被直接显 示在了页面上，没有通过弹出提示窗口的方式显示。这是标准的非模态反馈。 标号为 2 的部分是教师创建课程时填写信息的区域。通过观察可以发现，这 些控件（页面元素）之间没有通过线或者格子隔开，但是用户绝对不会把这些信 息混淆。 笔者认为：空白是区分控件（页面元素）的最好方式，既不会因为横七竖八 的线分散用户的注意力，也不会污染页面，只需要使各组控件（页面元素）之间 的空白间隔一致并保持控件左对齐即可。 （二）松散的组织结构 查看了 atutor 的大部分页面，笔者发现这样一个问题：atutor 页面松散的 组织结构让用户把大部分精力消耗在了理解页面控件之间的关系上。 “松散的组 织结构”是指页面上本来具有联系的控件在位置上显得毫不相干，这样拉开的距 20 离把它们之间的联系也给扯的若有若无。 “松散的组织结构”给用户带来了理解 上的麻烦，同时使页面变得凌乱而不是轻松。图 3-5 详细解释了这个关系： 图 3-5 松散的组织结构 上图中标号为 1 的部分是功能分类导航栏，分为五类：Home、Forums、 Networking、Photo Gallery 以及 Manage。 标号为 2 的部分是位置导航栏，显示出三层：开始页、课程名、Home。看到 这里用户就开始疑惑：这个“位置导航栏”跟“功能分类导航栏”貌似没有多大 关系，为什么它俩在一个页面并且靠这么近？此时没有人能为用户解答。 标号为 3 的部分是概要形式的功能导航栏，在这一部分显示了 Networking 功能。看到这里，用户可能会产生疑问：这里的 Networking 功能跟标号 1 部分 的Networking有什么关系？是不是同一个功能？这个Networking词代表什么意 思？此时也没有人能为用户解答。 标号为 4 的部分可能与标号为 2 的部分（位置导航）相对应。但此时，这里 出现了 Forum、Networking 和 Photo Gallery 功能导航，这里的导航跟标号 1 部分的导航有什么关系？是包含还是并存？此时依旧没有人能为用户解答。 于是，用户带着满脑子的疑问晕乎乎的在界面上胡乱点击，直到厌烦了这种 没头绪的无效工作，他会直接关掉浏览器，再也不想登录这样一个教学系统。 笔者试着优化这个页面，他把标号为 1 的部分从页面上抹去，然后把位置导 航放到标号为 1 的位置，这样看起来轻松多了。 笔者认为： 设计者不应为了突出他们认为重要的一些功能而破坏掉整个页面 的逻辑关系。重要的功能应该受到特殊对待，但绝不是这种以牺牲整个页面逻辑 结构的代价而换取它们的突出显示。 3.3.3 Atutor 的交互评价 3.3.3 Atutor 的交互评价 Atutor 具有 Moodle 的一些特征，同时也具有 efront 的一些特征，俨然是 这两个系统的结合，但是很可惜，它没能很好地把它们融汇在一起。Atutor 把 不该放置在一起的信息堆在了一块，极大地影响了学生的学习。 21 ATutor 采用了 IMS/SCORM 发布规格，这使得系统中的内容可以在不同的电 子学习系统之间进行转换。 在其它的采用 IMS/SCORM 的系统中所编写的内容也可 以被引入 ATutor。 ATutor 是一个开源基于 Web 的学习管理系统(LCMS)。管理员在几分钟之内 就能够安装或更新 ATutor，为它更换一个新的皮肤(通过自定义模板 实现)。 ATutor 还提供一些扩展模块以便扩展其功能。教师可以快速对基于 Web 的教学 内容进行装配，打包和重新分配。也可以很方便地获取和导入预打包 好的内容 与管理他们的在线课程。学生在一个可调整的学习环境下学习。 3.4 eFront 及其交互评价 3.4.1 eFront 简介 3.4.1 eFront 简介 eFront 是一个易于使用的、具有视觉吸引力的、与 SCORM 兼容的电子学习 和人力资本开发系统。eFront 的目标是打造最漂亮的网络学习工具，在 eFront 中，可以构建自己的结构，实现在线测试、与其他人交流、监控用户的历史记录 和进步情况、实施调查、部署各种方案和创造各种证明等功能。 3.4.2 eFront 交互特征 3.4.2 eFront 交互特征 (一) 赋予学生的功能： Lessons 列表：参与到 lessons 的快捷方式 修改个人信息：包括头像，用户名，密码，名字，邮箱，使用的语言等 添加关联账户：让用户能方便地在多个账户之间切换，关联账户必须是已经 注册过的账户 查看参加的教学内容：包括 lessons 和 courses 以及进度 查看日历：按照今天/本周/本月/所有 分类查看任务 查看报告： 参与的 lessons 的进度/学生参与学习的信息/用户使用系统的信 息。可以导出为 excel 表格或者 pdf 文件 参与到论坛的讨论 站内信箱功能 聊天室功能：改变字体，邀请用户，导出聊天记录，新建聊天室，参与在线 即时讨论(类似于 qq 的讨论组) 查看在线用户 eFront 的首页布局如图 3-6 所示： 22 图 3-6 eFront 的学生看到的首页布局 标号为 1 的部分是用户的头像和名称，具体为图 3-7 所示： 图 3-7 用户头像 标号为 2 的部分是搜索框，具体为图 3-8 所示： 图 3-8 搜索框 标号为 3 的部分是功能导航，用户所能用到的功能分类基本都在这里，具体 为图 3-9 所示： 23 图 3-9 功能导航区域 标号为 4 的部分是主显示区域，包括位置导航栏和具体功能的具体操作，具 体如图 3-10 所示： 图 3-10 主显示区 学生在学习课件的过程中，可以查看添加过的书签列表，可以添加书签，做 笔记和评论， 查看课件信息， 查看课件的完成度， 打印课件的部分或者全部内容。 用树状结构把课件的内容组织起来并呈现给用户。 学生可以标记课件的每一个单 元的状态为“未完成”或者“已完成”。课件末尾会有一个小小的测验，根据测 验得分来判定是否通过了这个课件的学习。如图 3-11 所示： 24 图 3-11 学习课件图 图中标号为 1 的部分位置导航和部分操作功能条，具体如图 3-12 所示： 图 3-12 位置导航条和部分操作按钮 标号为 2 的部分是课件内容显示区域。 标号为 3 的部分是课件的组织结构，以树状形式显示。 25 标号为 4 的部分是已经完成的进度，具体显示如图 3-13 所示： 图 3-13 课件完成进度条 “Conditions completed：1 out of 2”意思是完成课件的两个条件中已经 有一个被完成了。 标号为 6 的部分是标记课件某一单元的状态的功能块，具体显示如图 3-14 所示： 标记前 标记后 图 3-14 单元状态转换 标号为 7 的部分是当前单元的笔记和评论列表，具体显示如图 3-15 所示：