基于Kinect的唐卡圖像交互設(shè)計(jì)與實(shí)現(xiàn)

馬玉娟，劉曉靜

(青海大學(xué) 計(jì)算機(jī)技術(shù)與應(yīng)用系，青海 西寧 810016)

0 引 言

唐卡歷史悠久，是中國(guó)藏族優(yōu)秀傳統(tǒng)文化的一種繪畫藝術(shù)形式，其內(nèi)容保羅萬(wàn)象，包括西藏的文學(xué)藝術(shù)、藏醫(yī)藏藥等，展示了西藏地區(qū)的政治經(jīng)濟(jì)和人文環(huán)境，是人們了解西藏的有效途徑，被譽(yù)為“西藏的百科全書”。近年來(lái)，體感技術(shù)得到迅速發(fā)展。微軟的Kinect體感設(shè)備能夠?qū)崟r(shí)捕捉人體動(dòng)作、聲音等一系列信息，因其價(jià)格低廉、實(shí)用性強(qiáng)等特性深受研究者們的青睞，很多國(guó)內(nèi)外研究人員都選擇在此平臺(tái)上進(jìn)行開發(fā)和研究。2012年，Zhang詳細(xì)介紹了Kinect傳感器及其應(yīng)用效果；2015年，Péter Fankhauser等評(píng)估了Kinect v2深度傳感器在移動(dòng)機(jī)器人導(dǎo)航中的應(yīng)用。目前，林玲等建立了軌跡特征融合雙流模型對(duì)動(dòng)態(tài)手勢(shì)進(jìn)行識(shí)別；Feyziolu等將基于Xbox 360 Kinect的虛擬現(xiàn)實(shí)訓(xùn)練應(yīng)用到乳腺癌手術(shù)患者中，起到了比標(biāo)準(zhǔn)物理療法更好的治療效果；Assad-Uz-Zaman等開發(fā)了基于Kinect控制的NAO遠(yuǎn)程康復(fù)機(jī)器人，成功進(jìn)行遙控操作，指導(dǎo)和演示患者實(shí)時(shí)執(zhí)行不同的手臂運(yùn)動(dòng)鍛煉。

經(jīng)過(guò)多年的研究與開發(fā)，課題組已將Kinect體感技術(shù)應(yīng)用于計(jì)算機(jī)、醫(yī)療、教育等各大領(lǐng)域，但在弘揚(yáng)唐卡文化方面還未普及，如何以創(chuàng)新的思維方式將現(xiàn)代科技與傳統(tǒng)文化相結(jié)合，讓更多非藏族群眾了解這門藝術(shù)，并把唐卡文化發(fā)展為當(dāng)代受歡迎的藝術(shù)形式，讓更多人感受到藏族人民的時(shí)代精神，是一個(gè)重大的研究課題。相較于體感技術(shù)在其他領(lǐng)域的應(yīng)用發(fā)展，文中結(jié)合Kinect傳感器討論了體感交互在唐卡文化中的應(yīng)用，通過(guò)手勢(shì)控制的體感交互方式實(shí)現(xiàn)堆繡唐卡的堆繡操作，利用Kinect采集用戶深度數(shù)據(jù)、彩色數(shù)據(jù)等，根據(jù)Kinect SDK等中間插件進(jìn)行人體識(shí)別、手勢(shì)識(shí)別，利用手勢(shì)交互的方式完成堆繡操作，以掃描動(dòng)態(tài)二維碼的方式保存堆繡成品到個(gè)人移動(dòng)設(shè)備中。

1 需求分析與總體設(shè)計(jì)

1.1 需求分析

隨著時(shí)代的發(fā)展，熱愛唐卡的人不再局限于藏傳佛教僧侶和信徒，它成為了一件藝術(shù)品，甚至工藝品，被大眾推廣，出現(xiàn)在了眾多博物館、展廳、商店以及藝術(shù)愛好者的手中。隨著唐卡愛好者不斷增多，其傳承方式也應(yīng)隨之創(chuàng)新。單純的傳承和復(fù)制傳統(tǒng)唐卡技藝，只會(huì)讓唐卡藝術(shù)發(fā)展停滯不前。結(jié)合現(xiàn)代科技，繁榮唐卡文化，才能使其可持續(xù)發(fā)展。通過(guò)手勢(shì)體感交互、二維碼交互的方式了解、傳播唐卡文化，其代入感更加明確，體驗(yàn)度大大增加，能夠讓用戶以放松的心態(tài)、娛樂(lè)的方式認(rèn)識(shí)唐卡文化，體驗(yàn)唐卡文化的博大精深，具有較好的現(xiàn)實(shí)意義與推廣性。

1.2 總體設(shè)計(jì)

本研究以Kinect體感設(shè)備為數(shù)據(jù)輸入源，以Unity3D為開發(fā)工具，通過(guò)Kinect v2 Examples with MS-SDK中間插件來(lái)完成Kinect與Unity3D兩者間的連接。依據(jù)ZXing包生成并解析二維碼，利用UI界面截圖方式將手勢(shì)實(shí)現(xiàn)的堆繡作品上傳到服務(wù)器，并對(duì)返回的Json字符串進(jìn)行處理，得到的圖片鏈接后賦予二維碼，通過(guò)掃描二維碼的方式保存在個(gè)人移動(dòng)設(shè)備中。系統(tǒng)框圖如圖1所示。

系統(tǒng)架構(gòu)主要分為四部分：手勢(shì)堆繡、UI界面、二維碼實(shí)現(xiàn)以及判斷是否完成堆繡。

(1)UI界面。

UI界面主要分為三部分，選擇界面、堆繡界面和二維碼面板。本項(xiàng)目涉及到四幅堆繡唐卡圖，可以在選擇界面選擇自己喜歡的唐卡圖進(jìn)行堆繡。堆繡界面是實(shí)現(xiàn)堆繡功能的主界面，由四個(gè)堆繡界面組成，這四個(gè)界面除了堆繡圖以及元素不同，其他都保持一致。

圖1 系統(tǒng)架構(gòu)

(2)手勢(shì)堆繡。

手勢(shì)堆繡需要通過(guò)Kinect SDK將Kinect傳感器與PC相連接，采集用戶數(shù)據(jù)，利用Kinect SDK平臺(tái)進(jìn)行人體骨骼識(shí)別。在識(shí)別人體骨骼框架的基礎(chǔ)上進(jìn)行手勢(shì)識(shí)別，識(shí)別到的手勢(shì)數(shù)據(jù)在PC端匹配，根據(jù)所匹配手勢(shì)動(dòng)作的不同，分別實(shí)現(xiàn)手勢(shì)堆繡的不同操作。為了讓用戶的體驗(yàn)不受設(shè)備影響，本項(xiàng)目在實(shí)現(xiàn)手勢(shì)堆繡的同時(shí)，也實(shí)現(xiàn)了鼠標(biāo)堆繡。該文將重點(diǎn)介紹手勢(shì)堆繡的實(shí)現(xiàn)。

(3)二維碼實(shí)現(xiàn)。

二維碼實(shí)現(xiàn)分為三個(gè)步驟，待堆繡完成，首先將堆繡好的唐卡圖進(jìn)行屏幕的區(qū)域性截圖，并保存在本地，然后將保存到本地的截圖上傳到服務(wù)器，再根據(jù)返回的Json字符串將圖片信息賦值給生成的二維碼，完成掃碼存圖的功能。

(4)判斷是否完成堆繡。

堆繡面板中灰色元素代表待放置元素的線框，在堆繡元素拖動(dòng)過(guò)程中，通過(guò)位置判定的方式判斷是否放置正確。如果所拖動(dòng)的堆繡元素放置到對(duì)應(yīng)元素線框中，則該線框Bool值為True，否則為False。通過(guò)對(duì)元素框Bool值的判定以及完成按鈕是否被點(diǎn)擊的判定，判斷是否完成堆繡操作。判定為完成則彈出二維碼面板，否則返回界面，進(jìn)行后續(xù)操作。

2 系統(tǒng)架構(gòu)實(shí)現(xiàn)

2.1 UI界面

UI的設(shè)計(jì)與實(shí)現(xiàn)通過(guò)Unity3D軟件完成，利用C#腳本進(jìn)行控制。堆繡UI界面中的背景、堆繡主面板、堆繡元素面板均通過(guò)添加Image或Raw Image組件并為其Texture屬性賦值實(shí)現(xiàn)。將堆繡元素經(jīng)Photoshop黑白圖層處理，得到灰色元素線框。用Image組件將各個(gè)元素線框放置于對(duì)應(yīng)原圖像所在位置，遮蓋原位的彩色圖像，實(shí)現(xiàn)元素線框的展示。堆繡元素面板中的每一個(gè)元素實(shí)際都是一個(gè)按鈕，在UI界面中添加十個(gè)Button物體，并在其Source Image組件中分別賦值元素圖片，即可完成元素的顯示。堆繡界面如圖2所示。

圖2 堆繡界面

選擇UI的實(shí)現(xiàn)方式類同于上述堆繡UI的實(shí)現(xiàn)方式，不同之處在于四個(gè)選擇按鈕的Image是動(dòng)態(tài)的，選中狀態(tài)和未選中狀態(tài)展現(xiàn)不同的圖片，未選中的圖片沒有邊框，選中后的圖片用金色邊框修飾，同時(shí)用代碼控制放大選中圖片，放大倍數(shù)為1.1倍，起到突出選項(xiàng)的作用。選擇界面如圖3所示。

圖3 選擇界面

2.2 手勢(shì)堆繡

2.2.1 Kinect連接

本研究所使用的Kinect設(shè)備是新一代Kinect v2傳感器，與上一代Kinect v1相比,其視野更廣闊、視頻更高清、骨骼追蹤更精確,具有傳輸速度快、精確識(shí)別以及方便使用等特點(diǎn)，能夠滿足設(shè)計(jì)者的多種需求。傳統(tǒng)的彩色攝像頭對(duì)背景、光線等因素的要求較高，而Kinect v2傳感器對(duì)環(huán)境的適應(yīng)能力相對(duì)較強(qiáng)，為開發(fā)者們研究體感互動(dòng)提供了極大的便利。實(shí)現(xiàn)Kinect與Unity3D的連接，需要確保Kinect傳感器與電源集線器相連接，并且電源集線器要接電，之后將Kinect設(shè)備通過(guò)USB3.0連接到PC機(jī)上。在本機(jī)PC上安裝Kinect for Windows SDK v2.0，安裝好后，本機(jī)PC上會(huì)出現(xiàn)SDK Browser應(yīng)用，打開該應(yīng)用，啟動(dòng)Kinect Configure Verifier項(xiàng)，檢測(cè)設(shè)備是否連接成功。將Kinect For Windows Wrapper中間插件導(dǎo)入項(xiàng)目，并且添加Kinect Manager以及Kinect Gestures腳本于項(xiàng)目中的任意一個(gè)物體，實(shí)現(xiàn)Kinect與Unity3D的連接以及對(duì)Kinect的控制。

2.2.2 人體數(shù)據(jù)采集

Kinect能夠采集人體的多種數(shù)據(jù)，對(duì)人體進(jìn)行骨骼追蹤。其主要利用三個(gè)不同功能的攝像頭，分別進(jìn)行拍攝范圍內(nèi)深度數(shù)據(jù)、彩色數(shù)據(jù)的采集以及紅外檢測(cè)，采集到的人體數(shù)據(jù)如圖4所示。基于采集到的深度數(shù)據(jù)進(jìn)行骨骼數(shù)據(jù)計(jì)算，追蹤到人體的25個(gè)關(guān)節(jié)，識(shí)別人體動(dòng)作。對(duì)這些數(shù)據(jù)建立編程模型，在人體識(shí)別的基礎(chǔ)上實(shí)現(xiàn)手勢(shì)識(shí)別。

圖4 人體數(shù)據(jù)

2.2.3 手勢(shì)識(shí)別

手勢(shì)識(shí)別的主要依據(jù)就是提取特征參數(shù)，根據(jù)不同的特征參數(shù)對(duì)手勢(shì)進(jìn)行分類。手勢(shì)識(shí)別過(guò)程如圖5所示，需要在Kinect采集用戶骨骼數(shù)據(jù)的基礎(chǔ)上，添加Kinect Manager等組件，Kinect Manager功能多樣，它可以實(shí)現(xiàn)Kinect的初始化，完成數(shù)據(jù)采集工作還可以分析處理數(shù)據(jù)，并且定位到人體骨骼位置，將骨骼數(shù)據(jù)進(jìn)行輸出。由于Kinect Manager腳本已經(jīng)對(duì)Kinect采集到的數(shù)據(jù)進(jìn)行了處理，并將各個(gè)功能封裝成函數(shù)，在實(shí)現(xiàn)一些功能的時(shí)候，只需要訪問(wèn)Kinect Manager組件，獲取需要的方法或?qū)傩约纯伞Ｍㄟ^(guò)對(duì)其組件的控制，提取到手部骨骼參數(shù)，生成交互數(shù)據(jù)流，識(shí)別特定手勢(shì)，實(shí)現(xiàn)對(duì)應(yīng)操作。

編寫腳本，實(shí)現(xiàn)手勢(shì)控制功能，需要在腳本的Update函數(shù)里運(yùn)用IsInitialized語(yǔ)句判斷設(shè)備是否準(zhǔn)備好，如果準(zhǔn)備好，即返回結(jié)果為True，再運(yùn)用IsUserDetected函數(shù)判斷是否檢測(cè)到用戶。如果檢測(cè)到用戶，再運(yùn)用IsJointTracked函數(shù)判斷是否追蹤到用戶右手骨骼。順利追蹤到用戶右手骨骼后，運(yùn)用GetJointKinectPosition函數(shù)獲取用戶右手的世界坐標(biāo)，將獲取的世界坐標(biāo)通過(guò)Camera.main.WorldToScreenPoint()方法轉(zhuǎn)換為屏幕坐標(biāo)，然后再將轉(zhuǎn)換好的三維屏幕坐標(biāo)轉(zhuǎn)換為二維坐標(biāo)。之后，將此二維坐標(biāo)的位置賦予場(chǎng)景中設(shè)定好的手形圖標(biāo)，讓手形圖標(biāo)隨著用戶右手的移動(dòng)而移動(dòng)。因此，場(chǎng)景中手形圖標(biāo)的運(yùn)動(dòng)狀態(tài)即為用戶手勢(shì)的運(yùn)動(dòng)狀態(tài)。

圖5 手勢(shì)識(shí)別

activeInHierarchy函數(shù)判斷元素按鈕的激活狀態(tài)、RectangleContainsScreenPoint函數(shù)判斷手形圖標(biāo)位置是否在元素按鈕圖標(biāo)范圍內(nèi)。以上兩個(gè)條件都滿足時(shí)，可實(shí)現(xiàn)手勢(shì)拖動(dòng)后續(xù)操作。當(dāng)手勢(shì)狀態(tài)為Close(握拳)狀態(tài)，并且元素按鈕名稱為當(dāng)前拖動(dòng)元素名稱時(shí)，元素的父物體轉(zhuǎn)換為主面板，元素的位置時(shí)刻置為手勢(shì)圖標(biāo)的位置，完成手勢(shì)獲取元素功能。手勢(shì)狀態(tài)為Open(張開)狀態(tài)時(shí)，判斷手勢(shì)圖標(biāo)及拖動(dòng)元素是否在當(dāng)前拖動(dòng)元素的線框范圍內(nèi)，如果在線框范圍內(nèi)，則將當(dāng)前元素位置轉(zhuǎn)換為線框位置，完成放置正確元素吸附功能；如果不在線框范圍內(nèi)，元素父物體轉(zhuǎn)換為本身設(shè)定好的父物體，元素位置設(shè)置為本身父物體位置，將元素歸位。元素拖動(dòng)期間，倘若用戶丟失或者手勢(shì)丟失，同樣將元素歸位。手勢(shì)堆繡過(guò)程如圖6所示。

圖6 堆繡過(guò)程

通過(guò)訪問(wèn)Kinect Manager腳本組件，實(shí)現(xiàn)Kinect與Unity3D的連接，通過(guò)腳本的編寫，得到用戶的手勢(shì)信息，從而實(shí)現(xiàn)手勢(shì)交互的功能。手勢(shì)識(shí)別過(guò)程關(guān)鍵代碼如下：

//第1步：判斷設(shè)備是否準(zhǔn)備就緒。

bool IsInit=KinectManager.Instance.Is-Initialized();

//第2步：判斷是否檢測(cè)到用戶。

bool IsUser=KinectManager.Instance.I-sUserDetected();

//第3步：獲取用戶ID。

Long UserID=KinectManager.Instance.GetPrimaryUserID();

//第4步：檢測(cè)用戶右手骨骼。

bool HandRightSkel=KinectManager.

Instance.IsJointTracked(UserID,(int)KinectInt-erop.JointType.HandRight);

//第5步：獲取右手位置坐標(biāo)。

Vector3 RightHandPos=KinectManage-r.Instance.GetJointKinectPosition(UserID, (int)KinectInterop.JointType.HandRight);

//第6步：檢測(cè)右手手勢(shì)，執(zhí)行對(duì)應(yīng)操作。

KinectInterop.HandState RightHandState=KinectManager.Instance.GetRightHandSta-te(UserID);

if(RightHandState==KinectInterop.H-andState.

Closed)

{

print(“右手握拳”);

……

}

2.3 二維碼實(shí)現(xiàn)

2.3.1 屏幕截圖

場(chǎng)景中設(shè)置三個(gè)空物體，第一個(gè)物體位于主面板左下角，第二個(gè)物體位于主面板右下角，第三個(gè)物體位于主面板左上角。主面板的寬等于第二個(gè)物體的X坐標(biāo)減去第一個(gè)物體的X坐標(biāo)，主面板的高等于第三個(gè)物體的Y坐標(biāo)減去第一個(gè)物體的Y坐標(biāo)。創(chuàng)建一個(gè)RGB24位格、大小等于主面板寬高的Texture2D紋理，運(yùn)用ReadPixels函數(shù)讀取屏幕指定范圍內(nèi)的內(nèi)容到自定義的紋理當(dāng)中。執(zhí)行Apply函數(shù)保存紋理，運(yùn)用EncodeToPNG函數(shù)將紋理編碼為PNG格式，通過(guò)File.WriteAllBytes()函數(shù)將截圖以指定名稱保存到指定位置。

2.3.2 圖片上傳

用String字符串獲取截圖保存路徑，UnityWebRequest.Get()方法可獲取該路徑圖片的字節(jié)數(shù)組。開辟一個(gè)WWWForm類，運(yùn)用AddBinaryData函數(shù)在實(shí)例化的WWWForm中添加圖片的字節(jié)數(shù)據(jù)。通過(guò)網(wǎng)絡(luò)請(qǐng)求UnityWebRequest的Post方法，將圖片上傳到服務(wù)器。上傳成功后，服務(wù)器將返回Json字符串，返回的Json字符串中包含三個(gè)鍵值對(duì)，分別為code代碼、msg提示信息和data數(shù)據(jù)。data數(shù)據(jù)對(duì)應(yīng)的值為圖片上傳后的鏈接，通過(guò)Split字符串分割方法截取Json字符串中的圖片地址鏈接，保存到一個(gè)新的字符串中，以便后續(xù)二維碼展示過(guò)程中使用。

2.3.3 生成二維碼

ZXing由Java語(yǔ)言所實(shí)現(xiàn)，可以生成和解析二維碼，內(nèi)容開源，能夠?yàn)槠渌Z(yǔ)言提供接口，可以對(duì)各類條形碼進(jìn)行圖像處理。生成二維碼需要下載ZXing中的ZXing.unity.dll插件，導(dǎo)入U(xiǎn)nity3D項(xiàng)目中，提供生成二維碼的類庫(kù)，然后添加與二維碼相關(guān)的頭文件，引用ZXing和ZXing.QrCode命名空間。之后添加Color32類型的函數(shù)，實(shí)例化一個(gè)BarcodeWriter二維碼讀寫控件，設(shè)置二維碼格式和區(qū)域大小。生成二維碼后的效果如圖7所示。

圖7 二維碼面板

本研究的二維碼格式為QR_CODE，QR code格式的二維碼應(yīng)用比較廣泛，有著極其廣泛的編碼范圍和非常大的信息存儲(chǔ)量。調(diào)用Encode方法對(duì)圖片進(jìn)行二維碼生成，返回Color32數(shù)組，通過(guò)SetPixels32函數(shù)將返回的Color32數(shù)組設(shè)置到創(chuàng)建好的Texture2D紋理中。通過(guò)UI界面中添加一個(gè)Raw Image物體，并將生成的二維碼圖片紋理賦值給此物體，實(shí)現(xiàn)二維碼在UI界面中的展示。

3 實(shí)驗(yàn)結(jié)果

為驗(yàn)證本研究的可行性與有效性，文中進(jìn)行了指定距離范圍內(nèi)有效的拖動(dòng)堆繡元素的實(shí)驗(yàn)。指定距離指用戶與Kinect傳感器之間的距離，Kinect在1.5 m～2 m自身識(shí)別效果相對(duì)較好，因此實(shí)驗(yàn)距離范圍設(shè)定為1.5 m～2 m。選取5名測(cè)試者，平均身高為160.6 cm。每位測(cè)試者需要在這一距離段內(nèi)分別完成20次測(cè)試，并記錄對(duì)應(yīng)堆繡成功次數(shù)，共測(cè)試100次，完成本次實(shí)驗(yàn)，之后計(jì)算出不同距離段的平均有效率。指定距離段手勢(shì)拖動(dòng)元素的有效率如表1所示。

表1 有效率

實(shí)驗(yàn)測(cè)試結(jié)果顯示，文中在Unity3D中所實(shí)現(xiàn)的基于Kinect的唐卡圖像交互設(shè)計(jì)應(yīng)用是可行的，識(shí)別率較高，平均有效率高達(dá)93%，能夠有效地實(shí)現(xiàn)堆繡唐卡的堆繡操作。

4 結(jié)束語(yǔ)

本研究利用微軟公司的Kinect傳感器采集人體數(shù)據(jù)，以Unity3D軟件為開發(fā)平臺(tái)搭建人機(jī)交互界面，通過(guò)Kinect SDK等中間插件實(shí)現(xiàn)對(duì)人體的骨骼追蹤和識(shí)別。在人體骨骼識(shí)別的基礎(chǔ)上進(jìn)行手勢(shì)識(shí)別，再根據(jù)識(shí)別出的不同手勢(shì)進(jìn)行對(duì)應(yīng)的堆繡操作，并以掃描二維碼的方式保存堆繡作品，具有很好的交互性。實(shí)驗(yàn)結(jié)果表明，本研究能夠有效地實(shí)現(xiàn)堆繡唐卡的堆繡操作，相對(duì)于傳統(tǒng)的唐卡文化傳播方式，本研究能夠?qū)F(xiàn)代科技與傳統(tǒng)文化相結(jié)合，借助體感交互的趣味性，激發(fā)用戶對(duì)唐卡藝術(shù)的學(xué)習(xí)和探究欲，讓唐卡文化與時(shí)俱進(jìn)，推陳出新。

該文只涉及到了唐卡文化中的堆繡文化，而且只用到了體感交互中的手勢(shì)交互。因此，不論是唐卡文化的拓展，還是體感技術(shù)的推進(jìn)，都有很大的發(fā)展空間。