張明 李曉冬

摘?要：線上線下混合實(shí)踐教學(xué)越來(lái)越受到各高校的重視。實(shí)踐教學(xué)網(wǎng)絡(luò)課件平臺(tái)，有別于通用教學(xué)平臺(tái)，需要對(duì)相關(guān)技術(shù)進(jìn)行深入研究。跨平臺(tái)的多媒體在線課件具有體驗(yàn)好、隨時(shí)隨地訪問等特點(diǎn)，教學(xué)課件發(fā)展的一個(gè)重要方向。本文研究了實(shí)踐教學(xué)網(wǎng)絡(luò)課件平臺(tái)相關(guān)技術(shù)，提出了一種基于B/S結(jié)構(gòu)的跨平臺(tái)方案，實(shí)現(xiàn)了實(shí)踐教學(xué)在線課件演示平臺(tái)。

關(guān)鍵詞：線上線下混合教學(xué);實(shí)踐教學(xué)課件;跨平臺(tái);TouchPDF

中圖分類號(hào)：TP311.5?文獻(xiàn)標(biāo)識(shí)碼：A

1 緒論

互聯(lián)網(wǎng)技術(shù)與智能終端的發(fā)展給傳統(tǒng)教學(xué)課件帶來(lái)巨大的沖擊。面對(duì)全新的學(xué)習(xí)平臺(tái)與方式，傳統(tǒng)課件已難于適應(yīng)新時(shí)代下教與學(xué)的需求。隨著信息技術(shù)的迅猛發(fā)展，不斷涌現(xiàn)的共享課程、網(wǎng)絡(luò)課程、慕課、微課等網(wǎng)絡(luò)教學(xué)的形式深受教師和學(xué)生的喜愛[1]。

2020年初，新冠肺炎疫情使得高校的大規(guī)模開展了線上教學(xué)的順利開展。廣大師生經(jīng)過(guò)初期的適應(yīng)后，能夠完成在線教學(xué)的任務(wù)安排。隨著各高校完成開學(xué)，教學(xué)任務(wù)逐步向線上線下混合教學(xué)以及線下教學(xué)過(guò)度。

在線上教學(xué)過(guò)程中，多媒體教學(xué)資源得到了大規(guī)模應(yīng)用，也暴露出不足。對(duì)實(shí)踐教學(xué)而言，從線上的“知識(shí)課堂”走向線下的“能力課堂”[2]是提高實(shí)操能力最重要的一環(huán)。在實(shí)踐教學(xué)中，由線上教學(xué)過(guò)渡到線下教學(xué)尚有很多不足需要完善，很多技術(shù)需要提高，教學(xué)課件就是其中之一。

2 通用平臺(tái)在實(shí)踐教學(xué)中的不足

通用的線上教學(xué)平臺(tái)能夠?qū)崿F(xiàn)線上教學(xué)許多基本功能，為疫情期間的線上教學(xué)的技術(shù)保障。疫情期間采用教師采用的通用教學(xué)平臺(tái)多為直播類的在線教學(xué)平臺(tái)，如釘釘課堂、騰訊課堂等。此類教學(xué)平臺(tái)提供的功能主要包括：教學(xué)直播、課堂回放、視頻播放、師生互動(dòng)（包括文字、語(yǔ)音、課堂測(cè)驗(yàn)、簽到等）。

關(guān)少華與范愛玲[3]分析了線上教與學(xué)存在的問題，提出疫情期間網(wǎng)絡(luò)授課存在過(guò)度講解，角色刻板等屏障。上述屏障的出現(xiàn)，不僅由傳統(tǒng)習(xí)慣引起，還由直播平臺(tái)的特性決定。此類平臺(tái)對(duì)實(shí)踐教學(xué)造成的教學(xué)屏障更加突出，主要表現(xiàn)在：

（1）直播教學(xué)過(guò)程中是教師為主動(dòng)方，而學(xué)生為被動(dòng)方。盡管擁有師生互動(dòng)的功能，但使用體驗(yàn)不佳。線上教學(xué)過(guò)程中，教師對(duì)師生互動(dòng)較為謹(jǐn)慎，學(xué)生參與度較低，無(wú)法滿足實(shí)踐類課程的以學(xué)生為主的教學(xué)要求。

（2）通用線上教學(xué)平臺(tái)所采用的教學(xué)課件為傳統(tǒng)課件，多以單機(jī)文檔為主，典型的文件格式包括Word、Powerpoint和PDF文檔等形式，其主要缺陷包括：多媒體表現(xiàn)較弱;分享方式較為落后;內(nèi)容散亂，功能不夠友好。

（3）教學(xué)平臺(tái)不統(tǒng)一，學(xué)生體驗(yàn)差。線上授課期間，教師選用的教學(xué)平臺(tái)不盡相同。經(jīng)作者調(diào)查發(fā)現(xiàn)，線上授課期間，學(xué)生至少需要安裝3種以上線上教學(xué)平臺(tái)的軟件，以及2種以上輔助教學(xué)平臺(tái)。軟件工具、教學(xué)資源繁雜，反而成為學(xué)生的負(fù)擔(dān)。

（4）線上教學(xué)與線下教學(xué)割裂，二者無(wú)法做到有機(jī)結(jié)合。對(duì)實(shí)踐教學(xué)而言，最終目標(biāo)還是從線上走向線下，以提高學(xué)生的實(shí)操能力為最終目標(biāo)。線下實(shí)操過(guò)程中，學(xué)生難免需要查看各種教學(xué)資源。散亂的教學(xué)資源會(huì)大大降低學(xué)生學(xué)習(xí)過(guò)程中的體驗(yàn)，影響到學(xué)習(xí)效果。

3 線上線下混合實(shí)踐教學(xué)課件平臺(tái)的技術(shù)選擇

針對(duì)實(shí)踐教學(xué)特點(diǎn)，在面對(duì)線上線下混合學(xué)習(xí)以及課內(nèi)課外教學(xué)活動(dòng)，網(wǎng)絡(luò)多媒體課件成為高校實(shí)踐類課程教學(xué)中的必選項(xiàng)之一。相比于傳統(tǒng)課件，在線的跨平臺(tái)多媒體課件資源更加方便快捷，學(xué)生可以隨時(shí)隨地進(jìn)行預(yù)習(xí)或復(fù)習(xí)，幫助學(xué)生快速消化吸收教學(xué)內(nèi)容[4]?？缙脚_(tái)的實(shí)踐類教學(xué)課件整合了各種多媒體資源，相比傳統(tǒng)課件更加生動(dòng)。此外，與通用教學(xué)平臺(tái)相比，內(nèi)容組織更加靈活，學(xué)生擁有更大的學(xué)習(xí)自主性，對(duì)提高教學(xué)效果有很大幫助。

3.1 系統(tǒng)架構(gòu)

C/S（Client/Server）和B/S（Brower/Server）實(shí)現(xiàn)在線課件的兩種基本框架。C/S結(jié)構(gòu)雖然在交互性、易用性等方面表現(xiàn)優(yōu)秀，但是為兼容性低、編程工作量大。因此，對(duì)于面向跨平臺(tái)教學(xué)課件，C/S架構(gòu)增加了建設(shè)成本。B/S架構(gòu)的優(yōu)點(diǎn)則是總體成本低、維護(hù)方便、分布性強(qiáng)、開發(fā)簡(jiǎn)單。隨著相關(guān)技術(shù)的成熟，B/S框架在交互性和易用性方面得到長(zhǎng)足的進(jìn)步。而B/S架構(gòu)在開發(fā)和維護(hù)方面的優(yōu)勢(shì)，是定制化實(shí)踐教學(xué)課件的不二選擇。

3.2 B/S相關(guān)技術(shù)

Ajax（Asynchronous Javascript And XML）是一種異步交互的Web應(yīng)用技術(shù)，使Web應(yīng)用的交互特性、反應(yīng)的速度、柔性邁向了更高、更新的層次[5]。jQuery是基于Ajax技術(shù)的輕量級(jí)框架，通過(guò)封裝實(shí)現(xiàn)Ajax的調(diào)用，使得Web開發(fā)更加簡(jiǎn)單、便捷。jQuery在兼容性、交互體驗(yàn)等方面有巨大的優(yōu)勢(shì)。鑒于jQuery的優(yōu)點(diǎn)，技術(shù)人員在jQuery的基礎(chǔ)上，針對(duì)不同的應(yīng)用場(chǎng)景編寫了大量的開源腳本庫(kù)，使得開發(fā)基于jQuery框架的在線課件平臺(tái)成為可能。

4 基于jQuery框架的在線課件

PDF（Portable Document Format）文檔Adobe Systems公司開發(fā)的跨平臺(tái)文件格式，使用了工業(yè)標(biāo)準(zhǔn)的壓縮算法，具有文件小、易于傳輸與儲(chǔ)存等特點(diǎn)。同時(shí)，PDF文件還支持包括圖片、超文本鏈接、聲音和動(dòng)態(tài)影像在內(nèi)的多種內(nèi)容。上述特點(diǎn)使得PDF格式成為在線課件存儲(chǔ)文本與圖片的首選文件格式。因此，本文所用在線課件的靜態(tài)內(nèi)容以PDF文檔為基礎(chǔ)，并配合音頻及實(shí)操視頻等多媒體內(nèi)容構(gòu)成。在線課件平臺(tái)的構(gòu)架如圖1所示，jQuery框架負(fù)責(zé)PDF文件的讀取與顯示、用戶操作的響應(yīng)以及音、視頻播放操作。

TouchPDF是基于JQuery的PDF文件查看器，不僅能夠在瀏覽器中顯示PDF文檔，而且支持滑動(dòng)與縮放等移動(dòng)端手勢(shì)。同時(shí)，TouchPDF還具有簡(jiǎn)單易用，瀏覽器兼容性好等特點(diǎn)。TouchPDF的基本操作如下所示：

$（function（）{

$（"#myPDF"）.pdf（{

source："./instrument/d_ch2.pdf"，

tabs：[{title："基本操作"，page：1，color："orange"}，

{title："測(cè)量操作"，page：10，color："blue"}，

{title："進(jìn)階操作"，page：20，color："green"}，

{title："練習(xí)"，page：32，color："red"}，]

}）;

}）;

其中，source屬性指定pdf文件的相對(duì)路徑;title屬性包含導(dǎo)航按鈕對(duì)應(yīng)的文字、頁(yè)碼以及顏色等信息。

課件的顯示界面如圖2所示。屏幕頂端為實(shí)操視頻導(dǎo)航欄，視頻導(dǎo)航欄下方為課件區(qū)。課件區(qū)的右上方為操作按鈕區(qū)，可以通過(guò)點(diǎn)擊對(duì)應(yīng)的按鈕進(jìn)行向前與向后翻頁(yè)操作。為支持移動(dòng)端設(shè)備，翻頁(yè)也支持滑動(dòng)操作，左右滑動(dòng)即可實(shí)現(xiàn)翻頁(yè)。此外，為了適應(yīng)移動(dòng)設(shè)備（手機(jī)與平板）的顯示需要，按鈕區(qū)還包括了放大和縮小的操作按鈕。課件區(qū)的左右兩側(cè)為章節(jié)導(dǎo)航按鈕，點(diǎn)擊相應(yīng)的內(nèi)容，即可跳轉(zhuǎn)到指定章節(jié)，免去了頻繁翻頁(yè)的操作。

5 結(jié)語(yǔ)

本文通過(guò)分析疫情期間的線上授課經(jīng)驗(yàn)與教訓(xùn)，提出了一種面向線上線下實(shí)踐教學(xué)的網(wǎng)絡(luò)版教學(xué)課件。本課件系統(tǒng)基于HTML與Ajax等瀏覽器技術(shù)實(shí)現(xiàn)跨平臺(tái)的在線多媒體課件展示技術(shù)。該系統(tǒng)經(jīng)過(guò)測(cè)試和使用，通過(guò)與傳統(tǒng)的課件相比，具有效率高、操作簡(jiǎn)單等優(yōu)點(diǎn)。因此，本文對(duì)于在線多媒體課件制作具有一定的價(jià)值和意義。未來(lái)，將進(jìn)一步利用云計(jì)算技術(shù)，對(duì)課件進(jìn)行優(yōu)化，提高網(wǎng)絡(luò)版課件的并發(fā)能力，為廣大師生提供更好的教學(xué)服務(wù)。

參考文獻(xiàn)：

[1]谷艷華，朱艷萍，楊得軍，等.用于網(wǎng)絡(luò)教學(xué)的虛擬仿真交互式課件研究[J].圖學(xué)學(xué)報(bào)，2016，37（04）：545-549.

[2]郭慶，海鶯，趙中華，等.打造線上線下大實(shí)踐平臺(tái)構(gòu)建創(chuàng)新創(chuàng)業(yè)教育新模式[J].實(shí)驗(yàn)技術(shù)與管理，2016，33（5）：4-6.

[3]關(guān)少化，范愛玲.線上教學(xué)的教與學(xué)屏障及其突破[J].北京教育（高教），2020，（05）：55-57.

[4]杜凡凡.多媒體課件在線制作及管理[D].華中師范大學(xué)，2019.

[5]潘杰，周傳生.基于jQuery框架的Web研究與實(shí)現(xiàn)[J].沈陽(yáng)師范大學(xué)學(xué)報(bào)（自然科學(xué)版），2015，33（01）：96-99.

基金項(xiàng)目：2018年度廣西高等教育本科教學(xué)改革工程項(xiàng)目（2018JGB184）

作者簡(jiǎn)介：張明（1979—），男，漢族，山東煙臺(tái)人，工學(xué)碩士，高級(jí)實(shí)驗(yàn)師，研究方向：電子電路;李曉冬（1980—），男，漢族，廣東東莞人，工學(xué)碩士，講師，研究方向：電子電路。