基于藍(lán)墨云班課的翻轉(zhuǎn)課堂在網(wǎng)頁(yè)前端腳本制作課程中的應(yīng)用

陳良威

[摘 要] 隨著信息技術(shù)的發(fā)展，翻轉(zhuǎn)課堂被稱為提高教學(xué)效果行之有效的教學(xué)模式，以藍(lán)墨云班課移動(dòng)為教學(xué)平臺(tái)，在網(wǎng)頁(yè)前端腳本制作課程中開展翻轉(zhuǎn)課堂教學(xué)實(shí)踐，并給出了具體的操作過(guò)程和建議。

[關(guān) 鍵 詞] 藍(lán)墨云班課；翻轉(zhuǎn)課堂；網(wǎng)頁(yè)前端腳本制作

[中圖分類號(hào)] G712 [文獻(xiàn)標(biāo)志碼] A [文章編號(hào)] 2096-0603（2018）32-0030-02

當(dāng)前智能手機(jī)已經(jīng)成為人們?nèi)粘Ｉ钪械谋貍淦?，傳統(tǒng)課堂因?qū)W生重度依賴手機(jī)，課堂效率越來(lái)越低，如何因利勢(shì)導(dǎo)，把學(xué)生手中的手機(jī)變成課堂學(xué)習(xí)工具以滿足信息時(shí)代學(xué)生的需求，從而提高教學(xué)效果呢？藍(lán)墨云班課作為一款以互聯(lián)網(wǎng)為基礎(chǔ)的客戶端APP，將其應(yīng)用在教學(xué)活動(dòng)中，能夠幫助老師提高與學(xué)生的互動(dòng)率，從而正確引導(dǎo)學(xué)生將智能手機(jī)變成學(xué)習(xí)工具。而基于該平臺(tái)實(shí)施翻轉(zhuǎn)課堂能夠有效促進(jìn)教師的教和學(xué)生的學(xué)。筆者在網(wǎng)頁(yè)前端腳本制作課程使用藍(lán)墨云班課實(shí)現(xiàn)了翻轉(zhuǎn)課堂。

一、藍(lán)墨云班課平臺(tái)對(duì)翻轉(zhuǎn)課堂的支持

翻轉(zhuǎn)課堂實(shí)質(zhì)上是一種“以學(xué)生為中心”的教學(xué)模式，是一種翻轉(zhuǎn)了傳統(tǒng)教學(xué)結(jié)構(gòu)的創(chuàng)新教學(xué)方式，在這種模式下，學(xué)生的學(xué)習(xí)過(guò)程變成在家看老師的視頻講解，在課堂上老師指導(dǎo)完成作業(yè)，但是在實(shí)施過(guò)程中，也存在一些不足之處，如學(xué)習(xí)的空間只能在家或者是課堂，學(xué)習(xí)形式較為簡(jiǎn)單，學(xué)習(xí)的內(nèi)容也僅限于教師提供的視頻，教學(xué)資源較為單一；同時(shí)學(xué)生在自主學(xué)習(xí)過(guò)程中，由于不能實(shí)時(shí)監(jiān)督，對(duì)學(xué)生課程的完成情況和學(xué)習(xí)的質(zhì)量也不能進(jìn)行有效的檢驗(yàn)和評(píng)價(jià)。對(duì)此，借助藍(lán)墨云班課平臺(tái)，對(duì)翻轉(zhuǎn)課堂的學(xué)習(xí)模式進(jìn)行優(yōu)化。

教師在課前完成自學(xué)素材和自學(xué)任務(wù)的制作后，發(fā)布到藍(lán)墨云班課上，藍(lán)墨云班課發(fā)出通知提醒，學(xué)生就可以在移動(dòng)端或者PC端對(duì)課前任務(wù)進(jìn)行自主學(xué)習(xí)，同時(shí)教師在云班課上創(chuàng)建的課前測(cè)驗(yàn)，通過(guò)學(xué)生完成提交，測(cè)驗(yàn)結(jié)果能夠即時(shí)反饋到教師端，在解決了傳統(tǒng)測(cè)驗(yàn)占用課堂大量時(shí)間的問(wèn)題之外，也能夠協(xié)助教師對(duì)測(cè)驗(yàn)結(jié)果的掌控和分析。在課中，教師也能夠在指導(dǎo)學(xué)生完成任務(wù)的過(guò)程中，把傳統(tǒng)課堂上的提問(wèn)轉(zhuǎn)化為藍(lán)墨云班課中的搶答、投票、問(wèn)卷或者頭腦風(fēng)暴等活動(dòng)形式，學(xué)生參與的每項(xiàng)活動(dòng)，都能夠獲取一定的經(jīng)驗(yàn)值并納入期末的總評(píng)成績(jī)中，通過(guò)此種方式，在活躍課堂氣氛之外，更能使學(xué)生充分參與到問(wèn)題的討論中，幫助學(xué)生加深對(duì)教學(xué)重難點(diǎn)的理解。課后的作業(yè)評(píng)價(jià)，藍(lán)墨云班課提供了教師評(píng)價(jià)、指定學(xué)生評(píng)價(jià)和學(xué)生互評(píng)三種評(píng)價(jià)方式，教師可以根據(jù)作業(yè)的具體情況選擇一種評(píng)價(jià)方式，學(xué)生完成評(píng)價(jià)后獲得額外的經(jīng)驗(yàn)值計(jì)入期末總評(píng)；教師根據(jù)學(xué)生的考核結(jié)果及時(shí)督促學(xué)生，幫助教師達(dá)成教學(xué)目標(biāo)和實(shí)現(xiàn)教學(xué)效果。

二、基于藍(lán)墨云班課平臺(tái)的翻轉(zhuǎn)課堂教學(xué)模式設(shè)計(jì)

筆者以網(wǎng)頁(yè)前端腳本制作的“DIV+CSS布局網(wǎng)頁(yè)”模塊為例，說(shuō)明應(yīng)用藍(lán)墨云實(shí)現(xiàn)翻轉(zhuǎn)課堂的過(guò)程。

（一）課前設(shè)計(jì)和準(zhǔn)備學(xué)習(xí)資源與學(xué)習(xí)活動(dòng)

1.課前任務(wù)單

課前任務(wù)單的主要作用是幫助學(xué)生完成自主學(xué)習(xí)的一個(gè)重要資源，包括學(xué)習(xí)內(nèi)容結(jié)構(gòu)、學(xué)習(xí)方法、學(xué)習(xí)要求以及相應(yīng)的學(xué)習(xí)資源線索，這里筆者以思維導(dǎo)圖的形式設(shè)計(jì)課前任務(wù)單，幫助學(xué)生理清課前自主學(xué)習(xí)的思路。

“DIV+CSS布局網(wǎng)頁(yè)”的課前任務(wù)單又包含了學(xué)習(xí)目標(biāo)、自學(xué)素材清單、自學(xué)方法建議、自學(xué)任務(wù)等內(nèi)容。其中自學(xué)任務(wù)是要求學(xué)生根據(jù)微課視頻和自學(xué)課件對(duì)給定的“CSS學(xué)習(xí)互動(dòng)社區(qū)”網(wǎng)頁(yè)主頁(yè)樣圖，繪制出其布局草圖，為課中完成“運(yùn)用DIV+CSS盒模型完成網(wǎng)頁(yè)布局”的任務(wù)做好準(zhǔn)備。

2.課前微課視頻

制作“如何使用CSS樣式”“CSS盒子模型”“CSS布局模型”三個(gè)微課視頻，分別對(duì)應(yīng)“DIV+CSS布局網(wǎng)頁(yè)”內(nèi)容的重難點(diǎn)，要求學(xué)生結(jié)合視頻中的操作步驟和老師的講解模仿制作“盒子模型布局圖”，達(dá)到對(duì)重難點(diǎn)的明確和理解。

制作微課時(shí)，時(shí)長(zhǎng)應(yīng)盡量控制在5分鐘以內(nèi)，要求教學(xué)目標(biāo)明確，問(wèn)題單一簡(jiǎn)短，根據(jù)內(nèi)容的重、難點(diǎn)制作成若干個(gè)視頻上傳到藍(lán)墨云班課的資源庫(kù)中。如果受技術(shù)和時(shí)間的限制，也可以利用網(wǎng)絡(luò)資源，如網(wǎng)易云課堂、中國(guó)大學(xué)MOOC等在線學(xué)習(xí)網(wǎng)站，將當(dāng)中的在線視頻用鏈接的形式發(fā)布到藍(lán)墨云班課上。

3.課前測(cè)驗(yàn)活動(dòng)

通過(guò)藍(lán)墨云班課發(fā)布“DIV元素特性”“CSS語(yǔ)句含義”“DIV元素用途”等單選題和判斷題，讓學(xué)生在完成自學(xué)內(nèi)容后，幫助學(xué)生梳理問(wèn)題，加深對(duì)學(xué)習(xí)內(nèi)容的理解。

課前測(cè)驗(yàn)則是檢驗(yàn)學(xué)生在課前能否完成自主學(xué)習(xí)、課堂能不能翻轉(zhuǎn)的有效手段之一，根據(jù)教學(xué)內(nèi)容和教學(xué)目標(biāo)設(shè)計(jì)課前測(cè)驗(yàn)題目，上傳至藍(lán)墨云班課并由學(xué)生完成后，教師即可馬上檢查分析學(xué)生的完成情況，為教師提供教學(xué)依據(jù)，從而更有針對(duì)性地準(zhǔn)備課上活動(dòng)。

（二）課中活動(dòng)的開展

課前對(duì)新知識(shí)的基礎(chǔ)學(xué)習(xí)，則需要在課中通過(guò)課堂活動(dòng)和解決任務(wù)的形式促進(jìn)知識(shí)的內(nèi)化，這既是教師實(shí)施翻轉(zhuǎn)的重點(diǎn)也是難點(diǎn)。筆者在課程中借助藍(lán)墨云班課以任務(wù)為驅(qū)動(dòng)，在課中開展活動(dòng)。

1.任務(wù)準(zhǔn)備階段

活動(dòng)一：在任務(wù)準(zhǔn)備階段，教師可以通過(guò)藍(lán)墨云班課的隨機(jī)分組或線下分組功能，對(duì)全班學(xué)生進(jìn)行小組劃分，創(chuàng)建分組作業(yè)，以小組合作的形式對(duì)給定的“CSS學(xué)習(xí)互動(dòng)社區(qū)”網(wǎng)頁(yè)主頁(yè)樣圖繪制出其布局草圖，并指定在小組提交結(jié)果后以學(xué)生互評(píng)的形式對(duì)每個(gè)小組的作業(yè)進(jìn)行評(píng)價(jià)。

活動(dòng)二：教師在藍(lán)墨云班課的“答疑討論”區(qū)中設(shè)置了“如何使某個(gè)DIV向左浮動(dòng)”和“如何讓某個(gè)DIV內(nèi)部的內(nèi)容超過(guò)該DIV大小時(shí)產(chǎn)生滾動(dòng)條”兩個(gè)問(wèn)題，學(xué)生使用文本、圖片或語(yǔ)音的形式在答疑討論區(qū)發(fā)表評(píng)論，各抒己見，通過(guò)集體的智慧深入理解知識(shí)中的難點(diǎn)。

2.任務(wù)實(shí)施階段

活動(dòng)一：教師通過(guò)在課前制作的演示視頻，將其上傳到云班課，并發(fā)布小組作業(yè)，學(xué)生根據(jù)視頻的演示，完成網(wǎng)頁(yè)各部分的DIV定義并將代碼截圖進(jìn)行上傳至云班課，完成作業(yè)的提交。教師則可以在云班課中的課堂表現(xiàn)模塊，采用隨機(jī)選人的方式，隨機(jī)抽查若干名學(xué)生的作業(yè)，通過(guò)即時(shí)的抽查演示和點(diǎn)評(píng)的形式幫助學(xué)生梳理本課內(nèi)容的重點(diǎn)。

活動(dòng)二：根據(jù)頁(yè)面布局草圖和樣圖，在限定時(shí)間內(nèi)完成網(wǎng)頁(yè)的頁(yè)面設(shè)計(jì)制作，在此期間，由于涉及可以有多種方法完成頁(yè)面中的導(dǎo)航條，對(duì)此，筆者組織了頭腦風(fēng)暴讓學(xué)生列舉實(shí)現(xiàn)的方法，幫助學(xué)生進(jìn)一步加強(qiáng)對(duì)知識(shí)的掌握。

3.任務(wù)評(píng)價(jià)總結(jié)階段

活動(dòng)一：教師在答疑討論區(qū)中讓學(xué)生對(duì)本次課的學(xué)習(xí)進(jìn)行匯報(bào)，包括學(xué)習(xí)的知識(shí)、遇到的問(wèn)題和解決方法。通過(guò)這種方式引導(dǎo)學(xué)生完成對(duì)本次課學(xué)習(xí)內(nèi)容的梳理，同時(shí)教師將匯報(bào)進(jìn)行收集和總結(jié)，幫助教師調(diào)整教學(xué)計(jì)劃，真正實(shí)現(xiàn)以學(xué)生為中心，以學(xué)定教，提高教學(xué)效率。

活動(dòng)二：學(xué)生在完成任務(wù)之后，上傳作業(yè)，并對(duì)作業(yè)進(jìn)行學(xué)生互評(píng)，評(píng)價(jià)之后的經(jīng)驗(yàn)值結(jié)合課中各項(xiàng)活動(dòng)的經(jīng)驗(yàn)值，最后納入期末總評(píng)成績(jī)，學(xué)生通過(guò)這種方式對(duì)課堂學(xué)習(xí)的評(píng)定，令成績(jī)更加公平客觀，同時(shí)也大大減輕教師的工作量。

（三）課后知識(shí)的拓展

教師在課后通過(guò)作業(yè)活動(dòng)區(qū)發(fā)布完成“CSS學(xué)習(xí)互動(dòng)社區(qū)”課程選擇頁(yè)面的拓展案例，要求學(xué)生在限定時(shí)間內(nèi)完成該案例。在此期間，學(xué)生可以通過(guò)藍(lán)墨云班課平臺(tái)隨時(shí)向老師請(qǐng)教，或者利用智能手機(jī)在同學(xué)間進(jìn)行交流，最后，將作業(yè)提交到云平臺(tái)進(jìn)行評(píng)定，以此增加學(xué)生知識(shí)的廣度。

三、課堂教學(xué)效果的分析

筆者在課后使用藍(lán)墨云班課針對(duì)此種教學(xué)模式創(chuàng)建了“投票/問(wèn)卷”活動(dòng)，以此了解學(xué)生對(duì)該種模式下的課堂教學(xué)的認(rèn)可，本次活動(dòng)參與人數(shù)42人，有效問(wèn)卷40，占95%，問(wèn)卷調(diào)查結(jié)果如下表所示：

（一）提升學(xué)生的自主學(xué)習(xí)能力

學(xué)生可以根據(jù)學(xué)習(xí)需要，通過(guò)藍(lán)墨云班課獲取相應(yīng)的教學(xué)資源，尤其是一些操作類的微課視頻，學(xué)生可以反復(fù)觀看解決操作中的疑難點(diǎn)，不僅能有效地促進(jìn)學(xué)生的探究學(xué)習(xí)，更能打破學(xué)習(xí)空間和學(xué)習(xí)時(shí)間的束縛，以個(gè)性化的學(xué)習(xí)方式觸發(fā)學(xué)生的學(xué)習(xí)動(dòng)機(jī)。

（二）新穎的學(xué)習(xí)方式提高了學(xué)習(xí)興致

向來(lái)被明令禁止在課堂出現(xiàn)的手機(jī)，在基于藍(lán)墨云班課的翻轉(zhuǎn)課堂教學(xué)模式的課堂卻可以光明正大地出現(xiàn)，而且變成了學(xué)習(xí)工具，無(wú)疑觸動(dòng)了學(xué)生的好奇心，提高了學(xué)生學(xué)習(xí)的興致。

（三）提高了學(xué)習(xí)的有效性

藍(lán)墨云班課的經(jīng)驗(yàn)值和學(xué)習(xí)行為信息可以督促學(xué)生的學(xué)習(xí)進(jìn)度的完成、作業(yè)任務(wù)和答疑討論等課堂活動(dòng)的參與，在老師的監(jiān)控下，解決和提高了在翻轉(zhuǎn)課堂中利用智能手機(jī)進(jìn)行學(xué)習(xí)的有效性。

（四）改善、促進(jìn)了師生、生生間的交流

答疑討論區(qū)為學(xué)生提供了一個(gè)提問(wèn)題和發(fā)表觀點(diǎn)的平臺(tái)，在剛開始階段，學(xué)生礙于面子，只有老師解答，到了中后期，越來(lái)越多的學(xué)生參與進(jìn)來(lái)，互相幫助發(fā)表觀點(diǎn)和感想，克服傳統(tǒng)課堂上學(xué)生礙于面子、教師礙于授課時(shí)限所造成的生生、師生之間缺乏交流的問(wèn)題。

四、總結(jié)與反思

通過(guò)上述實(shí)踐，藍(lán)墨云班課基本上能夠滿足翻轉(zhuǎn)課堂的要求，其充分發(fā)揮了互聯(lián)網(wǎng)的優(yōu)勢(shì)，實(shí)現(xiàn)了教學(xué)資源跨區(qū)域傳送，加強(qiáng)了師生互動(dòng)，真正做到了“以學(xué)生為中心”。但同時(shí)也對(duì)我們教師提出了更高的要求：（1）“學(xué)生為中心”的教育模式，促使教師必須加快知識(shí)的更新；（2）教師在具備教學(xué)能力的基礎(chǔ)上，還需掌握信息技術(shù)的應(yīng)用；（3）知識(shí)的傳遞在課下，知識(shí)的內(nèi)化在課中，這就要求教師在教學(xué)設(shè)計(jì)上合理安排時(shí)間，豐富課堂活動(dòng)和有效控制課堂秩序。

參考文獻(xiàn)：

[1]蔣敦杰.翻轉(zhuǎn)課堂帶來(lái)的機(jī)遇與挑戰(zhàn)[J].基礎(chǔ)教育課程，2015（8）.

[2]蔡翔.也談“翻轉(zhuǎn)課堂”：“藍(lán)墨云班課”的使用感受[J].考試周刊，2016（73）：111.

[3]黎加厚.微課程教學(xué)法與翻轉(zhuǎn)課堂的中國(guó)本土化行動(dòng)[J].中國(guó)教育信息化，2014（7）：94-97.