基于Flash技术的教学视频交互功能设计与开发*

汪存友，张雅琪

（山西师范大学教育技术与传媒学院，山西临汾041004）

基于Flash技术的教学视频交互功能设计与开发*

汪存友，张雅琪

（山西师范大学教育技术与传媒学院，山西临汾041004）

交互是形成学习结果的重要机制。针对目前教师个人录制的教学视频普遍缺少交互功能这一问题，文章借鉴课堂提问的方法，采用Flash视频技术，设计并开发了具有提问功能的教学视频，在单机版上实现了教学视频的交互功能，该功能具有较好的实用价值和推广价值。

教学视频；Flash技术；视频交互

目前，互联网主流平台上的教学视频交互性都比较简单，学习者仅能控制教学视频的播放速度。笔者认为，对播放的操控并不能等同于视频的交互，播放的操控主要是指学习者对视频播放器的控制，而视频交互是指学习者与视频中学习材料之间的交互。陈青在远程教育中将交互定义为：远程学习者与所有远程教育资源之间的相互交流与相互作用，其中包括远程学习者与学习材料、与学习支助组织(包括辅导教师、顾问、行政管理人员、机构设施等)之间的相互交流与相互作用。[3]目前互联网中的少数视频已具有学习者与学习材料之间的交互，如在网易公开课中的部分课程中，视频播放到某个时间点时，会自动弹出一个选择题，学习者回答该问题后，视频继续播放。利用提问的方式实现视频交互是一个比较好的方法。很多教师想实现视频交互的功能，但在互联网中没有能够实现该交互功能的免费平台，而像网易公开课、爱课程、MOOC等平台只接纳通过层层遴选、脱颖而出的优秀课程的教学视频，普通教师不能随便在这些平台中上传自己录制的视频，进而没有机会实现教学视频在线交互。而单机版教学视频成本低，可拷贝，能够无障碍顺畅播放，且不需依托平台来实现交互功能，非常利于教师个人在小范围内分享和传播自己的教学视频。本文旨在利用Flash技术实现单机版教学视频交互功能的设计与开发。

一、Flash视频技术及其优势

Flash软件本身可充分集成动画、声音、视频等基本元素，创造出许多精彩的动画效果，形象生动地表达抽象内容，使学生更容易接受知识。[4]Flash视频文件的扩展名是.flv，该格式的视频生成的文件极小，比同等容量的其他视频格式更清晰，更利于互联网传播与分享。不仅如此，视频导入到Flash的时间轴后，被分解为逐个静帧画面，再利用ActionScript脚本语言控制帧和视频流，可以实现视频交互功能。除此之外，flv格式的视频能够利用嵌入在浏览器中的Flash播放器进行无障碍播放，无需重新安装播放器，传播成本低。[5]

总之，Flash视频技术可集成文本、视频、动画等多种媒体形式，可利用编程进行界面和内容的交互设计和控制。相较于其他视频而言，Flash视频容量小、清晰度高，依托与浏览器兼容的Flash播放器，更利于互联网传播和分享。这些都是本文为何要选择Flash技术开发具有交互功能的教学视频的缘由。

二、设计思路

本文中的教学视频交互设计借鉴了课堂提问的基本流程和方法，并利用Flash视频技术实现具体的交互功能。课堂提问是在课堂教学过程中，根据教学目的、教学内容、学习者特征等因素，设计合适的问题，进行师生问答的一种教学方法。[6]良好的课堂提问不仅可以启发学生学习教学内容，检查学生掌握知识情况，还能培养学生的创造思维，调动学生的积极性，激发学生的兴趣。在教学视频中，我们可以采用课堂提问的基本方法，在适当的时间抛出问题，让学生思考，从而达到更好的学习效果。[7]值得注意的是，课堂提问是教师与学生面对面的交流过程，课堂提问的若干问题是教师根据学生的学习情况实时生成的。而在教学视频学习过程中，教师与学生的时空是分离的，教学视频中的问题必须预先设计和设置好。本文旨在介绍教学视频提问的技术实现。

教学视频交互功能的设计如下：首先，视频在播放到某合适的时间点时暂停，画面中出现“练一练”按钮；然后，学习者点击“练一练”按钮，视频弹出一个问题，这个问题与课程知识相关，主要是客观选择题，学习者通过选择自己认为对的选项，点击“提交”按钮，完成问题的作答；随后，教学视频给予反馈，反馈的内容主要包括学习者的回答正确与否以及相关的提示内容。比如，若回答正确就显示“恭喜”等字样，回答错误就给予额外的提示信息，比如与该知识相关的文本、本视频的学习区间或网页超链接等等。最后，视频回到问题弹出的时间点继续播放。本设计中每道题学习者只有两次回答问题的机会，目的是为了启发学生思考，更加深刻的理解知识，进而达到更好的学习效果。

三、制作核心步骤

本文设计的视频交互功能采用Flash Professional CS6软件实现。主要包括四个核心步骤：导入视频、制作弹出问题、制作交互效果和保存视频。

第一步：导入视频

近年来，东营市人大常委会高度重视预决算审查监督工作。2015年成立了专门的预算审查监督机构，先后出台了《东营市人大常委会关于加强市级预算决算审查监督的决定》《东营市人大常委会关于加强市本级部门预算审查监督的若干规定》等一系列制度性文件，建立健全预决算全过程监督机制。为进一步强化部门预算审查，夯实预算审查监督工作基础，自2016年开始，市人大常委会积极创新监督方式，把握关键环节，探索开展部门预算审查，实现了人大预算审查监督重点由总预算向部门预算的延伸。

启动Flash Professional CS6软件，在新建一栏选择“ActionScript 3.0”,菜单栏文件中选择导入-导入视频。

（1）“选择视频”窗口：点击文件路径后面的“浏览”，选中事先备好的flv格式的视频，然后选择“在SWF中嵌入FLV并在时间轴中播放”，再点击“下一步”。

（2）“嵌入”窗口：选择的符号类型是“嵌入的视频”，将其下面的“将实例放置在舞台上”、“如果需要，可扩展时间轴”、“包括音频”，全部选中。点击“下一步”。

（3）“完成视频导入”窗口：检查导入的视频是否正确，若正确，就点击“完成”。若不正确，则点击“上一步”，重新导入视频。

第二步：制作弹出问题

弹出问题的制作主要采用场景跳转的方式。

（1）场景1中的操作

在场景1新建图层2，找到要添加问题的那一帧，本次制作是在第2597帧。用文字工具在该帧添加文字“练一练”，并将该文字转换为按钮元件，命名为aaa。在该帧添加代码片段：

（2）在场景2中的操作

在“插入”菜单选择“场景”，新建场景2。

在场景2新建图层2，在图层2第一帧添加文字“返回”，并将该文字转换为按钮元件，命名为aa。在该帧添加代码片段∶第三步：制作交互问题

（1）在场景2中，图层1中添加影片剪辑元件，命名为“kaokaoni_mc”，双击进入kaokaoni_mc元件。在此元件图层1中第一帧添加代码片段：

}

在此元件中，新建图层2，在图层2第一帧，用文字工具书写“提交”，将其选中，右击选择“转换为元件”，选择“按钮”。将该元件命名为“tijiao2_btn”。在此元件中，新建图层3，在图层3第一帧添加代码片段：stop();

（2）用文字工具添加问题。

将该区域选中，右击转换为影片剪辑元件，命名为“lianxi2_mc”。双击进入该元件，在图层1第一帧，添加题干，在ABCD四个选项前面分别添加RadioButton，分别命名为C_2_1、C_2_2、C_2_3、C_2_4。

在该元件中新建图层2，在图层2第一帧添加代码片段：stop();

（3）新建影片剪辑元件，将其命名为check2_mc。双击进入该元件，在图层1第2帧，添加文字“请再仔细想一下，还有一次机会！”在图层1第3帧添加文字“恭喜！答对了！”在图层1第4帧添加文字“很遗憾，答错了！”并给予提示。

在该元件中新建图层2，在图层2的第1、2、3、4帧均添加代码片段：stop();

第四步：保存视频

用Ctrl+S保存视频，再用键盘上Ctrl+Enter导出视频，观看测试效果。

四、总结

教学视频可任意点播，自选起点，无序观看，反复视听，极大地满足了学习者的个性化需要。[8]视频交互技术改变了以往教学视频信息单向、线性流动的性质，弥补了视频学习的缺陷。本文采用Flash的视频技术，在单机版上实现了视频提问功能，增加了学习者与教学视频间的交互。但对于多项选择题和主观题的提问、提问的教学设计以及学生回答问题的数据统计等问题，本文尚未涉及，这也是后续研究中有待解决的问题。

[1]沈夏林,周跃良.论开放课程视频的学习交互设计[J].电化教育研究,2012(2).

[2]宋菲菲.学科背景与呈现交互性对动画多媒体学习成效影响的实验研究[D].大连：辽宁师范大学,2011.

[3]陈丽.远程教学中交互规律的研究现状述评[J].学术论坛,2004(1).

[4]马涛,朱印宏.视频网站修炼术——基于Flash的视频技术开发与应用[M].北京：电子工业出版社,2009.

[5]360百科.FLV格式[DB/OL].http://baike.so.com/ doc/5450553.html2003.

[6]孟宪凯,刘文甫,李涛.提问技能训练[M].天津：天津教育出版社,2010.

[7]刘显国.课堂提问艺术[M].北京:中国林业出版社,2004.

[8]黄立新.透析网络课程中教学视频的问题[J].电化教育研究,2006(3).

（编辑：鲁利瑞）

G434

：B

：1673-8454（2015）16-0085-03

山西师范大学校级教改项目（编号：SD2013JGXM-70）；山西师范大学教育科学研究基金项目（编号：YJ1301）。