基于微信小程序的導(dǎo)學(xué)單線上學(xué)習(xí)平臺(tái)開(kāi)發(fā)研究

摘? 要：導(dǎo)學(xué)單在學(xué)生的預(yù)習(xí)中發(fā)揮著至關(guān)重要的作用，開(kāi)發(fā)導(dǎo)學(xué)單線上學(xué)習(xí)平臺(tái)，對(duì)激發(fā)學(xué)生的學(xué)習(xí)興趣，提高教學(xué)資源利用率和教學(xué)管理水平有著重要的意義。然而，當(dāng)前有很多的學(xué)習(xí)平臺(tái)功能復(fù)雜、操作繁瑣，缺乏導(dǎo)學(xué)單的針對(duì)性和快捷性，為此，文章從導(dǎo)學(xué)單線上學(xué)習(xí)平臺(tái)的現(xiàn)狀及背景分析出發(fā)，提出平臺(tái)開(kāi)發(fā)的技術(shù)假設(shè)及技術(shù)解決路徑，最終實(shí)現(xiàn)了導(dǎo)學(xué)單線上學(xué)習(xí)平臺(tái)的構(gòu)建，實(shí)現(xiàn)了平臺(tái)的“展示學(xué)習(xí)內(nèi)容、知識(shí)學(xué)習(xí)、學(xué)習(xí)準(zhǔn)備、成果上傳”功能。

關(guān)鍵詞：導(dǎo)學(xué)單；學(xué)習(xí)平臺(tái)；課堂質(zhì)效；小程序

中圖分類(lèi)號(hào)：TP311? 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：2096-4706（2023）01-0123-04

Research on the Development of Guided Learning Sheet Online Learning Platform Based on WeChat Applet

ZHANG Guangjun

（Jiangsu Taixing Secondary Specialized School， Taizhou? 225400， China）

Abstract： The guided learning sheet plays a vital role in students' preview. The development of the guided learning sheet online learning platform is of great significance to stimulate students' interest in learning， improve the utilization of teaching resources and the level of teaching management. However， there are many learning platforms with complex functions and complicated operations at present， lacking the pertinence and rapidity of the guided learning sheet. Therefore， this paper proposes the technical assumptions and technical solution path for platform development from the analysis of the current situation and background of the guided learning sheet online learning platform， and finally realizes the construction of the guided learning sheet online learning platform， realizing the platform's functions of “displaying learning content， knowledge learning， learning preparation， and uploading results”.

Keywords： guided learning sheet; learning platform; classroom quality and efficiency; applet

0? 引? 言

導(dǎo)學(xué)單是引導(dǎo)學(xué)生學(xué)習(xí)的重要工具，它通過(guò)引導(dǎo)學(xué)生進(jìn)行有意識(shí)的預(yù)習(xí)，形成閱讀、收集、整理的習(xí)慣，并以實(shí)踐促學(xué)習(xí)，以學(xué)習(xí)強(qiáng)實(shí)踐。學(xué)生在學(xué)習(xí)目標(biāo)的指引下，明確了自身的學(xué)習(xí)方向，達(dá)到事半功倍的效果?；谶@樣的認(rèn)識(shí)，我們將“自主性”學(xué)習(xí)和過(guò)程引導(dǎo)有機(jī)地結(jié)合起來(lái)，形成明確的課外學(xué)習(xí)目標(biāo)和實(shí)踐任務(wù)，從而提高學(xué)生的自主學(xué)習(xí)能力。事實(shí)上，很多導(dǎo)學(xué)單都是通過(guò)紙質(zhì)資料傳遞給學(xué)生，學(xué)生需翻閱書(shū)本，完成相關(guān)學(xué)習(xí)任務(wù)，這種學(xué)習(xí)方式，沒(méi)有充分利用現(xiàn)代信息技術(shù)的高效性和智能性，也不利于教師個(gè)性化教學(xué)的實(shí)施，因此，導(dǎo)學(xué)單線上學(xué)習(xí)平臺(tái)具有較大的需求空間。

1? 平臺(tái)開(kāi)發(fā)研究的現(xiàn)狀及背景

傳統(tǒng)導(dǎo)學(xué)單都是老師依據(jù)學(xué)生學(xué)情以紙質(zhì)版的形式下發(fā)給學(xué)生，紙質(zhì)導(dǎo)學(xué)單從教學(xué)資源開(kāi)發(fā)、制作、印制、下發(fā)到收集等環(huán)節(jié)占據(jù)教師很多的寶貴時(shí)間，而學(xué)生領(lǐng)取整理、翻閱學(xué)習(xí)、上交作業(yè)也是一個(gè)很耗時(shí)的過(guò)程。采用導(dǎo)學(xué)單教材可以避免上述問(wèn)題，但又不便于教師個(gè)性化教學(xué)的實(shí)施，雖然教學(xué)中可以采用很多軟件，但它們功能復(fù)雜、操作煩瑣，導(dǎo)致導(dǎo)學(xué)過(guò)程無(wú)法充分體現(xiàn)其教學(xué)目標(biāo)，所帶來(lái)的直接影響是導(dǎo)學(xué)主體的缺失，學(xué)習(xí)效率低下。因此，本文提出了導(dǎo)學(xué)單線上學(xué)習(xí)平臺(tái)的開(kāi)發(fā)與制作。

網(wǎng)絡(luò)導(dǎo)學(xué)單的功能主要體現(xiàn)在以下三個(gè)方面：

（1）讓學(xué)生對(duì)所學(xué)內(nèi)容有一個(gè)清晰的認(rèn)識(shí)。

（2）對(duì)學(xué)生進(jìn)行科學(xué)性的引導(dǎo)。利用網(wǎng)上教學(xué)導(dǎo)學(xué)表，實(shí)現(xiàn)了教學(xué)任務(wù)的合理編排和學(xué)生的問(wèn)卷調(diào)查。

（3）在線教學(xué)是一種以短片、語(yǔ)音為主的教學(xué)方式，它改變了傳統(tǒng)的教學(xué)模式，提高了課堂教學(xué)質(zhì)效；同時(shí)，網(wǎng)上指導(dǎo)能夠及時(shí)地對(duì)所收集的學(xué)生信息進(jìn)行反饋，提高了評(píng)價(jià)工作的效率。

2? 平臺(tái)開(kāi)發(fā)的技術(shù)難點(diǎn)及解決路徑

基于導(dǎo)學(xué)單的作用，有效地提高學(xué)習(xí)效率及應(yīng)用效率，實(shí)現(xiàn)即學(xué)即用的目標(biāo)，這就要求開(kāi)發(fā)者在平臺(tái)開(kāi)發(fā)、時(shí)間設(shè)置及學(xué)習(xí)評(píng)價(jià)上進(jìn)行合理的設(shè)置。主要有以下三個(gè)難點(diǎn)需要突破。

2.1? 開(kāi)發(fā)平臺(tái)的選取

微信小程序具有泛在學(xué)習(xí)的特點(diǎn)，讓學(xué)生想學(xué)就學(xué)，隨時(shí)隨地可學(xué)，這是一種新型的學(xué)習(xí)手段，學(xué)習(xí)不再受時(shí)間和空間的限制。同時(shí)，微信小程序全新的學(xué)習(xí)方式，有效地提高了學(xué)生的學(xué)習(xí)興趣，有利于發(fā)揮學(xué)生的主觀能動(dòng)性，營(yíng)造個(gè)性化的學(xué)習(xí)氛圍。微信小程序還具有云數(shù)據(jù)庫(kù)即數(shù)據(jù)后臺(tái)服務(wù)系統(tǒng)，可以搭建教學(xué)信息庫(kù)，輕松實(shí)現(xiàn)信息資源的調(diào)用。因此，本平臺(tái)采用微信開(kāi)發(fā)者工具開(kāi)發(fā)制作，直接在微信小程序端打開(kāi)即可使用。

2.2? 自動(dòng)設(shè)置學(xué)習(xí)內(nèi)容

由于微信小程序位于后臺(tái)云數(shù)據(jù)庫(kù)，因此，在進(jìn)行軟件制作時(shí)，可以在后臺(tái)云數(shù)據(jù)庫(kù)中設(shè)置學(xué)習(xí)資源的時(shí)間節(jié)點(diǎn)，在前端顯示時(shí)，只需調(diào)用時(shí)間節(jié)點(diǎn)查找相應(yīng)教學(xué)資源庫(kù)即可。這樣，學(xué)習(xí)者只需在微信小程序界面打開(kāi)，即可以直奔今日學(xué)習(xí)內(nèi)容。

2.3? 學(xué)習(xí)成果上傳

認(rèn)同理論認(rèn)為，練習(xí)過(guò)程需要認(rèn)同，認(rèn)同對(duì)個(gè)體有非常顯著的影響。學(xué)習(xí)者究竟學(xué)到什么程度，需要進(jìn)行信息采集并將采集結(jié)果提供給教師或其他學(xué)生予以鑒別。學(xué)習(xí)者可以通過(guò)上傳一段話(huà)、一張圖片、一個(gè)視頻等形式來(lái)展示自己的學(xué)習(xí)成果，這就需要有一個(gè)程序提供學(xué)習(xí)成果上傳功能。在小程序開(kāi)發(fā)中，可以通過(guò)圖片及視頻文件上傳指令將文件上傳到云數(shù)據(jù)庫(kù)，以此實(shí)現(xiàn)這一目的。需要查看時(shí)，可以通過(guò)指令讀取云數(shù)據(jù)庫(kù)，查詢(xún)數(shù)據(jù)并在前端進(jìn)行顯示。

3? 平臺(tái)開(kāi)發(fā)技術(shù)的實(shí)施路徑

3.1? 平臺(tái)整體功能的開(kāi)發(fā)

依據(jù)導(dǎo)學(xué)單的內(nèi)容，平臺(tái)功能包括學(xué)習(xí)引導(dǎo)（學(xué)習(xí)目標(biāo)及學(xué)習(xí)主要內(nèi)容展示）、視頻學(xué)習(xí)、分組安排及成果制作、成果上傳四個(gè)主要功能。在微信開(kāi)發(fā)者工具中，可以通過(guò)小程序開(kāi)發(fā)功能“全局配置”中的app.json文件，設(shè)置四個(gè)功能頁(yè)面文件的路徑、窗口表現(xiàn)、tab等（見(jiàn)下方“tabBar”程序設(shè)置示例）；同時(shí)在app.json文件中設(shè)置好各個(gè)頁(yè)面page（見(jiàn)下方“pages”程序設(shè)置示例）。這種設(shè)置的開(kāi)發(fā)技術(shù)并不復(fù)雜，開(kāi)發(fā)者只需按照開(kāi)發(fā)模版復(fù)制程序代碼即可，最終在平臺(tái)下方形成“首頁(yè)、學(xué)習(xí)、查看、成果”導(dǎo)航欄，點(diǎn)擊各名稱(chēng)或圖標(biāo)即可實(shí)現(xiàn)頁(yè)面間跳轉(zhuǎn)。核心代碼如下：

"tabBar"： {

"selectedColor"："#7CCD7C"，

"list"： [

{

"selectedIconPath"： "images/zhuye1.jpg"，

"iconPath"： "images/zhuye2.jpg"，

"pagePath"： "pages/index/index"，

"text"： "目標(biāo)"

}，…

"pages"： [

"pages/index/index" ，

"pages/index1/index1" ，

"pages/index2/index2" ，

"pages/index3/index3" ，

"pages/index4/index4"，

"pages/index5/index5"

]，

3.2? 學(xué)習(xí)要求（首頁(yè)）界面的開(kāi)發(fā)

3.2.1? 學(xué)習(xí)目標(biāo)及內(nèi)容的設(shè)置

線上學(xué)習(xí)內(nèi)容的意義在于預(yù)習(xí)及復(fù)習(xí)鞏固知識(shí)。混合式教學(xué)更提倡課前預(yù)習(xí)及學(xué)習(xí)單的重要性，因此，構(gòu)建課前預(yù)習(xí)線上學(xué)習(xí)平臺(tái)更符合平臺(tái)開(kāi)發(fā)的目標(biāo)。在本平臺(tái)的開(kāi)發(fā)中，既要展示學(xué)習(xí)的內(nèi)容，又要系統(tǒng)提示學(xué)習(xí)的章節(jié)，讓學(xué)習(xí)者對(duì)知識(shí)結(jié)構(gòu)的脈絡(luò)有一個(gè)清晰的認(rèn)識(shí)。

在后臺(tái)的建設(shè)中，必須提供學(xué)習(xí)視頻，落實(shí)學(xué)習(xí)目標(biāo)、學(xué)習(xí)內(nèi)容（包含章節(jié)），同時(shí)提供學(xué)習(xí)效果評(píng)測(cè)等功能，可在微信內(nèi)容管理CMS數(shù)據(jù)庫(kù)平臺(tái)后端設(shè)置學(xué)習(xí)內(nèi)容。為了讓學(xué)習(xí)者迅速進(jìn)入學(xué)習(xí)內(nèi)容界面，采用學(xué)習(xí)日期設(shè)置是較好的思路。因此，在制作學(xué)習(xí)平臺(tái)內(nèi)容模型時(shí)，可增設(shè)學(xué)習(xí)日期這一數(shù)據(jù)項(xiàng)，日期項(xiàng)的格式為時(shí)間存儲(chǔ)格式，如圖1所示。在實(shí)際的學(xué)習(xí)展示中，可通過(guò)變更學(xué)習(xí)日期，下發(fā)學(xué)習(xí)內(nèi)容的方式，保證學(xué)習(xí)平臺(tái)應(yīng)用的廣度及持續(xù)性，既可用于不同班級(jí)不同時(shí)段的預(yù)習(xí)，又方便下一年級(jí)學(xué)生的繼續(xù)應(yīng)用，如圖2所示。

3.2.2? 學(xué)習(xí)目標(biāo)及內(nèi)容的展示

學(xué)習(xí)內(nèi)容展示需要進(jìn)行數(shù)據(jù)庫(kù)調(diào)用并在手機(jī)前端展示，開(kāi)發(fā)者可在微信開(kāi)發(fā)者工具wxml中進(jìn)行界面內(nèi)容設(shè)計(jì)，在wxss中實(shí)施樣式設(shè)計(jì)，在js中實(shí)施交互設(shè)計(jì)。界面內(nèi)容及樣式設(shè)計(jì)不太復(fù)雜，也有很多的參考樣式，js交互設(shè)計(jì)要考慮的實(shí)施內(nèi)容有：如何迅速展示今日學(xué)習(xí)內(nèi)容；當(dāng)今日無(wú)學(xué)習(xí)內(nèi)容時(shí)如何展示；當(dāng)要回看學(xué)習(xí)內(nèi)容時(shí)如何展示。針對(duì)以上問(wèn)題，在界面設(shè)計(jì)中，要增加“今日學(xué)習(xí)”“學(xué)習(xí)回看”切換按鈕，在交互設(shè)計(jì)中，要根據(jù)切換按鈕后取得的后臺(tái)數(shù)據(jù)“學(xué)習(xí)日期”進(jìn)行前臺(tái)呈現(xiàn)展示內(nèi)容，當(dāng)讀取“學(xué)習(xí)日期”不存在時(shí)，前端學(xué)習(xí)內(nèi)容呈現(xiàn)空白，如圖3所示，當(dāng)讀取到“學(xué)習(xí)日期”值時(shí)，根據(jù)具體學(xué)習(xí)日期數(shù)據(jù)進(jìn)行檢索呈現(xiàn)，如圖4所示。

3.2.3? 學(xué)習(xí)目標(biāo)及內(nèi)容數(shù)據(jù)調(diào)用

采用微信云開(kāi)發(fā)函數(shù)實(shí)施數(shù)據(jù)庫(kù)調(diào)用，為了迅速準(zhǔn)確呈現(xiàn)今日學(xué)習(xí)內(nèi)容，必須應(yīng)用“當(dāng)日日期”作為云開(kāi)發(fā)函數(shù)入?yún)?shù)據(jù)，因此，“當(dāng)日日期”的數(shù)值換算及格式轉(zhuǎn)換就成為首要考慮的問(wèn)題，交互程序示例如下：

var timestamp = Date.parse（new Date））;

var date = new Date（timestamp）;

console.log（new Date（timestamp））

//獲取年份

var Y =date.getFullYear（）;

//獲取月份

var M = （date.getMonth（） + 1 < 10 ？ '0' + （date.getMonth（） + 1） ： date.getMonth（） + 1）;

//獲取當(dāng)日日期

var D = date.getDate（） < 10 ？ '0' + date.getDate（） ： date.getDate（）;

console.log（"當(dāng)前時(shí)間：" + Y + '-'? + M+ '-' + D）;

this.setData（{

date： Y + '-'? + M+ '-' + D

}）

console.log（this.data.date）

var repTime = this.data.date.replace（/-/g， '/'）;

var timeTamp = Date.parse（repTime）;

有了當(dāng)日時(shí)間，再采用云函數(shù)實(shí)施調(diào)用，并實(shí)施數(shù)據(jù)展示即可，交互程序示例如下：

wx.cloud.database（）.collection（'JXJCXXPT'）

.where（{

date：timeTamp

}）

.get（）

.then（res => {? …

3.2.4? 學(xué)習(xí)目標(biāo)及內(nèi)容數(shù)據(jù)切換

學(xué)習(xí)目標(biāo)及內(nèi)容數(shù)據(jù)調(diào)用中，采用“學(xué)習(xí)回看”和“今日學(xué)習(xí)”按鈕實(shí)施回看，如圖5所示，點(diǎn)擊“學(xué)習(xí)回看”按鈕，進(jìn)入學(xué)習(xí)章節(jié)及內(nèi)容選擇，如圖6所示，選擇不同章節(jié)，即可實(shí)現(xiàn)學(xué)習(xí)內(nèi)容回看。章節(jié)選擇頁(yè)提供了章、節(jié)、學(xué)習(xí)日期三項(xiàng)內(nèi)容，便于學(xué)生系統(tǒng)地查看學(xué)習(xí)知識(shí)框架。如若想回到今日學(xué)習(xí)內(nèi)容，點(diǎn)擊“今日學(xué)習(xí)”按鈕即可。

章節(jié)選擇內(nèi)容展示，也是通過(guò)微信云函數(shù)的方式從后臺(tái)數(shù)據(jù)庫(kù)中以聚合方式調(diào)用數(shù)據(jù)，并在前端采用wx：for循環(huán)展示，其js交互中采用limit及get指令實(shí)施調(diào)用，交互程序示例如下：

wx.cloud.database（）.collection（'JXJCXXPT'）.limit（50）

.get（）.then（res => { …

為了實(shí)現(xiàn)學(xué)習(xí)回看功能，在wx：for循環(huán)中綁定事件處理函數(shù)，當(dāng)學(xué)生點(diǎn)擊各章節(jié)內(nèi)容時(shí)，綁定事件處理函數(shù)將對(duì)應(yīng)的學(xué)習(xí)日期賦值給一個(gè)全局變量并實(shí)施界面跳轉(zhuǎn)，交互程序示例如下：

tiaozhuan（e）{

console.log（e.currentTarget.dataset.lindex）

app.globalData.date=e.currentTarget.dataset.lindex //賦值給全局變量

console.log（app.globalData.date）

// wx.setStorageSync（"xxcs"，e.currentTarget.dataset.lindex）

wx.switchTab（{ //界面跳轉(zhuǎn)

url： '/pages/index/index'，

}）

}

界面跳轉(zhuǎn)后采用onshow實(shí)施延遲再次讀取數(shù)據(jù)庫(kù)，實(shí)現(xiàn)前端展示。

onShow： function （） { //onshow實(shí)現(xiàn)延遲

this.setData（{

date： app.globalData.date //讀取全局變量到本頁(yè)數(shù)據(jù)

}）

console.log（this.data.date）

if（

app.globalData.date>0

）{

wx.cloud.database（）.collection（'JXJCXXPT'）//讀取日期對(duì)應(yīng)數(shù)據(jù)值

.where（{

date：app.globalData.date

}）

.get（）

.then（res => {

3.3? 學(xué)習(xí)界面的開(kāi)發(fā)

學(xué)習(xí)界面主要采用視頻學(xué)習(xí)方式，通過(guò)微信平臺(tái)提供的視頻組件來(lái)構(gòu)建界面，通過(guò)后臺(tái)讀取“對(duì)應(yīng)日期”的視頻實(shí)現(xiàn)學(xué)生的學(xué)習(xí)。在視頻下方有發(fā)布彈幕功能，用以提高學(xué)生的學(xué)習(xí)參與性，如圖7所示。

3.4? 準(zhǔn)備界面的開(kāi)發(fā)

準(zhǔn)備界面主要是為課堂教學(xué)服務(wù)而設(shè)立的，實(shí)施團(tuán)隊(duì)協(xié)作完成學(xué)習(xí)目標(biāo)制作。分組安排也是通過(guò)后臺(tái)讀取“對(duì)應(yīng)日期”的分組內(nèi)容并在前端進(jìn)行展示，如圖8所示。學(xué)習(xí)者可根據(jù)分組內(nèi)容，依據(jù)視頻學(xué)習(xí)知識(shí)，選擇適合自身的展示方式進(jìn)行學(xué)習(xí)內(nèi)容重構(gòu)，在課堂教學(xué)時(shí)予以展示，提升學(xué)生的學(xué)習(xí)主體性，提高課堂質(zhì)效。

3.5? 學(xué)習(xí)成果界面的開(kāi)發(fā)

學(xué)習(xí)成果界面主要是實(shí)現(xiàn)學(xué)生學(xué)習(xí)成果圖片、視頻、文件等的上傳、查看及刪除，如圖9所示，這一部分的JS設(shè)計(jì)網(wǎng)絡(luò)有很多的開(kāi)發(fā)程序案例，在這里不做贅述。

4? 結(jié)? 論

個(gè)性化小程序的開(kāi)發(fā)能夠體現(xiàn)不同的場(chǎng)景需求，教育的場(chǎng)景需求是多樣的，需要開(kāi)發(fā)者依據(jù)教育特征及規(guī)律實(shí)施學(xué)習(xí)平臺(tái)的設(shè)計(jì)與開(kāi)發(fā)。本文主要是對(duì)導(dǎo)學(xué)單線上學(xué)習(xí)平臺(tái)的特征、主要功能及核心開(kāi)發(fā)技術(shù)進(jìn)行了解析，希望能為相關(guān)研究者提供一定的參考。

參考文獻(xiàn)：

[1] 陳思帆.基于微信公眾平臺(tái)的移動(dòng)教學(xué)設(shè)計(jì)研究——以《火場(chǎng)供水》為例 [J].湖北開(kāi)放職業(yè)學(xué)院學(xué)報(bào)，2019，32（5）：150-153.

[2] 楊恒驍.移動(dòng)互聯(lián)網(wǎng)應(yīng)用程序的安全檢測(cè)和防護(hù)技術(shù)概述 [J].網(wǎng)絡(luò)安全技術(shù)與應(yīng)用，2022（12）：59-60.

[3] 胡姝帆. 基于用戶(hù)體驗(yàn)的微信應(yīng)用小程序設(shè)計(jì) [D].武漢：湖北工業(yè)大學(xué)，2021.

[4] 黃鐵娜，戴文靜，曹君.基于Spark框架的圖書(shū)館微信服務(wù)平臺(tái)設(shè)計(jì)研究 [J].現(xiàn)代電子技術(shù)，2021，44（15）：99-103.

[5] 張楊帆，郝鈺鑫，李隱峰，等.基于圖像識(shí)別的失物招領(lǐng)微信小程序設(shè)計(jì) [J].電子科技，2022，35（10）：33-38.

作者簡(jiǎn)介：張廣軍（1982.03—）男，漢族，江蘇泰興人，講師，本科，研究方向：計(jì)算機(jī)仿真。

收稿日期：2022-09-19