SPOC环境下WEB标准网站设计课程翻转课堂教学模式研究

程淑玉

摘要：“WEB标准网站设计”课程内容对接前端开发工程师岗位，主要掌握利用DIV+CSS+JavaScript进行网站前端开发技能，在教学过程中引入企业的实际项目，采用传统的基于工作过程的项目式教学。但是存在知识点多且面广、课堂教学时间不够、学生学习主动性不高等问题。针对这些问题，我们提出了将翻转课堂教学模式引入课程教学中，通过基于SPOC环境下的微课程设计，构建SPOC环境下翻转课堂教学模式，取得了良好的效果。

关键词：WEB标准网站设计;SPOC环境;翻转课堂

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

文章编号：1009-3044（2019）15-0070-03

Abstract： “WEB Standard Website Design” courses content docking front-end development engineer positions， mainly master the skills of using DIV+CSS+JavaScript to develop website front-end，

Introducing the actual project of the enterprise into the teaching process and adopting the traditional project-based teaching based on the working process. However， there are many problems， such as many and a wide range of knowledge points， insufficient classroom teaching time， and low learning initiative of students. To solve these problems， we proposed to introduce the flipped classroom teaching mode into the course teaching. Through the micro-course design based on SPOC environment， we constructed the flipped classroom teaching mode in SPOC environment and achieved good results.

Key words： WEB Standard Website Design; SPOC environment; flipped classroom

SPOC创新了教学模式，是依托于MOOC平台，主要针对本校的学生开发的 “小规模限制性在线课程”。该课程是MOOC与传统校园相结合的产物[1]，在传统的MOOC课程基础上增加了师生面对面的课堂交流学习，降低了学生管理复杂度、通过教师全程的督学提高了课程完成率和学习效果。课程采用基于新信息技术的群组教学模式，以学生互相熟识的实体班级为基础的封闭式学习社区，设学习小组，利用团队方式学习。SPOC采用混合学习模式（On Campus +Off Campus），能有效地利用平台和信息技术促进线上学习、线下学习以及课前、课中和课后的有机融合。其中线上学习主要通过微视频，辅助动画、小案例以理论知识为主进行自主学习、探究学习，线下学习主要通过项目分析以实践技能训练和社交为主进行协作学习。该学习模式从本质上改变了传统课堂教学模式，随时、随地、随心情的个性化学习给学习者带了完全不同的学习体验。通过制定个性化的学习策略和师生多样化的交互方式能够有效地实现翻转课堂。

翻转课堂与传统课堂的区别体现在学生和教师的地位与角色的不同，在翻转课堂中，知识传授主要通过信息技术手段在课下完成，学生通过互联网、移动互联网使用笔记本、智能手机等设备观看微视频进行自主学习、自定学习时间、地点、学习进度，并就遇到的问题在社区里进行探讨学习，通过完成相关测试题检测自主学习的效果。课堂上重新建构学习流程，让学生作为课堂中的主人，教师作为整个教学活动组织者，以实操演练、答疑、讨论、经验分享等形式有效组织课堂，帮助学生完成学习任务，并进行总结评价。

1 课程定位

《WEB标准网站设计》课程是我院计算机应用技术专业一门重要专业核心课程，是校企合作开发课程，其目标是让学生掌握利用DIV+CSS+JavaScript进行网站前端开发的能力，使学生熟悉网站开发的整个流程，了解网站前端开发工程师的岗位能力要求。通过本课程的学习，要求学生掌握HTML5、CSS3、JavaScript代码编写能力，会利用HTML5+CSS3设计网站页面，利用JavaScript设计网页特效。

目前，该课程教学模式还是采用传统的基于工作过程的项目式教学，将一个完整网站项目的作为教学内容，按照企业网站开发流程分成HTML基础语言、CSS表现形式和JavaScript交互设计三个单元开展教学[2]，最后配以综合实训强化学生的岗位能力、强化前端开发基础技能。教学过程中学生分团队分阶段协同完成网站项目的开发任务，课程考核采用“课程设计+答辩”方式进行考核，按照企业岗位分团队分岗位进行课程设计并进行答辩汇报。

WEB标准网站设计课程改革提升了学生对前端职业岗位的认知，实现了团队成员根据各人知识特长进行不同岗位的职业能力提升，同时通过团队合作也提升了小组成员的沟通交流能力、项目协同开发能力、创新能力，但是在改革过程中也发现了以下的问题。

1） 由于网站项目涉及的知识点多且面广，如何选取合适的教学项目就显得很重要，选取的教学项目必须精炼、應用面广、包含了重难点。在教学过程中教师面临两难问题，一是一个项目从任务分解、知识点讲解到项目实践需要较长的时间，课堂时间较短，教师若在课堂上把理论知识讲解得非常透彻，必定无法在课堂上完成实际项目的开发，这样就会把任务的完成延伸到课下，课下学生的完成情况是无法监控的;二是课堂上教师主要讲解分析项目的重难点并指导学生动手操作，对于学习能力不同的学生，其知识的吸收与转化速度也不相同，很难做到有针对性地辅导，导致学生的学习效果相差很大。

2） 学生学习自主性不是很高，总是被动地去学习，课下很少去预习和复习巩固课堂上的知识点，导致实操中无法下手，对专业课程的学习很迷茫。

3）课堂上教学组织侧重在“教”与“学”，缺少互动，就算有互动环节也仅有几个学生能参与进来，大部分都处于游离的状态。

针对以上问题，我们采取了将翻转课堂教学模式融入课程教学中，开展了SPOC环境下WEB标准网站设计课程翻转课堂教学改革研究，获得了较好的效果。

2 基于SPOC的微课程设计

为了将翻转课堂教学模式与SPOC课程教学融为一体，我们设计了适用于SPOC平台和翻转课堂平台的《WEB标准网站设计》微课程教学内容体系，如图1所示。该教学内容体系设计包含课程基本信息设计、课程学习内容设计和交互活动设计。课程基本信息包含了课程标准、教学团队、学习者要求、考核评价方式等信息。课程内容设计分为线上内容和线下内容两部分，线上内容以小案例为主，依据“微目标”确定好短小精悍、直接切入核心教学点的学习内容，通过小模块呈现直接聚焦单一知识点，帮助学生突破重难点;线下内容以完整的项目为主，以3个完整的网站项目分别贯穿于基本教学、拓展练习和综合实训中，将项目按照知识点分解成不同的学习任务。交互活动设计应遵循学生在学习过程中认知结构设计合理的交互策略，包括教师在学生自学的过程中在SPOC平台中提出一些问题，引发大家的思考交流，选取优秀的学生作为助教，在平台上与大家互动，就平台中的大家提出的比较集中的问题进行答复，配以一些专题活动开展大讨论及翻转课堂中师生的交流互动，教师可以根据学习者在不同交互环境中的学习体验提供个性化的指导。

3 SPOC环境下翻转课堂教学模式的构建

实施翻转课堂教学设计前必须对整个课程教学活动进行重新设计，针对《WEB标准网站设计》课程实践性强的特点，以构建满足学生个性化学习需求和教师反思提升型教学活动为主，将该微课程的教学活动分成课前、课中、课下三个阶段[3]，如图2所示。

3.1 课前SPOC平台的教学活动设计

以学习者为中心，设计个性化学习策略，利用SPOC平台的课程资源开展教学活动，通过QQ、微信、邮箱等方式发布学习任务，让学生进入SPOC平台观看视频，进行自学探究，学生通过观看微课程视频、操练视频中的案例，完成对课程知识点的理解性记忆和练习;通过在线测试及时自我检查以了解知识点的掌握情况，对于学习过程中产生的问题通过在线交流平台与其他学习者进行交流获得解决问题的方法，教师在监学的同时可以进行答复指导，对于不能解决的问题课中在翻转课堂上由师生共同解决，从而使学习者完成知识传递的过程[3]。教师可以在课前通过平台的数据统计查看学生的视频观看情况、点击情况、测试完成结果，及时了解学生的学习状态，指导学生及时修改个性化学习策略。

3.2课中翻转课堂教学活动设计

课中翻转课堂上学生的学习行为是一个知识内化过程，以网站项目为载体，将学习者需要掌握的知识点重新课上课下进行整合。教师在教学活动开始之前通过查看SPOC平台的数据和纪录，了解学生自学探究过程中的学习情况及遇到的共性问题。在课堂上首先就共性问题开展讨论式学习，教师在解决问题的过程中不断刺激学生回忆课前自学的内容，梳理相关知识点，从而获得解决问题的方法。通过课堂提问的方式与学生互动交流，对重难点知识进行详细讲解。在这过程中教师要发挥主导作用，根据学生的特点进行个性化指导、引导并帮助学生改进学习策略。再完成了问题探究，理解了相关的基础知识后，引入项目，开展基于工作过程的教学设计，小组探究对项目进行任务分解，实施任务，共同完成项目的开发，教师在此阶段要注意学生实践能力的培养，通过“做中学”将已掌握的知识内化应用到实际项目中，加深学生对相关知识点的理解和迁移，进一步调动起学生自我学习、自我探索的能力。最后，教师根据学习者在学习过程中的表现对其进行以激励为主的个性化评价。

3.3 课后SPOC平台的教学活动设计

课后SPOC平台的教学活动包括学生课后完成课堂上教师布置的拓展练习任务，拓展练习任务是课堂任务的延伸，主要采用小组独立完成，完成后将作品分享到SPOC平台，由学生和老师一起点评，同时我们还配以技能大赛、综合实训、课程设计、前端面试题等多种形式去提升学生实践技能。

3.4 多元化评价

采用全过程考核评价方式，以学习者为中心开展多元化评价，包括课前SPOC平台的在线视频观看得分、在线测试得分、作业得分、访问得分、互动得分、任务点完成得分，这部分成绩可以通过平台后台数据分析统计得到，教师通过对这些数据的挖掘能够加深对学生学习状态的了解，及时给学生出谋划策，改善其学习策略，从而实现个性化学习;课中的任务完成情况得分（通过教师评价和自我评价完成）、课堂的表现得分（包括出勤情况和解答问题情况）;课后的任务拓展练习得分。通过对课前、课堂、课后成绩的对比分析确定每个模块的考核权重，确定课程评价办法为：课前成绩（20%）+课堂成绩（30%）+课后成绩（10%）+期末课程设计成绩（40%）。

4 效果分析

SPOC环境下WEB标准网站设计课程翻转课堂教学模式从构建、应用到不断完善，已经开展了 3个学期。 总体效果尚可，学生能够按照课程要求及时完成SPOC平台的在线学习内容和在线测试，参与线上讨论，其自学能力、自觉性得到很大的提升，通过反复观看视频，加深对知识点的理解，课堂上能够灵活地运用知识点去解决实际应用中的问题 。

4.1 学习满意度和总体评价

由于课下学生通过自学对每个任务的知识点有了一定的掌握，大大减少了教师课堂上对知识点的讲解时间，缩短了课程的总学时，总学时由改革前的120课时减到90課时。在课程结束后我们通过问卷调查了解学习者对课程的总体评价及对该教学模式的满意度，在满意度调查中，95%的学习者认为课前视频学习有效地提升了课堂项目实战能力，94%的学习者认为在线测试加强了对理论知识的认知，61%的学习者表明会经常反复观看微视频进行学习，70%的学习者认为课前的学习激发了他们对该课程的学习兴趣，80%的学习者认为课前学习、课后练习提高了他们的自主学习能力，也有30%的学习者认为课前学习难度大，很难坚持。

在课程的总体评价中，90% 的学习者认可这种“SPOC+翻转课堂的教学模式”，学习者平均每周在该课程的学习时间要比传统教学模式课程多6～8小时，不仅完成了课程本身的项目训练，同时还参加了“互联网+”创业创新比赛，提升了学生的创新能力[4]。这种强压式的学习任务占据了学习者大量的课外娱乐时间，教师的督学、学习者之间相互督促、交流不经意间促使其养成自主学习习惯，团队合作意识。最后的前端开发岗位工程师面试题让学生者对这个岗位有了更深刻的认识，为后面的知识积累打下铺垫。

4.2 存在的问题及改进

通过调查反馈，学习者对微视频的评价存在“视频中微案例选择合理，教学内容丰富，容易掌握，但是部分关键知识点比较晦涩难懂，通过观看视频讲解不是很容易理解，视频设计的不够美观、生动、不能激发学习的积极性”等客观评价。这主要是因為目前在线视频是录屏的，动画特效少，且在线学习要靠自学，没有师生面对面的交流过程，比较枯燥，在遇到问题时在线交流时如果没有找到解决的方法，很容易学不下去，失去学习的兴趣。在后续改革中，我们针对每个任务的关键知识重新设计了短小精湛的案例，采用案例驱动录制5～10分钟的教学视频，对于晦涩难懂的知识点精心设计了优美的教学动画嵌入到视频教学内容中，同时将视频中的图标、问题等都设计成交互性，同时从不同的方式和角度，设计贯穿教学全程的灵活、实用的交互活动，进一步激发学习者的学习动机。

5 结束语

新信息技术下“SPOC+翻转课堂”的教学模式，颠覆式创新了传统教学模式，重构了学习过程，实现了以学生群组自学为主，教师提供个性化教学辅导[5]。群组学习能够互相学习、教学相长，同时对教师的团队也提出了更高要求。教师不仅需要在专业技能上达到“高标准”，能娴熟驾驭各种课程主题、讨论内容，而且要具有信息化课程建设能力，能够利用信息化技术为个性化学习的开展设计更加精细的课程内容和学习活动[6]， 提供多样化、分层化的教学指导，真是实现个性化学习。

参考文献：

[1] 王欢.基于SPOC的“大学计算机”课程分级教学改革实践[J].中国管理信息化，2016（3）： 253-256.

[2] 王海霞.基于翻转课堂的项目式教学模式研究与实践[J].电脑知识与技术，2017（8）：134-136.

[3] 王朋娇，段婷婷，蔡宇南，等.基于SPOC的翻转课堂教学设计模式在开放大学中的应用研究[J].中国电化教育，2015（12）：79-86.

[4] 叶安胜，周晓清，鄢涛.基于SPOC的“C综合项目实战”教学模式探索与实践[J].实验室研究与探索，2016（6）：198-203.

[5]卜红艳.翻转课堂模式在大学语文教学中的应用——以《俄狄浦斯王》为例[J].兰州教育学院学报，2015（8）： 100-102.

[6] 特里·安德森，王志军.希望/冒险：大规模开放网络课程（MOOCs）与开放远程教育[J].中国电化教育，2014（1）：46-51.

【通联编辑：王力】