基于SPOC的計算機(jī)專業(yè)課程輔助學(xué)習(xí)系統(tǒng)

李佳宏，劉嘉敏，常 燕，曹洪相，郭 濤

（沈陽工業(yè)大學(xué) 信息科學(xué)與工程學(xué)院 遼寧 沈陽 110870）

1 引言

SPOC（Small Private Online Course），即小規(guī)模私人在線課程，是指將 MOOC 本地化為供在校學(xué)生學(xué)習(xí)的課程模式[1]。其中MOOC是指通過網(wǎng)絡(luò)技術(shù)將課堂教學(xué)、學(xué)習(xí)體驗、師生互動等環(huán)節(jié)完整的在線實現(xiàn)，形成一種更加交互、基于群體行為的學(xué)習(xí)模式，它功能多地是面相“外行學(xué)習(xí)”者的，知識含量和嚴(yán)謹(jǐn)程度達(dá)不到大學(xué)水平課程的要求[2]。在這種情況下，相對于MOOC的對外，SPOC的對內(nèi)更具有促進(jìn)大學(xué)教學(xué)改革的作用，能夠帶來的一種新的教學(xué)方式。SPOC因其“小”的特點，能夠產(chǎn)生更為靈活而有效的學(xué)習(xí)效果[3]。

利用SPOC實現(xiàn)混合教學(xué)模式，學(xué)生可以很方便地在討論組里提問和交流，具有很強(qiáng)的互動性。教師可以更方便地布置課后習(xí)題和作業(yè)，并且能夠及時得到作業(yè)成績信息，從而獲得相對即時的教學(xué)效果反饋，打破了傳統(tǒng)教學(xué)方式中受到的時間和空間的限制，使教學(xué)變得更加靈活[4]。關(guān)于SPOC的經(jīng)典教學(xué)案例就是哈佛大學(xué)的SPOC實驗、加州大學(xué)伯克利分校的SPOC試驗及推廣以及“科羅拉多州立大學(xué)—全球校園”的微型SPOC實驗等，另外國內(nèi)多所高校也陸續(xù)采用SPOC的方式來輔助教學(xué)。比如浙江大學(xué)計算機(jī)科學(xué)與技術(shù)學(xué)院、清華MBA SPOC課堂、天津大學(xué)等多所高校都在勇于創(chuàng)新，突破保守的傳統(tǒng)教學(xué)模式，利用SPOC來參與輔助教學(xué)[5]。

為此我們應(yīng)用Java Web技術(shù)開發(fā)了一套基于SPOC模式的計算機(jī)專業(yè)課程學(xué)習(xí)系統(tǒng)。該系統(tǒng)設(shè)計的主要目的在于為學(xué)生提供一種更高效便捷的復(fù)習(xí)途徑，為老師提供一種能夠更加及時了解學(xué)生學(xué)習(xí)情況的工具。同時本系統(tǒng)采用云平臺的技術(shù)手段，為此基于SPOC模式的計算機(jī)專業(yè)課程學(xué)習(xí)系統(tǒng)實施的高效性、安全性提供了保障。

2 系統(tǒng)框架

2.1 框架結(jié)構(gòu)

采用了B/S三層架構(gòu)技術(shù)，B/S結(jié)構(gòu)即瀏覽器和服務(wù)器結(jié)構(gòu)，用戶的工作界面主要是通過WWW瀏覽器實現(xiàn)的，只有極少部分的事務(wù)邏輯在前端（Browser）實現(xiàn)的，主要事務(wù)邏輯都是在服務(wù)器端（Server）實現(xiàn)的，從而形成了所謂的三層3-tier結(jié)構(gòu)。這種模式統(tǒng)一了客戶端，用戶機(jī)器上只需要安裝一個瀏覽器，大大簡化了客戶端的電腦負(fù)荷，減輕了系統(tǒng)維護(hù)與升級的成本和工作量，同時這種結(jié)構(gòu)下系統(tǒng)的功能實現(xiàn)主要集中在服務(wù)器端，簡化了系統(tǒng)的開發(fā)、維護(hù)和使用。

在服務(wù)器方面采用了阿里云服務(wù)器，這樣系統(tǒng)穩(wěn)定性較高。因為阿里云提供一定流量的DDOS防護(hù)，系統(tǒng)安全性較好。而且阿里云提供國內(nèi)眾多節(jié)點區(qū)域以及海外服務(wù)器，能夠保證用戶瀏覽器訪問速度快。

在業(yè)務(wù)開發(fā)中，系統(tǒng)采用了傳統(tǒng)的Java Web技術(shù)，應(yīng)用了傳統(tǒng)的Java Web開發(fā)框架—Spring MVC + MyBatis+MySQL架構(gòu)。其核心思想采用了MVC的典型軟件設(shè)計思想。MVC的具體模式是：頁面（View）會將參數(shù)傳遞到控制層（Controller），然后控制層將請求分發(fā)到業(yè)務(wù)層（Service），然后業(yè)務(wù)層再調(diào)用相應(yīng)的持久層（Dao）來進(jìn)行數(shù)據(jù)的持久化操作。在服務(wù)器端使用該框架一定程度上降低了系統(tǒng)各部分的耦合性，使項目開發(fā)過程更加安全，同時也使項目開發(fā)過程更加便捷[6]。采用Spring MVC框架能夠更好地管理代碼，方便開發(fā)者后期對系統(tǒng)進(jìn)行功能修改以及日常維護(hù)。采用MySQL關(guān)系型數(shù)據(jù)庫，能夠承受高并發(fā)量的數(shù)據(jù)訪問，支持多線程，能夠充分利用CPU的資源，擴(kuò)展性好。

2.2 系統(tǒng)功能框架

該系統(tǒng)主要分為學(xué)生端和教師端，其中學(xué)生端主要包括在線答題和收藏到錯題本等四個功能模塊，教師端主要包括學(xué)生信息管理和題庫管理和查看實時反饋信息三個功能模塊。系統(tǒng)功能結(jié)構(gòu)圖如圖1所示。

圖1 系統(tǒng)功能結(jié)構(gòu)圖

本系統(tǒng)設(shè)計的主要目的是通過在線答題來的方式來幫助學(xué)生更好的理解課堂講授的知識。因此，在線答題是該系統(tǒng)的主要功能。學(xué)生可以根據(jù)所學(xué)科目選擇相應(yīng)課程進(jìn)行在線答題的操作，如圖2所示。

圖2 課程選擇界面

答題完畢后，系統(tǒng)會將學(xué)生的答題情況提交到后臺進(jìn)行數(shù)據(jù)處理，通過查詢數(shù)據(jù)庫中的試卷表對學(xué)生給出的答案和試卷的正確答案進(jìn)行對比從而得出結(jié)果，對試卷的每一道題進(jìn)行審核之后得出學(xué)生的成績，并通過前端頁面反饋給學(xué)生，能夠當(dāng)即看到答題的反饋結(jié)果，獲得相對實時的反饋。并且每道題目下方都會有查看題目解析的按鈕，學(xué)生可以根據(jù)自身情況進(jìn)行更有針對性的學(xué)習(xí)。

錯題本功能是對學(xué)生在線答題提供的一個輔助功能。錯題本功能包括練習(xí)錯題和刪除錯題兩部分。它能幫助學(xué)生及時發(fā)現(xiàn)自己還未正確理解和完全掌握的知識點，及時發(fā)現(xiàn)知識點的漏洞，從而能夠更有效，更加具有針對性的進(jìn)行復(fù)習(xí)，對相對薄弱的知識點多加練習(xí)，使其對知識點的掌握更加全面，避免在學(xué)習(xí)過程中產(chǎn)生自己難以察覺的知識點漏洞，從而對以后的深入學(xué)習(xí)產(chǎn)生消極影響。

根據(jù)課程不同，每門學(xué)科的授課教師對試題也都有著不同的要求，題庫管理模塊能夠方便、快捷和高效地為教師提供自主出題的功能，教師可任意添加新題冊，修改和刪除題冊。此外系統(tǒng)還提供學(xué)生、教師、課程等信息管理功能。

3 設(shè)計實現(xiàn)

3.1 頁面設(shè)計

頁面是系統(tǒng)對用戶最直接的展現(xiàn)，頁面交互設(shè)計的優(yōu)劣直接影響用戶對系統(tǒng)的使用體驗。頁面設(shè)計沿用了當(dāng)今最流行的扁平化頁面設(shè)計風(fēng)格，圖3所示的登錄界面就很好地展現(xiàn)了扁平化風(fēng)格頁面的UI效果。在實現(xiàn)過程中主要使用了Bootstrap和JQuery開源的前端庫。Bootstrap是一個開源的前端UI庫，簡單易用，擴(kuò)展性良好，它對扁平化的頁面風(fēng)格提供了良好的支持，大大提高了前端頁面的開發(fā)效率。同時，Bootstrap能夠很好的解決不同瀏覽器之間的兼容問題。

圖3 登錄界面

在線答題本系統(tǒng)的核心功能，其具體展現(xiàn)形式可分為學(xué)生端的在線答題（圖4）和教師端的試題管理（圖5）兩部分。

圖4 在線答題界面

圖5 試題管理界面

3.2 Ajax實現(xiàn)局部刷新

系統(tǒng)中使用Ajax瀏覽器端網(wǎng)頁開發(fā)技術(shù)，通過異步請求方式實現(xiàn)了頁面局部刷新的效果，提高了用戶體驗。主要是通過Ajax模擬傳統(tǒng)意義上的HTTP請求方式，以異步的方式向后端Controller發(fā)送HTTP請求，Controller通過調(diào)用一系列業(yè)務(wù)代碼進(jìn)行數(shù)據(jù)的查詢和處理，最后將結(jié)果再次通過Controller以響應(yīng)的方式返回給前端頁面。在這一系列操作中，不存在頁面的跳轉(zhuǎn)，因此能夠更好的提高用戶的使用體驗。

本文中以試題解析部分為例進(jìn)行具體描述。系統(tǒng)首先獲取試題解析按鈕中對應(yīng)的試題id信息，然后通過Ajax將其通過異步請求的方式發(fā)送給系統(tǒng)后端的Controller控制層，Controller控制層根據(jù)拿到的試題id到數(shù)據(jù)庫中進(jìn)行查詢，將查詢到的試題解析的數(shù)據(jù)再次Controller控制層返回給前端并由前端將數(shù)據(jù)完整、清晰的展示給用戶。

3.3 查看實時反饋

該系統(tǒng)設(shè)計的主要目的之一就是加強(qiáng)學(xué)生和教師之間的課下交流，因此，本系統(tǒng)也致力于設(shè)計出能向教師實時反饋學(xué)生學(xué)習(xí)情況的功能。通過用戶的反饋信息，該系統(tǒng)擬優(yōu)化學(xué)生答題信息實時反饋形式，達(dá)到更加直觀地展現(xiàn)學(xué)生答題情況。ECharts是一款由百度前端技術(shù)部開發(fā)的，基于JavaScript的前端數(shù)據(jù)可視化圖表庫，提供直觀，生動，可交互，可個性化定制的數(shù)據(jù)可視化圖表組件。為了實現(xiàn)直觀的數(shù)據(jù)展示，本系統(tǒng)在后期產(chǎn)品迭代過程中擬使用百度開源的ECharts前端數(shù)據(jù)可視化技術(shù)，來實現(xiàn)學(xué)生答題信息的數(shù)據(jù)可視化展示。該前端數(shù)據(jù)可視化圖表庫，依賴少，功能強(qiáng)大，使用簡單，便于開發(fā)和維護(hù)，是實現(xiàn)前端數(shù)據(jù)可視化很好的一種選擇。

4 結(jié)論

本系統(tǒng)的設(shè)計主要解決了傳統(tǒng)課堂教學(xué)當(dāng)中受到的時間和空間上的限制。它結(jié)合SPOC的在線教學(xué)模式，為實現(xiàn)混合教學(xué)模式提供了一種可能。

采用在線答題的形式，使學(xué)生能夠及時了解自己對所學(xué)知識的掌握程度，從而更加有針對性的進(jìn)行學(xué)習(xí)，使學(xué)習(xí)過程高效便捷，一定程度上提高了學(xué)生的學(xué)習(xí)效率。此外，該系統(tǒng)也為教師提供了一種能夠及時了解學(xué)生整體學(xué)習(xí)情況的途徑，根據(jù)得到的學(xué)生整體學(xué)習(xí)情況的反饋，及時進(jìn)行教學(xué)內(nèi)容和教學(xué)進(jìn)度的調(diào)整，一定程度上起到了強(qiáng)化課堂教學(xué)的作用。

同時，該學(xué)習(xí)系統(tǒng)具有很強(qiáng)的學(xué)科適應(yīng)性，事實上它并不只是適用于計算機(jī)專業(yè)課程的學(xué)習(xí)，對其他專業(yè)也都具有良好的適用性，幾乎能夠配合任何學(xué)科的教學(xué)使用，符合如今多數(shù)教學(xué)者和學(xué)習(xí)者的教學(xué)以及學(xué)習(xí)需求，具備較高的實用性以及良好的發(fā)展前景。