韓麗媛

【摘要】隨著網(wǎng)絡(luò)技術(shù)的不斷發(fā)展，國(guó)家的教學(xué)模式也呈現(xiàn)多樣的方式?；诰W(wǎng)絡(luò)技術(shù)的在線學(xué)習(xí)方式，受到了越來(lái)越多的人的青睞，“慕課”在此基礎(chǔ)上，以大規(guī)模，開(kāi)放課程，網(wǎng)絡(luò)課程等特點(diǎn)及優(yōu)勢(shì)，迅速發(fā)展起來(lái)。本平臺(tái)設(shè)計(jì)過(guò)程中，平臺(tái)主要分為兩個(gè)部分：前臺(tái)與后臺(tái)。前臺(tái)采用目前最流行的前端開(kāi)發(fā)的開(kāi)源工具包Bootstrap，結(jié)合前端CSS布局樣式，設(shè)計(jì)完成了用戶登錄與注冊(cè)，瀏覽課程，學(xué)習(xí)課程，在線考試，自測(cè)，學(xué)習(xí)筆記，在線問(wèn)答，文章瀏覽以及經(jīng)驗(yàn)值等；后臺(tái)通過(guò)采用jQueryEasyUI框架技術(shù)，使用流媒體技術(shù)，視頻的轉(zhuǎn)碼技術(shù)來(lái)克服在視頻上出現(xiàn)卡頓和無(wú)法加載的現(xiàn)象，保障了視頻的流暢。

【關(guān)鍵詞】慕課教學(xué)平臺(tái) B/S架構(gòu) MVC Microsoft Visual Studio 2012 SQL Server 2008

【中圖分類號(hào)】G642 【文獻(xiàn)標(biāo)識(shí)碼】A 【文章編號(hào)】2095-3089（2015）08-0049-02

【ABSTRACT】With the development of network technology， the teaching modes have taken a variety of ways. More and more people like the online learning method which is based on network technology. On the basis of that， Mooc is developing rapidly as the characteristics and advantages of large-scale， open courses and the network curriculum.

The platform is divided into two parts during design， which are the foreground and background. The foreground uses the most popular open-source toolkit—Bootstrap. Combined with the fore-end of the CSS layout style， It completes the design of logging on and submitting， browsing courses， leaning courses， online examination， self-test， study notes， online ask and answer，browsing articles and experience.The background uses the jQueryEasyUI framework technology . It overcomes the phenomenon of videos struck and cant load the videos by streaming media technology and video transcode technology ，So that it guarantee the videos played smoothly.

【Keywords】Mooc； B / S architecture； MVC； Microsoft Visual Studio 2012； SQL Server 2008

所謂“慕課”，是將傳統(tǒng)的教學(xué)錄制成教學(xué)視頻，然后將視頻分割成10分鐘甚至更小的“微課程”，其中由許多小的問(wèn)題穿插其中連貫而成，使得學(xué)習(xí)者注意力集中，遇到的任何的疑問(wèn)，可以直接提出來(lái)，與教師進(jìn)行互動(dòng)，達(dá)到學(xué)習(xí)的最佳效果。

慕課教學(xué)平臺(tái)的設(shè)計(jì)與實(shí)現(xiàn)，在參考了國(guó)內(nèi)外慕課系統(tǒng)的發(fā)展現(xiàn)狀與趨勢(shì)的基礎(chǔ)上，通過(guò)對(duì)大學(xué)生的具體實(shí)際需求，同時(shí)考慮到不同大學(xué)的教學(xué)需求，以及系統(tǒng)的延展性和數(shù)據(jù)的兼容性，給出了一套較為完整的設(shè)計(jì)方案。系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)，不僅滿足了不同人群的學(xué)習(xí)需求，同時(shí)提高了受教育者的學(xué)習(xí)效率。

本平臺(tái)開(kāi)發(fā)過(guò)程中采用Visual Studio 2012開(kāi)發(fā)平臺(tái)，數(shù)據(jù)庫(kù)采用SQL SERVER 2008管理平臺(tái)，使用.NET中經(jīng)典的MVC框架模式，實(shí)現(xiàn)整個(gè)慕課教學(xué)平臺(tái)的搭建。

一、關(guān)鍵技術(shù)介紹

1.MVC技術(shù)

MVC是Model（模型）、View（視圖），Controller（控制器）的簡(jiǎn)稱，是一種典型的，實(shí)用的軟件設(shè)計(jì)框架的典范，用于組織代碼用一種業(yè)務(wù)邏輯和數(shù)據(jù)顯示分離的方法。這種技術(shù)使得界面與后臺(tái)分離，使得開(kāi)發(fā)者和前臺(tái)美工人員，可以很好的分工協(xié)作。

MVC分層有助于管理復(fù)雜的應(yīng)用程序，因?yàn)槟梢栽谝粋€(gè)時(shí)間內(nèi)專門關(guān)注一個(gè)方面。MVC 分層同時(shí)也簡(jiǎn)化了分組開(kāi)發(fā)。不同的開(kāi)發(fā)人員可同時(shí)開(kāi)發(fā)視圖、控制器邏輯和業(yè)務(wù)邏輯。

2.Bootstrap

Bootstrap是一款簡(jiǎn)潔，直觀，強(qiáng)悍的前端框架，讓web開(kāi)發(fā)更迅速簡(jiǎn)單。其中，內(nèi)置的全局CSS樣式庫(kù)，組件庫(kù)，JavaScript插件庫(kù)等樣式豐富，使得前臺(tái)開(kāi)發(fā)更加靈活。還有響應(yīng)式的布局設(shè)計(jì)，可以適應(yīng)各種移動(dòng)終端的需求，完善和改進(jìn)原有的樣式庫(kù)，使得前臺(tái)界面的設(shè)計(jì)大方，美觀。

3.流媒體技術(shù)

流媒體技術(shù)主要是處理視頻在播放中的卡死現(xiàn)象，它主要有三部分：數(shù)據(jù)服務(wù)中心，Web端子系統(tǒng)，移動(dòng)端子系統(tǒng)。

數(shù)據(jù)服務(wù)中心：擔(dān)當(dāng)數(shù)據(jù)請(qǐng)求（瀏覽器或移動(dòng)設(shè)備）和服務(wù)器響應(yīng)（數(shù)據(jù)庫(kù)服務(wù)器）的中間層。“數(shù)據(jù)服務(wù)中心”能夠?qū)?shù)據(jù)庫(kù)服務(wù)器進(jìn)行增刪改查等操作；能夠通過(guò)負(fù)載均衡服務(wù)器向流媒體服務(wù)器集群上傳流媒體文件；還能夠通過(guò)負(fù)載均衡服務(wù)器得到響應(yīng)的媒體流播放地址以便回傳到客戶端。

Web端子系統(tǒng)：Web端子系統(tǒng)為一個(gè)獨(dú)立的網(wǎng)站。Web端子系統(tǒng)通過(guò)“數(shù)據(jù)服務(wù)中心”進(jìn)行數(shù)據(jù)的請(qǐng)求和操作。

移動(dòng)端子系統(tǒng)：移動(dòng)端子系統(tǒng)為一個(gè)移動(dòng)客戶端程序，僅包括“學(xué)生端學(xué)習(xí)平臺(tái)”。移動(dòng)端子系統(tǒng)通過(guò)“數(shù)據(jù)服務(wù)中心”進(jìn)行數(shù)據(jù)的請(qǐng)求和操作。

二、業(yè)務(wù)流程分析

本平臺(tái)的用戶分為三個(gè)角色：學(xué)生，教師，管理員。下面就進(jìn)行業(yè)務(wù)流程的分析。

1.學(xué)生用戶的業(yè)務(wù)流程

流程說(shuō)明：

（1）學(xué)生進(jìn)入慕課教學(xué)平臺(tái)，注冊(cè)用戶或者直接選擇學(xué)號(hào)登錄，進(jìn)而登錄進(jìn)入系統(tǒng)。

（2）學(xué)生根據(jù)需要，選擇所需學(xué)習(xí)的課程，如果是自己要學(xué)習(xí)的內(nèi)容，則選擇課程，開(kāi)始學(xué)習(xí)；如果不是自己要學(xué)習(xí)的內(nèi)容，則繼續(xù)選擇課程。

（3）在學(xué)習(xí)的過(guò)程中，學(xué)生可以根據(jù)所學(xué)習(xí)的內(nèi)容，進(jìn)行相關(guān)內(nèi)容的練習(xí)，以及進(jìn)行在線的答疑，筆記，自測(cè)等

（4）如果有需要，可以再次學(xué)習(xí)，或者選擇其他課程。

2.教師用戶流程

流程說(shuō)明：

（1）教師進(jìn)入慕課教學(xué)平臺(tái)，首先要登錄到網(wǎng)站的后臺(tái)。

（2）教師根據(jù)課程安排，進(jìn)行相應(yīng)的課程發(fā)布，進(jìn)而讓學(xué)生可以前臺(tái)學(xué)習(xí)此課程。

（3）根據(jù)所傳課程視頻的內(nèi)容，進(jìn)行試題的生成，以供學(xué)生在學(xué)習(xí)的過(guò)程中，學(xué)生可以根據(jù)所學(xué)習(xí)的內(nèi)容，進(jìn)行相關(guān)內(nèi)容的自測(cè)練習(xí)。

三、系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)

系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)，是系統(tǒng)開(kāi)發(fā)過(guò)程中最重要的一個(gè)環(huán)節(jié)，系統(tǒng)的設(shè)計(jì)應(yīng)該按照需求分析階段的分析來(lái)進(jìn)行設(shè)計(jì)。

1.前臺(tái)功能模塊設(shè)計(jì)

（1）導(dǎo)航設(shè)計(jì)：通過(guò)導(dǎo)航菜單，選擇不同的鏈接選擇，進(jìn)入相應(yīng)的界面，同時(shí)進(jìn)行用戶的登陸注冊(cè)。

（2）首頁(yè)：顯示的內(nèi)容，用戶可以進(jìn)行定制。有三種類型：按默認(rèn)情況，按課程，按文章等內(nèi)容進(jìn)行顯示。展示課程的詳細(xì)信息（包括課程更新時(shí)間，在學(xué)人數(shù)，更新節(jié)數(shù)以及課程時(shí)長(zhǎng)）。

（3）設(shè)置：用戶可以修改個(gè)人信息，頭像，修改綁定郵箱，修改密碼等功能。

（4）個(gè)人中心：主要包括8個(gè)模塊：

我的課程：支持學(xué)習(xí)歷史記錄功能，可按時(shí)間的順序展示學(xué)生所學(xué)過(guò)的所有課時(shí)及相關(guān)的學(xué)習(xí)信息

我的試題：顯示自己做過(guò)的錯(cuò)題和收藏的題?？梢赃M(jìn)行重復(fù)練習(xí)，加深對(duì)知識(shí)的掌握。并隨時(shí)清除錯(cuò)題，支持自動(dòng)判斷和試題解析功能。

我的自測(cè)：自動(dòng)記錄學(xué)生在學(xué)習(xí)過(guò)程中自測(cè)的試題，學(xué)生如果當(dāng)時(shí)沒(méi)有完成自測(cè)，則可繼續(xù)測(cè)試；如果完成測(cè)試，可以查看試卷詳細(xì)的分析，讓學(xué)生在學(xué)習(xí)中，不僅可以學(xué)習(xí)，還可以進(jìn)行考試，分析，提高學(xué)生的學(xué)習(xí)效率。

我的筆記：在線記錄筆記及其參加該課程學(xué)習(xí)人數(shù)之間的交流，好的筆記可以進(jìn)行收藏，了解不同學(xué)生對(duì)學(xué)習(xí)此課程的獨(dú)特的見(jiàn)解。

課程代碼：在學(xué)習(xí)過(guò)程中，老師可以進(jìn)行作業(yè)的布置，如果是計(jì)算機(jī)類相關(guān)課程，需要進(jìn)行編寫(xiě)代碼，則所有和代碼有關(guān)的作業(yè)、習(xí)題都展現(xiàn)在這里，方便學(xué)生查看，對(duì)代碼進(jìn)行及時(shí)的修改。

課程問(wèn)答：支持對(duì)視頻的承載來(lái)完成在線作答、定知識(shí)點(diǎn)作答，在此同時(shí)還支持涉及到所在知識(shí)點(diǎn)的資料，進(jìn)行在線的學(xué)習(xí)，下載。

所得經(jīng)驗(yàn)值：每學(xué)一門課程都會(huì)獲得相應(yīng)的經(jīng)驗(yàn)值，作為一個(gè)衡量學(xué)生學(xué)習(xí)情況的標(biāo)準(zhǔn)，并且設(shè)有排名，來(lái)激發(fā)學(xué)生的學(xué)習(xí)斗智。

私信：可以再慕課教學(xué)平臺(tái)進(jìn)行在線的交流。學(xué)生可以和課程教師進(jìn)行在線的答疑，解惑，一次解決傳統(tǒng)教學(xué)當(dāng)中時(shí)間問(wèn)題，做到有問(wèn)題，零負(fù)擔(dān)。

（5）課程頁(yè)面，學(xué)習(xí)頁(yè)面，試卷頁(yè)面是用戶分別要進(jìn)行學(xué)習(xí)和考試。

在學(xué)習(xí)視頻觀看的過(guò)程中，在視頻中設(shè)置了觸發(fā)點(diǎn)，如果視頻播放到觸發(fā)點(diǎn)，視頻自動(dòng)暫停，并在視頻右側(cè)彈出相關(guān)練習(xí)題，使學(xué)生在學(xué)習(xí)的過(guò)程中，加深記憶。并在此知識(shí)點(diǎn)處可以翻閱在線資料，做知識(shí)點(diǎn)筆記及其在線交流。

（6）本系統(tǒng)還支持線下學(xué)習(xí)，視頻下載功能。

2.后臺(tái)功能模塊

（1）系統(tǒng)模塊主要包含：系統(tǒng)設(shè)置、消息設(shè)置、系統(tǒng)日志子模塊其中系統(tǒng)設(shè)置主要包含一些對(duì)網(wǎng)站的LOGO的設(shè)置，網(wǎng)站版權(quán)設(shè)置等，而消息設(shè)置模塊主要是用來(lái)管理員或者教師發(fā)布一些消息，例如管理員發(fā)布的系統(tǒng)消息或發(fā)給某位老師告知新增加了該教師應(yīng)該管理的課程，或者是對(duì)學(xué)生學(xué)習(xí)狀況查看后的評(píng)價(jià)、警告等。

系統(tǒng)模塊的設(shè)計(jì)，主要是用來(lái)方便用戶進(jìn)行定制，不同的大學(xué)，網(wǎng)站LOGO等都是不一樣的，此部分的設(shè)計(jì)，充分滿足了不同的機(jī)構(gòu)對(duì)網(wǎng)站使用的不同需求。

（2）用戶管理模塊主要實(shí)現(xiàn)對(duì)登錄的用戶進(jìn)行管理及其對(duì)其不同用戶的權(quán)限設(shè)置。

（3）課程模塊包含的課程分類主要用來(lái)處理添加前臺(tái)顯示的課程大類。

課程管理：在課程分類的情況下，更加細(xì)化課程到具體的課程中，并且在課程設(shè)置中添加課程的章節(jié)和設(shè)置綁定到某些章節(jié)下視頻、試題資源、學(xué)習(xí)資料等。

課程的問(wèn)答管理，主要用來(lái)查看前臺(tái)用戶在學(xué)習(xí)該課程時(shí)對(duì)該課程的交流，教師則可針對(duì)學(xué)生們交流的問(wèn)題，進(jìn)行回復(fù)，解答。

課程評(píng)價(jià)管理，主要用來(lái)記錄用戶在學(xué)習(xí)完該課程后對(duì)該課程的評(píng)價(jià)。

課程欄目設(shè)置，它主要是用來(lái)對(duì)課程分欄目，例如把課程分為精品課，公開(kāi)課等該功能用來(lái)實(shí)現(xiàn)前臺(tái)動(dòng)課程列表的篩選和實(shí)現(xiàn)管理課程權(quán)限。

（4）題庫(kù)管理模塊實(shí)現(xiàn)了現(xiàn)有的考試平臺(tái)資源的無(wú)縫對(duì)接，網(wǎng)站可自由訪問(wèn)考試平臺(tái)的試題、試卷資源，也可以根據(jù)需求在題庫(kù)中篩選出想要的試題去重新生成想要的試卷并且綁定到需要的課程上，方便使用。

（5）個(gè)人中心模塊（僅教師）主要針對(duì)的是教師登錄管理系統(tǒng)，該模塊包含一些和教師相關(guān)的信息，教師管理的課程，教師收到的消息，教師管理的學(xué)生，教師布置的作業(yè)，教師與學(xué)生之間的交互同時(shí)該模塊也包含了審核課程的功能，前臺(tái)用戶在進(jìn)入課程的時(shí)候，第一步是申請(qǐng)?jiān)撜n程的，成功后方可學(xué)習(xí)該課程，用戶通過(guò)申請(qǐng)?zhí)囟ń處煹恼n程，這樣教師就可以實(shí)現(xiàn)判斷是否通過(guò)審核來(lái)完成對(duì)學(xué)生選課的管理。最后教師還可以通過(guò)學(xué)生評(píng)測(cè)模塊來(lái)查看學(xué)生學(xué)習(xí)狀況分布圖。從而在需要的時(shí)候可以對(duì)學(xué)生發(fā)出警告。

四、總結(jié)與展望

目前，網(wǎng)絡(luò)教學(xué)平臺(tái)的應(yīng)用非常的廣泛，但是還沒(méi)有真正的應(yīng)用到傳統(tǒng)教學(xué)當(dāng)中，如果網(wǎng)絡(luò)教學(xué)平臺(tái)能夠與傳統(tǒng)的教學(xué)相結(jié)合，勢(shì)必將促國(guó)家教育事業(yè)的發(fā)展。隨著“慕課”的到來(lái)，基于慕課的教學(xué)平臺(tái)一定會(huì)為促進(jìn)受教育者的學(xué)習(xí)效率做出貢獻(xiàn)，而且也會(huì)有很好的發(fā)展前景。在設(shè)計(jì)的整個(gè)過(guò)程中，前臺(tái)主要采用目前最新的Bootstrap框架，搭建響應(yīng)式的布局，為日后應(yīng)運(yùn)在不同平臺(tái)打下基礎(chǔ)；后臺(tái)采用MVC框架，是前后臺(tái)分離，方便搭建。

慕課近幾年的發(fā)展形勢(shì)非常的好，慕課教育平臺(tái)在未來(lái)的教學(xué)當(dāng)中，必將占據(jù)重要的地位，這是傳統(tǒng)教學(xué)模式與當(dāng)代信息技術(shù)融合的表現(xiàn)，他的發(fā)展勢(shì)必將在教育界掀起巨浪，在線的教學(xué)方式，將成為人們學(xué)習(xí)的主要工具，從而促進(jìn)我國(guó)教育事業(yè)的發(fā)展。

參考文獻(xiàn)：

[1] 廖信彥.ASP.NET交互式Web數(shù)據(jù)庫(kù)程序設(shè)計(jì)[M].中國(guó)鐵道出版社，2006.

[2]方柯.基于ASP.NET MVC框架的Web應(yīng)用開(kāi)發(fā)研宄[J].電腦知識(shí)與技術(shù)，2010 （6） ：6213_6215.

[3]徐楓.基于ASP.NET的MVC模式的分析與應(yīng)用[J].電子科學(xué)，2011（10）：31-33.

[4]鄭齊心.ASP.NET項(xiàng)目開(kāi)發(fā)案例全程實(shí)錄[D].北京：清華大學(xué)出版 社，2011.

[5]袁宏偉.基于ASP.NET的現(xiàn)代遠(yuǎn)程教育網(wǎng)站設(shè)計(jì)[D].北京：中國(guó)地質(zhì)大學(xué)（北京），2009.

[6]楊旭士.基于JQuery框架的Web查詢視圖設(shè)計(jì)與實(shí)現(xiàn)[J].計(jì)算機(jī)與現(xiàn)代化，2010（8）： 128-129.

[7]李彥，高博.ASP.NET 4.0MVC敏捷開(kāi)發(fā)給力起飛[M].北京：電子工業(yè)出版社，2011.

[8]呂鳴.網(wǎng)上考試系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[D].上海：復(fù)旦大學(xué)，2009.

[9]朱濤，周昕.基于ASP.NET MVC模式的精品課程網(wǎng)站系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[J] 科技信息，2011（31）：106-114.

[10]高靜，段會(huì)川.JS0N數(shù)據(jù)傳輸效率研宄[J].計(jì)算機(jī)工程與設(shè)計(jì)，2011，32（7）：2267-2270

[11]Bootstrap中文網(wǎng)：http：//www.bootcss.com/