支持手勢識別的云黑板教學平臺研究與實現(xiàn)*

簡琤峰 陳嘉誠 任煒斌 張美玉

（浙江工業(yè)大學計算機學院，浙江杭州310023）

支持手勢識別的云黑板教學平臺研究與實現(xiàn)*

簡琤峰 陳嘉誠 任煒斌 張美玉

（浙江工業(yè)大學計算機學院，浙江杭州310023）

針對近幾年“云教育”和自主移動學習的應用發(fā)展存在的缺陷，在借鑒傳統(tǒng)課堂雙向交流教學模式優(yōu)點的基礎上，文章設計了支持移動終端手勢識別的云黑板教學平臺并給出了系統(tǒng)關鍵技術的實現(xiàn)方法。通過引入移動終端手勢識別的人機交互技術，模擬傳統(tǒng)教學黑板板書的方式，提供矢量的草圖交互繪制和臨摹，從而給自主移動學習教學平臺帶來了嶄新的用戶體驗。

移動終端；云黑板；手勢識別；教學平臺

引言

隨著云計算技術的發(fā)展及應用，遠程教育進入了“云教育”時代?！霸平逃痹诮换ゼ皡f(xié)作方面有著較大的進步，是對傳統(tǒng)遠程、在線教育的發(fā)展和延伸[1][2][3]。同時基于移動終端的自主學習模式也被廣泛推廣[4]，是“云教育”在移動終端應用領域的拓展形式。它通過移動終端，提供能隨時主動參與學習的服務。這樣的自主移動學習模式能體現(xiàn)學習者學習的主動性，使學習者能夠清楚認識到自身所學知識的動力所在，能培養(yǎng)學習者強烈的學習動機和濃厚的學習興趣。

本研究針對近幾年“云教育”的發(fā)展和自主移動學習的應用過程中存在的缺陷，研究并構建了一種支持移動終端手勢識別的“云黑板”教學平臺。該教學平臺具有支持模擬黑板交流、支持移動終端手勢識別和支持跨平臺多用戶在線實時參與三大特色。系統(tǒng)結合手勢識別，模擬黑板板書的方式，提供矢量的草圖交互繪制和臨摹，教師和學生實時使用“云黑板”進行教學交流，能充分發(fā)揮群體學習互動用戶體驗效果，能有效彌補當前遠程教育中移動教學平臺的不足，從而給自主移動學習教學平臺帶來嶄新的用戶體驗，對于現(xiàn)代遠程教育的探討和改進具有重要的應用參考價值。

一移動終端云黑板教學需求

現(xiàn)有的“云教育”在克服傳統(tǒng)教育劣勢的同時，也存在一些缺陷。一方面教師無法有效地引導和評估學生的進度和收益；另一方面學生相互之間存在交流隔閡，無法利用學生之間存在的差異性來激發(fā)個體主動參與的積極性[5]。而在傳統(tǒng)課堂教育中，黑板作為提供實時交流教學的載體，引導教師與學生之間以及學生與學生之間參與互動，為課堂教學帶來極大的便利。因此，“云黑板”就是對傳統(tǒng)課堂教學優(yōu)勢的一種有效繼承。

“云教育”中教師與學生之間的交互，可以被分成教師與設備之間、學生與設備之間的交互。所以，“云教育”中交互的實質就是人機交互。而現(xiàn)有的云教育系統(tǒng)一般通過鼠標點擊進行操作，需要教師頻繁中斷思路，也使得學生的注意力被轉移。所以，“云教育”需要更自然的交互方式（如手勢交互）。此外，現(xiàn)有的移動設備上存在的筆劃手勢識別，是將用戶在設備屏幕上繪制的筆劃識別為某種手勢命令，但是移動終端狹小的界面只能提供很差的用戶體驗。而基于視覺的手勢識別技術[6]可以很好地解決這一問題，它通過手機攝像頭獲取手勢的方式具有便捷性和適用面廣的優(yōu)勢。

綜合上述，“云黑板”教學關鍵在于如何以貼合人們習慣的人機交互方式將傳統(tǒng)課堂中的黑板教學應用于現(xiàn)有“云教育”中，而“云黑板”教學平臺技術實現(xiàn)的關鍵在于解決面向移動終端手勢識別的黑板板書技術。

二“云黑板”教學平臺關鍵技術的實現(xiàn)

在傳統(tǒng)的計算機輔助設計領域，手勢識別概念更多地歸屬于筆式交互技術范疇。利用筆劃手勢實現(xiàn)是將用戶繪制的筆畫識別為某種手勢命令（如拷貝、刪除、旋轉等命令），相關研究已應用于某些三維建模軟件中，具有比較成熟的理論基礎[7]。但是如果將這種筆劃手勢模式直接應用于移動終端，由于移動終端狹小的界面將導致很差的用戶體驗，根本無法發(fā)揮移動終端用戶體驗設計的優(yōu)勢。當前移動終端手勢識別的主流是基于視覺的手勢識別技術，通過手機攝像頭來識別手勢，具有便捷性和適用面廣的優(yōu)勢；但是，這種技術的缺陷在于無法精確定位識別，無法滿足草圖設計對精度的要求，因此，面向移動終端手勢識別的黑板板書技術的關鍵，在于如何取長補短發(fā)揮兩者的優(yōu)勢。該教學平臺通過對模擬黑板和手勢控制這兩個關鍵技術的研究和實現(xiàn)，較好地解決了上述問題。

1系統(tǒng)相關功能概述

（1）矢量圖形繪制

主要完成圖形對象的生成和相關參數的設置。圖形對象包括直線、圓、橢圓、矩形、任意曲線、貝塞爾曲線等。

（2）矢量圖形編輯

主要完成對圖形對象的編輯操作，如圖形的移動、刪除、縮放和設置圖形樣式等。

（3）三維草繪

該功能可實現(xiàn)三維繪圖功能?？稍谠撃Ｊ较吕L制任意曲線，通過旋轉、拉伸、平鋪、掃描等操作將其轉換為三維圖形，并可通過查看命令在不同視角觀察。

（4）手勢繪制與控制

該功能需要前端平臺系統(tǒng)或瀏覽器能夠很好地支持WebRTC。在客戶手勢功能開啟后，用戶可以通過手勢使用其它模塊的功能。

以上功能模塊的重點在于模擬黑板和手勢控制等關鍵技術的實現(xiàn)，將在以下兩個小節(jié)進行詳細描述。

2模擬黑板

（1）基礎功能

模擬黑板包含了矢量圖形繪制、編輯、三維草繪等模塊。相關的各種操作過程都會被同步顯示到其他用戶的模擬黑板上。對于模擬黑板本身，用戶們可以進行各種設置，如比例尺變換、操作的撤銷和恢復等。

（2）基礎功能的實現(xiàn)方法

用戶使用移動設備所看到的，事實上是一個Web頁面。它使用了HTM L5中的〈canvas〉標簽相關的各項API。它的三維繪制功能是使用了當前流行的three.js的開源WebGL庫。它使用Socket.IO在客戶端和服務器之間建立長鏈接，并由服務器將各用戶的操作進行廣播，以實現(xiàn)不同用戶之間的協(xié)同。

（3）實現(xiàn)方式的特點

從圖形對象的數據形式來講，所有的圖形對象使用統(tǒng)一的數據結構，主體為一個包含控制點的數組以及其它相關數據。統(tǒng)一的數據結構可以簡化數據傳輸和圖形捕捉等控制操作的實現(xiàn)。

從代碼布局角度來講，模擬黑板的各項功能都根據三個觸發(fā)事件進行布置。以移動設備觸摸事件為例，考慮三個觸發(fā)事件：Touchstart、Touchmove、Touchend。按照這三個事件，每個功能的實現(xiàn)都會相應地被分成三塊，由控制模塊進行調配——這種方式使得系統(tǒng)功能的增加和刪除更為快捷。

從模擬黑板的結構來講，它實際包含三層畫布，分別用于顯示已完成操作、正在操作、其他用戶操作的圖形。這樣可以保證在局部區(qū)域的圖形發(fā)生改變時，減少整個黑板的更新次數，從而提高性能。

3手勢控制

（1）研究方案

手勢識別算法的重點在于對手勢位置信息的確定。雖然手的形態(tài)在使用的過程中會不斷改變，但如果假設手在運動和變化的構成中始終保持掌心方向面對攝像頭，那么此時手的掌部外觀形態(tài)基本上可以保持前后狀態(tài)相似。由此，對于整個手勢位置的定位可以通過掌部區(qū)域定位。

手勢識別一直是計算機視覺領域的一個重大課題。手勢識別雖然已經發(fā)展了一定的時間，但是一直沒有被廣泛地應用，其原因就是定位和識別的精確度還不能滿足很多方面的需求。事實上，在很多時候這個問題可以通過數據手套[8]或多目攝像頭[9]來解決，但其應用成本和便利性是不容忽視的。對于移動終端而言，可以通過較為便利的方式進行處理。只需要能夠跟蹤到手的運動軌跡，系統(tǒng)就能根據手勢軌跡進行操作。因此，目前的手勢識別技術對于移動終端設備所需要的大部分操作都是可以實現(xiàn)的。接下來的幾個小節(jié)將對主要步驟進行詳細描述。

（2）膚色分割

通常攝像頭所拍攝的圖片都是RGB顏色模式，即以紅、綠、藍為三原色疊加產生各種顏色。然而在這種顏色模式下，亮度的變化會對膚色分割產生顯著的影響。所以，攝像頭拍攝到的手勢視頻的每一幀都將被轉換為YCrCb顏色模式。在這種模式下，色度和亮度會被分離，可以更好地進行膚色分割。其中，Y表示亮度，Cr表示光源中的紅色分量，Cb表示光源中的藍色分量。而RGB顏色模式向YCrCb顏色模式的轉換公式如下：

一般而言，人類膚色在這個顏色模式下處于一個范圍內，即133≤Cr≤173且77≤Cb≤127。根據這個標準，人手可能出現(xiàn)的位置范圍就可以被找到。

tracking.js是一個獨立的Javascript庫，它可以根據系統(tǒng)開發(fā)者設定的條件，在視頻中檢測是否存在符合條件的顏色塊。這里，它被用于檢測視頻中膚色區(qū)域，并從中選取手部所在區(qū)域。經過膚色分割后，視頻圖像經過了一次簡化，大部分非膚色區(qū)域都被排除。這樣使得后續(xù)步驟的計算效率可以獲得相應的提高。膚色分割對于背景也有一定的要求，即背景中不能存在或只存在少量膚色元素。這種方法的優(yōu)點在于條件明確，在使用時可以對不良條件進行回避。

（3）掌部定位

已經在人臉識別方面的應用中獲得認可的基于Haar特征[10]的級聯(lián)分類器算法，由于視頻中手的形態(tài)變化過大，在手勢定位和手勢識別的應用中并不像在人臉識別時那樣令人滿意。幸運的是，用戶們在使用移動設備時常常是手掌面對設備的攝像頭。所以，手的掌部區(qū)域形態(tài)被假設為保持不變或變化非常小。

這個算法需要預先準備大量的圖像作為樣本，然后對每個圖像提取Haar特征，再訓練出相應的基于閾值的弱分類器，進而獲得強分類器并將它們鏈接成為級聯(lián)分類器。整個訓練過程需要耗費大量時間。然而幸運的是，訓練之后獲得的分類器在運用時的效率較高，可以滿足“云黑板”教學平臺在效率方面的需求。

（4）手掌重心的定位

在獲得的掌部區(qū)域中，膚色像素的坐標點都已經可以被輕易地確定。這樣一來，手勢的掌部重心就可以根據下方這個公式進行計算：

其中，C（x,y）為重心坐標，Pi（x）為膚色像素點的橫坐標，Pi（y）為膚色像素點的縱坐標，N為膚色像素點的總數目。

（5）軌跡獲取

隨著手勢位置的不斷變化，掌部區(qū)域的重心位置也隨之改變，從而形成一條曲折的軌跡路線。使用手勢移動的方向變化情況來記錄手勢運動的軌跡，即軌跡描述序列。在每一次手勢重心的運動方向發(fā)生變化時，新的運動方向會被加入到軌跡描述序列中。在視頻中的手消失時，軌跡獲取進程結束，系統(tǒng)開始根據軌跡描述序列進行識別。

（6）指令編碼

軌跡描述序列記錄了手部區(qū)域運動方向的變化情況。事實上，這個描述序列能夠表達的指令數量，可以隨著系統(tǒng)預設基本方向的數量的增加呈指數型增長。例如，將上、下、左、右作為基本方向，即軌跡描述序列由這四個字符組成。那么，在假設軌跡描述序列的長度固定為3的情況下，軌跡描述序列能夠編碼的指令數量就已經有36條。

（7）懸停判斷

有時候，采用懸停判斷的方法可以提高某些指令的準確性，即判斷手勢是否在特定區(qū)域停留了一定的時間。這個方法需要掌部區(qū)域已經被定位。此時，如果手勢的掌部重心坐標記為那么隨著時間推移，視頻每一幀的重心坐標就可以組成一個序列，即。只要序列中有30個坐標點處于的鄰域內，那么這個手勢就可以被判斷為在這個位置停留了一定時間，所表示的含義可以是“選中目標，進入下一步操作”。

三實例

開發(fā)完的“云黑板”教學平臺系統(tǒng)1.0版已經可以基本實現(xiàn)預期效果。圖1展示了系統(tǒng)的草圖繪制展示功能，圖2展示了手勢三維控制功能，圖3展示了圖形對象縮放控制功能。

圖1 草圖繪制展示

圖2 手勢三維控制

圖3 圖形對象縮放控制

四研究總結

針對現(xiàn)代遠程教育模式所存在的弊端，本研究參考了傳統(tǒng)課堂教育模式中的優(yōu)勢，結合當前已有的“云教育”平臺，探討了“云黑板”的教學模式，實現(xiàn)了一種基于移動終端手勢識別的“云黑板”教學平臺。它能充分發(fā)揮群體學習互動的體驗效果，且能支持模擬黑板交流，具有面向移動終端的手勢識別功能。它提供了矢量草圖交互繪制和編輯功能，并使施教者和受教者們實時使用“云黑板”進行教學交流。因此，本研究使遠程教育模式在一定程度上繼承了傳統(tǒng)課堂模式的優(yōu)點，滿足了遠程教育模式下對于角色區(qū)分的需求，使得教學管理者和施教者能夠有效地引導、評估學習者的進度和收益。本研究的另一項主要貢獻，是在遠程教育中引入新的交互方式，即使用面向移動終端的手勢識別技術進行交互。這種方式使學習者能更好地使用移動設備，從而更好地與其他學習者進行互動。系統(tǒng)涉及移動Web網頁矢量圖形繪制、移動終端手勢識別等技術，充分考慮了跨平臺性、人機交互便利性等需求，可以有效地彌補當前移動教學平臺的不足，對于遠程教育模式的進一步研究具有重要的實際參考價值。

[1]馮立國,楊孝堂.遠程開放教育課程教學設計的模式框架[J].中國電化教育,2011,(9):53-60.

[2]孫立會.開放教育基本特征的變遷——兼議MOOC之本源性問題[J].遠程教育雜志,2014,(2):30-38.

[3]李國斌.現(xiàn)代遠程教育公共服務體系的構建與實踐——以中央廣播電視大學現(xiàn)代遠程教育公共服務體系為例[J].現(xiàn)代教育技術,2015,(11):73-78.

[4]劉剛,胡水星,高輝.移動學習的“微”變及其應對策略[J].現(xiàn)代教育技術,2013,(12):34-41.

[5]胡凡剛,仇秀娟,劉瑋,等.影響教育虛擬社區(qū)中學習動機激發(fā)因素的實證分析[J].遠程教育雜志,2013,(4):52-59.

[6]Panwar M.Hand gesture recognition based on shape parameters[A].In:Institute of Electrical and Electronics Engineers.International Conference on Computing,Communication and Applications[C].Dindigul,Tamilnadu,India: Institute of Electrical and Electronics Engineers,2012:1-6.

[7]徐禮爽,田豐,呂菲,等.在線雙向適應的筆手勢界面框架研究[A].《計算機工程與科學》編輯部.中國計算機圖形學進展2008——中國計算機圖形學大會[C].長沙:《計算機工程與科學》編輯部,2008:1100-1109.

[8]馮志全,楊波,鄭艷偉,等.基于用戶行為分析的手勢跟蹤方法[J].軟件學報,2013,(9):2101-2116.

[9]郭康德,張明敏,孫超,等.基于視覺技術的三維指尖跟蹤算法[J].計算機研究與發(fā)展,2010,(6):1013-1019.

[10]Mei K,Xu L,Li B,et al.Areal-time hand detection system based on multi-feature[J].Neurocomputing,2015,(158):184-193.

編輯：小西

Research and Implementation of Cloud-blackboard Teaching Platform with Gesture Recognition

JIAN Cheng-feng CHEN Jia-cheng REN Wei-bin ZHANG Mei-yu
(Computer Science and Technology College,Zhejiang University of Technology,Hangzhou,China 310023)

Aiming at the defects in the“cloud education”and the application of autonomous mobile learning in recent years,a cloud-blackboard teaching platform with mobile terminal gesture recognition was proposed and the key techniques to realize this system was also provided based on the advantage of teaching mutually in traditional classroom. By introducing the human computer interaction technology of mobile terminal gesture recognition,and simulating the blackboard writing way of traditional teaching,this systemcould provide interactive rendering and copy for the vector image,bringing new user experience to autonomous mobile learning teaching platform.

mobile terminal;cloud-blackboard;gesture recognition;teaching platform

G 40-057

A【論文編號】1009—8097（2016）12—0106—06【DOI】10.3969/j.issn.1009-8097.2016.12.016

本文受國家自然基金面上項目“面向設計意圖在線交換的語義云粒元重組方法研究”（項目編號：61672461）、國家自然基金面上項目“圖像與視頻的不變性局部結構特征描述及應用研究”（項目編號：61672463）資助。

簡琤峰，副教授，博士，研究方向為云計算、CAD，郵箱為jianc f@zjut.edu.cn。

2016年4月23日