微信小程序線上線下融合教學平臺設計與實現

孔文熙 李曉純 朱景福

摘要：為踐行“停課不停學”的倡導以及促進有序復課后線上教育和線下教育的積極融合，現為教師與學生提供一款基于微信小程序的線上線下融合教學平臺。不僅解決停課帶來的時間地點等環境的局限問題，在降低教學成本的同時為師生提供了一款便捷的在線教學平臺。使用微信小程序結合Node.js框架Express及數據庫技術MySQL進行開發。主要實現了教師與學生之間互動交流的積極促進、課程的便捷教與學、知識反饋的及時傳遞等功能。

關鍵詞：線上線下融合;教學平臺;微信小程序

中圖分類號：TP311? 文獻標識碼：A

文章編號：1009-3044（2021）29-0059-03

Design and Implementation of Online and Offline Integrated Teaching Platform Based on WeChat Mini Program

KONG Wen-xi， LI Xiao-chun， ZHU Jing-fu

（College of Science， Guangdong University of Petrochemical Technology， Maoming 525000， China）

Abstract： In order to practice the advocacy of“no suspension of classes”and promote the positive integration of online education and offline education after the orderly resumption of classes， provide an online and offline integrated teaching platform based on WeChat Mini Program for teachers and students. It not only solves the limitation of time and place caused by class suspension， but also provides a convenient online teaching platform for teachers and students while reducing the teaching cost. Use WeChat Mini Program combined with Node.js framework Express and database technology MySQL to develop. It mainly realizes the active promotion of interaction and communication between teachers and students， the convenient teaching and learning of courses， the timely transmission of knowledge feedback and other functions.

Key words： online and offline integration; teaching platform; WeChat Mini Program

1背景

2020年初由于要保持社交距離和保護師生健康的原因，從幼兒園到大學，整個教育系統都無法進行正常的教育教學活動。教育是立國之本，教育部在人民生命至上的疫情防控國策下，為防止疫情在校園蔓延，充分利用互聯網技術，提出了“停課不停學”的教育教學策略，線上教育教學就此全面展開。但推廣普及線上教育、適應學習新的教學方式也絕非易事[1]，線上教學模式的踐行，對學生和教師而言都是巨大的挑戰，而后疫情時代將線上線下教學融合則可以看作是一個新的教學模式。

現階段慕課（MOOC）、雨課堂等直播、線上互動教學模式的涌現[2]，更廣泛地普及了在線教育，使得在線教育的互動性更強。在疫情加速劑的影響下，線上教學得到迅速發展。

基于微信小程序的線上線下融合教學平臺具有操作簡單、界面美觀、用戶體驗良好等優點。教師與學生可以通過小程序便捷地進行教與學，反饋與互動交流則更注重疑難問題解答、重點知識傳遞等。

2需求分析

針對線上線下融合教學平臺的開發背景和目的，結合當下存在的線上教育類軟件和教師日常教學需求，小程序需實現的主要功能有3個：

1）互動交流：用戶進行課程疑難問題的提出或解答;

2）便捷教學：學生用戶進行在線課程的學習，教師用戶進行課程的管理;

3）及時反饋：學生用戶完成考試或查看考試結果，教師用戶發布或批改試卷。

3系統設計

3.1總體結構設計

由需求分析可知，小程序主要涉及學生用戶和教師用戶。為實現上述主要功能，現對不同用戶涉及的功能模塊進行設計闡述：

1）互動交流功能主要涉及用戶通用的“消息”模塊;

2）便捷教學功能主要涉及學生用戶的“講堂”模塊和教師用戶的“我的講堂”模塊;

3）及時反饋功能主要涉及學生用戶的“考試情況”模塊和教師用戶的“任務”模塊。

系統總體結構圖如圖1所示。

3.2數據庫設計

數據庫設計是計算機軟件系統設計的重要內容之一，同時也是確保計算機軟件系統正常、穩定運行的關鍵[3]。通過描述系統概念數據模型的常用E-R方法，能夠較為直觀地反映了實體與屬性的內在聯系與特點[4]。

本小程序使用的是MySQL數據庫，系統E-R模型圖如圖2所示。

3.3功能模塊設計

1）消息模塊：消息模塊是學生用戶和教師用戶的通用模塊。消息模塊主要通過問題提出、問題回答兩個功能來促進師生交流。

2）講堂模塊：講堂模塊包括查看課程列表和詳情、在線學習兩個功能。學生用戶點擊講堂可以查看已加入的課程列表，點擊選擇進入任一課程詳情頁。在課程詳情頁學生用戶可查看課程基礎信息;可以通過教學團隊查看教師成員列表以及對應的教師詳情頁等信息;可以通過在線教程完成課程PPT、視頻等觀看。

3）考試情況模塊：考試情況模塊包括完成考試、查看考試結果兩個主要功能。學生用戶在考試情況模塊可查看待考試列表，并選擇進入對應考試，通過選擇或者上傳圖片的方式完成考試，提交試卷。也可以通過最終成績列表查看按課程評分比例計算出的最終成績。

4）我的講堂模塊：教師用戶在我的講堂模塊可對學生、教師分別進行人員管理，即可以邀請學生加入課堂以及邀請教師加入團隊，并及時反饋管理學生與教師的加入狀態。同時可以對課堂進行管理，即對開展的課堂進行詳情的輸入編輯。

5）任務模塊：任務模塊包括發布、批改試卷兩個主要功能。教師用戶在任務模塊可進入未發布列表并對狀態為未發布的試卷進行發布操作。同時可以查看待改卷列表，并選擇進入對應考試，通過判斷對錯或輸入分數的方式完成批改。

4功能實現

線上線下融合教學平臺的開發平臺是Windows10操作系統，開發軟件使用的是微信開發者工具和Visual Studio Code。小程序采用前后端分離的開發模式，通過JSON 、Axios等進行前后端交互，可獨立分開部署。前端頁面使用小程序原生開發以及高質量的微信小程序UI組件庫iView Weapp來實現[5]，后端使用Node.js 的Express框架及數據庫技術MySQL共同開發。

4.1互動交流功能實現

用戶進入消息-問答頁面，在該頁面可便捷查看與課程相關疑難問題和問題答案。若問題為未回復狀態，點擊問題進入問題詳情頁面，進行問題詳情查看以及答案輸入。

4.2便捷教學功能實現

1）講堂模塊實現

學生用戶進入課程詳情頁面如圖3所示，在該頁面可以查看課程詳情信息。同時可以通過在線教程頁面如圖4所示選擇對應章節PPT或視頻進行在線學習。

2）我的講堂模塊實現

教師用戶進入課程設置頁面如圖5所示。人員管理部分對未加入或已加入課程的學生和老師進行管理，課堂管理部分可對課程詳情進行管理，如圖6所示章節管理頁面可對課程章節，具體章節的PPT、視頻、其他詳情信息進行編輯操作。

4.3及時反饋實現

1）考試情況模塊實現

學生用戶進入考試情況-待考試頁面，選擇并進入試卷，通過完成選擇題選擇以及在問答題部分上傳答案照片完成考試。學生用戶在考試情況-課程成績頁面可以查看最終成績。

2）任務模塊實現

教師用戶進入任務-未發布頁面，可以進行試卷的發布。進入任務-待改卷頁面，進行試卷的批改，批改完成后會根據各題得分自動計算出總分。

5結束語

本文設計并實現的基于微信小程序線上線下教學平臺是一款能及時反饋、增進學生與老師互動交流、通過演示文稿軟件與視頻側重知識傳遞的平臺。該小程序現主要按計劃圍繞便捷教學、互動交流、及時反饋三大功能進行了實現。其余功能模塊仍在開發、完善優化中，爭取能盡快投入使用。參考文獻：

[1]尹嬌陽.后疫情時期在線教育的SWOT分析與應對[J].產業與科技論壇，2021，20（2）：100-102.

[2]邊大成，黃鵬.2020年國內在線教育發展現狀、趨勢及建議[N].中國計算機報，2020-08-03（14）.

[3]楊彥青，郭獻崇.計算機軟件數據庫設計中存在的問題及設計原則[J].無線互聯科技，2021，18（2）：43-44.

[4]朱珍.基于E-R模型數據庫設計的關鍵技術研究[J].電腦編程技巧與維護，2019（5）：77-79.

[5] iView Weapp官網.iView 指南[EB/OL].[2020-12-20].https：// weapp.iviewui.com.

【通聯編輯：謝媛媛】