適用于低齡兒童的Web3D教育平臺開發(fā)研究

1、適用于低齡兒童的Web3D教育平臺開發(fā)研究摘 要：本文實現(xiàn)了一種基于三維的課程教學(xué)模式應(yīng)用，擺脫了二維視圖教學(xué)模式在呈現(xiàn)信息時的單一性，將教育場景搭建在基于 Three. js的WebGL框架上，構(gòu)建適用于低齡兒童的Web3 D教育平臺，實現(xiàn)教學(xué)場景三維化。同時，將基于深度學(xué)習(xí)的人臉表情識別算法、 人體動作識別算法應(yīng)用到Web3D教育平臺，實現(xiàn)不需要手動輸入指令的自然、實時教學(xué)過程中的人機(jī)交互，使學(xué)習(xí)者感受到智能交互帶來 的參與感和沉浸感，增加學(xué)習(xí)樂趣。關(guān)鍵詞：Web3D；教育平臺；低齡兒童；人臉識別；動作識別在基礎(chǔ)教育領(lǐng)域中，主要采取以學(xué)生為中心的教學(xué)模式，在這 種模式下學(xué)生尤其是6-12歲

2、低齡兒童的學(xué)習(xí)積極性能否被有效調(diào) 動、創(chuàng)造性思維能否被合理開發(fā)將會直接影響教學(xué)效果，因此，對 教師的教學(xué)提出了更高的要求。在此背景下，對教學(xué)課件的設(shè)計與 制作提出了更高的要求。優(yōu)秀的教學(xué)課件要能夠充分調(diào)動學(xué)生的學(xué) 習(xí)積極性，讓學(xué)生更好的參與教學(xué)，但是在實際教學(xué)過程中，一些 用圖片和文字不能夠很好表達(dá)的教學(xué)內(nèi)容，例如小學(xué)數(shù)學(xué)中的空間 與圖形、小學(xué)語文中的動物認(rèn)知、小學(xué)英語中的場景對話等，這些 抽象的知識，如果能以沉浸式、交互式的多媒體課件進(jìn)行教學(xué)展示， 一定會起到更好的教學(xué)效果。目前，教師常用的多媒體課件制作工具主要包括PPT、希沃白 板、Flash等，這些工具在表達(dá)如幾何構(gòu)造、動植物認(rèn)知、角色

3、扮 演對話等教學(xué)場景時，不能夠形成立體感效果。三維課件在這些應(yīng) 用場景下明顯優(yōu)于文本、圖像、音視頻、動畫制作的二維課件，對 低齡兒童的吸引力更勝一籌。三維課件具備較強(qiáng)的交互能力、真實的沉浸式體驗、生動的三 維表現(xiàn)力，符合低齡兒童的認(rèn)知規(guī)律，符合情景式教學(xué)要求，可以 更好的提高學(xué)生的學(xué)習(xí)積極性，是一種適合低齡兒童的教學(xué)展示平 臺。但目前很多三維引擎，大多數(shù)依賴于插件或是依附于一個巨大 的支持環(huán)境，這些外部條件很大的限制了三維課件的發(fā)展。歐美國家最早將三維技術(shù)應(yīng)用到基礎(chǔ)教育領(lǐng)域，由于三維技術(shù) 具有的直觀教學(xué)環(huán)境，讓學(xué)生擁有了更好的教學(xué)體驗,為基礎(chǔ)教育 發(fā)展改革提供了新模式。近年來,我國也加速基礎(chǔ)教

4、育領(lǐng)域內(nèi)的3D 技術(shù)應(yīng)用研究。為促進(jìn)我國3D教育的發(fā)展,教育部與國內(nèi)相關(guān)企 業(yè)合作，建立了三維教育研究中心，為中小學(xué)教師提供了大量三維 教學(xué)課件,這些資源給傳統(tǒng)教學(xué)模式提供了改革樣本，增加了教學(xué) 的互動性和創(chuàng)新性11o國內(nèi)的研究主要集中在以下幾個領(lǐng)域2,31：（1）3D課件，例如，基于Flash與Papervision3D技術(shù)的小學(xué) 英語課件的設(shè)計與研究；（2）虛擬現(xiàn)實、增強(qiáng)現(xiàn)實應(yīng)用，例如，基于X3D探究式虛擬 學(xué)習(xí)環(huán)境的設(shè)計與開發(fā)、基于增強(qiáng)現(xiàn)實的小學(xué)英語教學(xué)資源設(shè)計與 應(yīng)用研究、沉浸式虛擬現(xiàn)實在小學(xué)科學(xué)課的應(yīng)用研究、增強(qiáng)現(xiàn)實技 術(shù)在小學(xué)美術(shù)教學(xué)中的實踐研究；（3）3D教育游戲，例如，基于Co

5、cos2d-X引擎的小學(xué)數(shù)學(xué)教 育游戲巧玩形狀設(shè)計與開發(fā)、STEM理念下基于Unity3D的游 戲化學(xué)習(xí)環(huán)境設(shè)計與開發(fā)。1 Web3D技術(shù)Web3D技術(shù)的出現(xiàn)為3D教育注入了新的活力，為三維交互領(lǐng) 域提供了新的研究思路。Web3D是將Web技術(shù)與3D技術(shù)相融合 的一種新技術(shù)，是將三維技術(shù)的網(wǎng)絡(luò)化擴(kuò)展，其主要特征為實時渲 染、無限的交互性、虛擬現(xiàn)實性、網(wǎng)絡(luò)優(yōu)化壓縮等?；诖吮疚膶D1：系統(tǒng)整體實現(xiàn)流程使用一種應(yīng)用于Web端的無需依賴任何瀏覽器插件支持的WebGL 三維世界構(gòu)建技術(shù)4,5，用以構(gòu)建適用于低齡兒童的Web3D教育平 臺。目前國內(nèi)外Web3D的主流技術(shù)主要有VRML、X3D、 View

6、point、Flash Player、Shockwave3D、GoogleO3D、Java Applet 等。但是，早期的技術(shù)并不成熟。2014年萬維網(wǎng)聯(lián)盟制定了新的 HTML5標(biāo)準(zhǔn)，WebGL作為HTML5標(biāo)準(zhǔn)中的重要技術(shù)，為我們解 決了兩個難題：（1）在無需任何Web瀏覽器插件的支持下，它可以通過 JavaScript腳本程序?qū)崿F(xiàn)Web交互式三維動畫的制作；（2）它可以通過OpenGLES2.0圖形渲染庫實現(xiàn)圖形渲染。 基于此，本文主要采用WebGL構(gòu)建技術(shù)，搭建適用于低齡兒童的 Web3D教育平臺。2 Web3 D教育平臺搭建生動的3D模型對于6-12歲的低齡兒童的認(rèn)知刺激具有先天優(yōu) 勢

7、。同時，相對目前普遍使用的二維課件，基于三維的沉浸式虛擬 交互情景，可以提高學(xué)生的學(xué)習(xí)積極性，開發(fā)學(xué)生的創(chuàng)造性思維。 在選擇搭建教學(xué)場景時，主要針對二維課件不能夠很好表達(dá)的教學(xué) 內(nèi)容，例如學(xué)生在現(xiàn)實生活中很難接觸到的動植物認(rèn)知類教學(xué)以及 基于此的交互式問答。首先，根據(jù)Web3D教學(xué)場景內(nèi)展示的不同 動植物種類，生成與之對應(yīng)的三維模型進(jìn)行教學(xué)演示，其次，生成 各種難以程度的測試題目，根據(jù)題目內(nèi)容來匹配動植物三維模型， 利用Web3D教學(xué)場景中呈現(xiàn)的各種生動的三維虛擬模型，彌補(bǔ)學(xué) 生想象力和理解力方面的偏差。圖3: Web3D教育平臺中基于表情識別的自然人機(jī)交互技術(shù)路線圖Web3D教育平臺的搭建主

8、要分為兩個部分：（1）搭建供學(xué)生使用的沉浸式3D虛擬教學(xué)環(huán)境；（2）搭建供學(xué)生使用的3D答題環(huán)境。系統(tǒng)整體實現(xiàn)流程如圖1所示。選取Three.js作為研究所使用 WebGL框架，通過THREE.Js提供的模型裝載程序，將三維模型引 入到場景界面，呈現(xiàn)三維動畫效果。通過對頁面場景的燈光調(diào)控、 渲染器設(shè)置以及調(diào)用模型加載函數(shù)，最終在Web端構(gòu)造一個三維 虛擬場景。通過構(gòu)造能夠復(fù)用的組件，將虛擬課堂的功能模塊化。 系統(tǒng)的整體實現(xiàn)方案如圖2所示。3 Web3D教育平臺中基于表情識別的自然人機(jī)交互為實現(xiàn)教育過程中情感分析的快速檢測和實時分析，本文基于 深度學(xué)習(xí)提出了一種情感分析模型，該模型的核心內(nèi)容為表

9、情檢測 和表情識別。3. 1構(gòu)建課題所使用的面向教育場景的表情數(shù)據(jù)集制作的人臉表情數(shù)據(jù)集中，人臉表情樣本集需要多樣化，在基 于常見的7種表情數(shù)據(jù)（目前選擇的數(shù)據(jù)集是fer2013,后期會采 用更全面的emotionet數(shù)據(jù)集）中需要進(jìn)行更加細(xì)化的分類，初步 將表情分類為積極、非積極、中性這三個大類，除了常見的表情之外， 還需要定義符合教育情景的表情樣本?；趯ΜF(xiàn)存數(shù)據(jù)庫錄制流程 的研究，指定詳細(xì)的表情數(shù)據(jù)庫構(gòu)建方案，并基于該方案分類錄制 一套較為完整的表情數(shù)據(jù)庫進(jìn)行驗證，該數(shù)據(jù)庫包含二維RGB圖 片序列，還包括對應(yīng)幀的深度圖像，以及整個臉部的三維特征點數(shù) 據(jù)，該數(shù)據(jù)庫的構(gòu)建可以為后續(xù)表情檢測識

10、別提供數(shù)據(jù)支撐。3. 2算法相關(guān)在深入理解深度學(xué)習(xí)理論架構(gòu)的基礎(chǔ)上，學(xué)習(xí)并研究基于深度 學(xué)習(xí)的人臉表情識別方法，將自制的人臉表情訓(xùn)練樣本放入由深度 學(xué)習(xí)框架搭建的卷積神經(jīng)網(wǎng)絡(luò)（CNN）中提取圖像的深層特征，然 后通過softmax分類器進(jìn)行表情特征分類，最終通過Web端與服務(wù) 器之間的socket接口完成面部表情信息的實時傳送，針對與不同的 表情分類，需要定義不同的符合教育場景的人機(jī)互動模式。3. 3交互行為Web3D交互引擎與人臉表情識別算法的結(jié)合，應(yīng)用較為熟悉 的Web圖形引擎開發(fā)知識，搭建出一個簡單的教育平臺，并在該 界面中加入基于深度學(xué)習(xí)的人臉表情識別算法，用于提取特征并分 析當(dāng)前學(xué)生

11、的心理特質(zhì)并及時做出符合教育場景的自然交互行為。3. 4實現(xiàn)過程（1）制作適用于教育場景的多樣化人臉表情數(shù)據(jù)集；（2）將制作好的訓(xùn)練集放入設(shè)計好的CNN網(wǎng)絡(luò)進(jìn)行訓(xùn)練， 初步神經(jīng)網(wǎng)絡(luò)結(jié)構(gòu)包括兩個卷積層，兩個池化層，兩個全連接層， 并提高算法的識別準(zhǔn)確率；卷積運算是CNN模型構(gòu)建的基礎(chǔ)，在 CNN圖像處理過程中，卷積核依次與圖像的不同位置塊做卷積運 算得到輸出。卷積運算（二維）的基本定義為：ori = （X*m, n ） =* gm,=芝 立”=00 u=00其中W為我們的卷積核，X為我們的輸入?？偟膩碚f，CNN 本質(zhì)上是多層感知機(jī)（MLP）的一個變種：在全連接的基礎(chǔ)上，結(jié) 合稀疏連接的獨特優(yōu)勢，

12、通過在鄰接層（卷積層、池化層）的神經(jīng) 元之間使用局部連接方式來發(fā)現(xiàn)輸入特征在不同層級之間的相互關(guān) 聯(lián)，同時借助權(quán)值共享減少需要學(xué)習(xí)的參數(shù)數(shù)量。（3）將訓(xùn)練好的基于深度學(xué)習(xí)的人臉表情識別算法應(yīng)用到 Web3D端，實現(xiàn)利用人臉表情識別算法來控制頁端與用戶進(jìn)行交 互的WebGL多媒體智能交互引擎。（4）在Web端調(diào)用tensorflow.js降低Web端與服務(wù)器之間的 傳輸時延。Web3D教育平臺中基于表情識別的自然人機(jī)交互技術(shù)路線如 圖3所示。4 Web3D教育平臺中基于動作識別的人機(jī)交互將基于深度學(xué)習(xí)的人體動作識別算法應(yīng)用到基于WebGL的 Web3D智能教育教學(xué)交互平臺，摒棄以往鼠標(biāo)加鍵盤的僵

13、化人機(jī) 交互方式，轉(zhuǎn)而使用人體姿態(tài)估計來實現(xiàn)人機(jī)交互，通過GRU （門 控循環(huán)單元）訓(xùn)練及開源人體骨骼庫OpenPose等相關(guān)的技術(shù)，實 現(xiàn)人的軀干和四肢的識別跟蹤，從而達(dá)到在教學(xué)過程中不需要手動 輸入指令的自然人機(jī)交互，使學(xué)習(xí)者感受到智能交互帶來的參與感建立迪信Socket 傳回交互指令/獲取視頻流編碼、X base64轉(zhuǎn)碼二進(jìn)制數(shù)據(jù)流 傳送給服務(wù)器y兔于WebGL和Thr匏.js框婷構(gòu)建網(wǎng)頁三維平臺 y控制Web3D場景和模型實現(xiàn)智能人機(jī)交互圖4： Web3D教育平臺中基于動作識別的人機(jī)交互技術(shù)路線圖和沉浸感，增加學(xué)習(xí)樂趣。（1）深度動作識別：通過利用GRU門控循環(huán)單元模型，使用 Tens

14、orFlow框架，訓(xùn)練出自己的深度神經(jīng)網(wǎng)絡(luò)，之后，基于開源人 體骨骼庫OpenPose實現(xiàn)人體姿態(tài)識別。（2）Web3D交互引擎與動作識別算法的結(jié)合：應(yīng)用動作識別， 實時控制Web端的3D模型與場景，實現(xiàn)人機(jī)智能交互。將整個研 究內(nèi)容和系統(tǒng)應(yīng)用到Web3D教育平臺中，使學(xué)生在虛擬教學(xué)環(huán)境 中直接進(jìn)行交互學(xué)習(xí)，感受智能交互帶來的沉浸感和參與感。（3）實現(xiàn)過程：制作適用于教育場景的數(shù)據(jù)集。將制作好的訓(xùn)練集放入GRU深度神經(jīng)網(wǎng)絡(luò)進(jìn)行訓(xùn)練。將訓(xùn)練好的基于深度學(xué)習(xí)的動作識別算法應(yīng)用到Web3D端， 實現(xiàn)利用動作識別算法來控制前端與用戶進(jìn)行交互的Web3D智能 教育教學(xué)交互平臺。Web3D教育平臺中基于動作識別的人機(jī)交互技術(shù)路線如圖4 所示。最終學(xué)生交互界面三維場景呈現(xiàn)如圖5所示。其中主要包括教 學(xué)場景、問答場景。教學(xué)場景界面涉及相關(guān)模型介紹，這些內(nèi)容同 時也作為后續(xù)答題場景的知識鋪墊，整個答題場景除了答題框之外， 其余全部由3D模型構(gòu)成，學(xué)生可以通過鼠標(biāo)單擊及鍵盤錄入與機(jī) 器進(jìn)行交互過程，也可以利用動作識別，直接控制Web端3D場景 和模型，實現(xiàn)人機(jī)交互。人臉表情識別算法準(zhǔn)確的分析學(xué)習(xí)者的心 理情緒變化，并做出對應(yīng)