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

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

1 引言

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

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

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

2 系統(tǒng)框架

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

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

在服務(wù)器方面采用了阿里云服務(wù)器，這樣系統(tǒng)穩(wěn)定性較高。因?yàn)榘⒗镌铺峁┮欢髁康腄DOS防護(hù)，系統(tǒng)安全性較好。而且阿里云提供國(guó)內(nèi)眾多節(jié)點(diǎn)區(qū)域以及海外服務(wù)器，能夠保證用戶瀏覽器訪問(wèn)速度快。

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

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

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

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

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

圖2 課程選擇界面

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

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

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

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

3.1 頁(yè)面設(shè)計(jì)

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

圖3 登錄界面

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

圖4 在線答題界面

圖5 試題管理界面

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

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

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

3.3 查看實(shí)時(shí)反饋

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

4 結(jié)論

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

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

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