張俊坤,何漢武,吳悅明,莫建清,李 健,鄢 鑫
(廣東工業(yè)大學 機電工程學院,廣東 廣州 510006)
遠程指引已經(jīng)成為遠程作業(yè)不可忽視的一個重要環(huán)節(jié),傳統(tǒng)的遠程指引是基于語音或視頻進行指導,然而僅音頻和視頻信息的交流在遠程任務的指導過程中,由于遠程專家對現(xiàn)場情況的了解不足,會導致產(chǎn)生不精確的引導指令[1]。
目前,由于中國的辦稅服務種類多,且部分辦稅流程較為復雜,當辦稅人員對稅務網(wǎng)頁操作流程不熟悉時,需要財稅專家對其指引辦稅,而傳統(tǒng)的遠程指引技術(shù),無法將辦稅人員的意圖準確傳送給遠程專家。隨著虛擬現(xiàn)實技術(shù)的崛起,人們通過結(jié)合增強現(xiàn)實大大增強了遠程專家對用戶真實世界的感知,遠程專家可以通過注釋用戶的視圖、視覺、聽覺或觸覺提示來指引用戶操作[2,3]。為了增強對用戶現(xiàn)實世界的感知,Gao L等[4]和El Ammari K等[5]分別提出了基于增強現(xiàn)實的遠程指引系統(tǒng)。以及Thammathip Piumsomboon等提出了一種CovAR的遠程協(xié)作系統(tǒng)[6]。此外,Theophilus Teo等[7]、Michael Spitzer等[8]、Martin Reinoso等[9]和Lien KC等[10]等均提出了基于圖像的增強現(xiàn)實遠程協(xié)助系統(tǒng),遠程專家通過攝像頭或AR眼鏡采集的視頻流來感知用戶現(xiàn)場的狀況,并利用在2D草圖的注釋指引用戶進行操作,但應用在辦稅場景,共享視頻流容易受到顯示清晰度和網(wǎng)絡帶寬的限制。文獻[11-13]則提出了通過手勢和投影注釋的方法對用戶進行指引的AR遠程指引系統(tǒng)。
基于上述的研究,本文提出一種面向辦稅輔助的遠程AR專家指引系統(tǒng),該系統(tǒng)通過遠程專家端的應用程序?qū)崟r同步用戶的稅務頁面,并讓遠程專家通過2D注釋和語音指導用戶操作,解決用戶的辦稅疑難問題。
隨著電子辦稅業(yè)務的興起,用戶通過稅務網(wǎng)頁進行相應的辦稅工作,如發(fā)票查詢、申報征收、企業(yè)稅納稅等業(yè)務。辦稅業(yè)務需要用戶進行在網(wǎng)頁上大量的信息填寫,且必須按照業(yè)務流程嚴格操作,否則無法辦理成功。因此,用戶需要向財稅專家請求遠程指引,通過專家的指引操作完成辦稅工作。
目前,辦稅的遠程指引主要有兩種方式:傳統(tǒng)的語音交流和視頻講解的方式,這兩種方式在辦稅遠程指引中會存在以下的問題。
(1)感知不全面:若只通過語音交流,遠程專家無法感知用戶辦稅場景,只能通過與用戶之間的語言交流,而通過視頻指引往往只能讓遠程專家看到部分場景,無法看清問題全貌。
(2)存在歧義性:無論是語音指引或視頻指引,語言的交流是整個遠程指引的基礎,但通過語言之間的交流,容易產(chǎn)生語言歧義性。
(3)工作效率低:遠程專家需要花費一定的時間了解用戶的問題所在,并運用自己的專業(yè)知識進行遠程指引,指引用戶往往只能通過語言的交流進行指引,視頻無法進行太多指引操作,因此需要花費更多的時間在指引上。
針對上述問題,設計了一個面向辦稅輔助的遠程AR專家指引系統(tǒng)。下面將對遠程指引系統(tǒng)的總體框架進行闡述。
為了讓遠程專家能直接查看用戶當前網(wǎng)頁場景,直觀的給用戶進行操作指引,以解決用戶的辦稅疑難問題,本文提出一種面向辦稅的遠程AR專家指引系統(tǒng)。圖1為本文提出的遠程AR專家指引系統(tǒng),在該系統(tǒng)中,用戶佩戴AR眼鏡在PC瀏覽器上進行辦稅作業(yè),當本地用戶請求幫助時,遠程專家客戶端會接收到用戶當前稅務網(wǎng)頁數(shù)據(jù),并通過網(wǎng)頁還原技術(shù)同步用戶網(wǎng)頁頁面;最終遠程專家將使用客戶端中2D注釋模塊和語音模塊進行指導用戶操作。
遠程AR專家指引系統(tǒng)主要分為3個部分,用戶PC瀏覽器端、AR眼鏡和遠程專家客戶端。用戶PC瀏覽器端負責采集用戶稅務頁面信息;AR眼鏡為用戶顯示遠程專家的虛擬指引信息;遠程專家客戶端是指引系統(tǒng)中最關(guān)鍵的一部分,通過客戶端專家可以查看用戶當前網(wǎng)頁,并使用2D注釋和語音模塊指引用戶進行辦稅;這3個部分通過中間服務器連接在一起,進行數(shù)據(jù)之間的傳輸,完成遠程指引。
為了讓遠程專家能將本地用戶的網(wǎng)頁還原出來,需要采集用戶的稅務網(wǎng)頁數(shù)據(jù),包括有URL和HTML源碼等數(shù)據(jù),本文使用Chrome瀏覽器的Tampermonkey插件對用戶的網(wǎng)頁數(shù)據(jù)進行獲取。Tampermonkey是用于運行用戶腳本的瀏覽器擴展插件,通過該插件可以使用戶自由地添加和使用Javascript腳本進行修改或獲取網(wǎng)頁的數(shù)據(jù)。因此,本文通過添加獲取網(wǎng)頁URL和HTML源碼的Javascript腳本到Tampermonkey插件上,并運行此腳本,當用戶請求遠程指引時,運行在Tampermonkey插件上的腳本會采集當前網(wǎng)頁的URL和HTML,并將數(shù)據(jù)通過Ajax(asynchronous java-script And XML)技術(shù)上傳到服務器中應用程序,服務器最終將網(wǎng)頁數(shù)據(jù)發(fā)送到遠程專家客戶端上。
本系統(tǒng)中使用的AR眼鏡是采用微軟公司的Hololens眼鏡,Hololens眼鏡是一臺完全獨立的Window 10計算機,用戶可以通過凝視、手勢和聲音與Hololens進行交互。Hololens支持Unity平臺開發(fā)應用程序,因此本文通過Unity平臺開發(fā)出一個能顯示遠程專家指引信息和能進行語音交互的Hololens應用程序,通過此應用程序,當遠程專家做出指引時,本地用戶的Hololens眼鏡可以實時接收到指引信息,并與現(xiàn)實的PC上的網(wǎng)頁進行虛實融合,能直觀看到遠程專家的指引信息。圖2是用戶佩戴Hololens眼鏡看到的指引信息效果圖。
圖2 用戶佩戴Hololens眼鏡看到的指引信息
為了查看用戶當前稅務頁面,并對用戶進行遠程指引,遠程專家客戶端需要對用戶稅務網(wǎng)頁還原,且使用2D注釋和語音對用戶進行指引。遠程專家客戶端是運行在PC上的應用程序,因此本文通過WPF (Windows presentation foundation)技術(shù)開發(fā)遠程專家客戶端軟件。WPF是基于微軟.NET平臺的Windows圖形顯示系統(tǒng),能將界面設計與邏輯程序設計分離,前臺界面設計使用基于XML擴展的XAML語言,后臺業(yè)務邏輯控制使用C#語言,且具有豐富的繪圖模型,不需要逐像素繪制圖形。因此選擇WPF技術(shù)能更快速地開發(fā)遠程專家客戶端。
根據(jù)系統(tǒng)的功能需求,遠程專家客戶端主要任務是實現(xiàn)用戶的稅務網(wǎng)頁還原、2D注釋標注和語音交流等功能。本文所設計的遠程專家客戶端總體框架如圖3所示,其功能主要可分為網(wǎng)絡通信、網(wǎng)頁還原、2D注釋和語音會話等4個部分。
圖3 遠程專家客戶端框架
(1)網(wǎng)絡通信:遠程專家客戶端通過使用Microsoft ASP.NET下的SignalR實時框架與用戶瀏覽器端及AR眼鏡進行通信,SignalR技術(shù)可以創(chuàng)建一條底層的連接并保持該連接的永久開放,若連接斷開或需要重新連接,會自動對連接的斷開和重新連接進行管理。因此通過SignalR實時框架,可以保證在遠程指引過程中通信的穩(wěn)定。
(2)網(wǎng)頁還原:為了將用戶網(wǎng)頁還原到遠程專家客戶端上,需要將網(wǎng)頁中的資源下載到本地,比如圖片、文字、層疊樣式表和javascript腳本等,因此需要提取HTML源碼的資源路徑,將這些資源下載到本地,并將HTML源碼中資源路徑替換成本地的資源路徑,最后保存新的HTML源碼,完成網(wǎng)頁還原。
(3)2D注釋:2D注釋模塊主要包括有繪圖模塊和文字提示信息模塊。繪圖模塊包括有畫筆、選擇和橡皮擦有3種繪圖工具,當遠程專家進行繪圖時,可以選擇不同的繪圖工具進行繪制,如專家使用畫筆工具可以選擇不同的形狀去繪制指引信息;使用選擇工具下可以自由選定繪制的圖形,并且可以移動選定的圖形;橡皮擦工具可以擦除繪制錯誤的圖形。文字提示信息模塊可以讓遠程專家輸入相應的文字提示信息對用戶進行指導。
(4)語音會話:語音會話模塊可以讓遠程專家與用戶一直保持語音的交流,通過語音交流可以讓用戶更好理解遠程專家的指引信息,遠程專家還可以通過語音控制按鈕控制揚聲器音量大小和麥克風音量大小,為雙方提供更舒適的交流環(huán)境。
傳統(tǒng)的辦稅遠程指引需要通過電話語音或視頻無法充分感知用戶當前稅務網(wǎng)頁的疑難問題,導致大部分時間花費在問題溝通上,影響了工作效率。相比起電話語音交流,基于視頻的遠程指引方式能較好理解雙方的意圖,但只能遠程查看指定的區(qū)域,對于較大場景的工作環(huán)境,視頻遠程指引方式很難得到很好的效果,缺少一定的靈活性,而且對網(wǎng)絡要求較高。因此為了讓遠程專家能查看用戶當前稅務網(wǎng)頁的疑難問題,并當用戶網(wǎng)頁改變時,仍能對用戶改變后的網(wǎng)頁進行查看,本文提出基于HTML DOM的網(wǎng)頁信息采集,通過HTML DOM技術(shù)對用戶當前稅務頁面的信息進行采集,以便同步用戶當前的網(wǎng)頁頁面,讓遠程專家對用戶做出相應的指引操作。
稅務網(wǎng)頁的本質(zhì)是HTML文檔,其中HTML文檔內(nèi)包括了文本、圖片、多媒體、輸入框、按鈕和框架等元素,每個網(wǎng)頁元素都有自己的屬性和方法。DOM(document object model)提供了對網(wǎng)頁元素的訪問模型,將HTML文檔內(nèi)的元素描述成以html元素為根節(jié)點的DOM樹結(jié)構(gòu),網(wǎng)頁上的其它元素則作為DOM樹上子節(jié)點。通過HTML DOM樹結(jié)構(gòu),可以輕松訪問任意節(jié)點上的內(nèi)容和屬性。例如可通過下列代碼獲取輸入框中內(nèi)容,其中inputId表示輸入框元素的id屬性。
var input =document.getElementById(“inputId”); //獲取輸入框元素
var value=input.value; //獲取輸入框內(nèi)容
為了實現(xiàn)遠程財稅專家實時了解用戶當前稅務網(wǎng)頁的問題狀況,網(wǎng)頁信息量和信息準確度對整個系統(tǒng)的性能起著至關(guān)重要的作用。遠程專家客戶端同步用戶網(wǎng)頁內(nèi)容需要的關(guān)鍵數(shù)據(jù)是用戶當前稅務網(wǎng)頁URL、網(wǎng)頁HTML源碼、網(wǎng)頁滾動位置和HTML元素的狀態(tài)信息等。下列是稅務網(wǎng)頁信息基于HTML DOM的具體獲取方法。
網(wǎng)頁URL:當前稅務網(wǎng)頁的基準URL,通過window. location.href獲取。
網(wǎng)頁HTML源碼:當前稅務網(wǎng)頁的文檔的HTML源代碼,通過document.documentElement.outerHTML獲取。
網(wǎng)頁滾動條位置:網(wǎng)頁滾動條有上下滾動條和左右滾動條,上下滾動條通過document.documentElement.scrollTop獲取,左右滾動條則通過document.documentElement. scrollLeft獲取。
網(wǎng)頁HTML元素:當網(wǎng)頁上的元素狀態(tài)發(fā)生改變時,可能會引起頁面或HTML源碼的改變,如點擊按鈕,鼠標提留在某一元素上、輸入框內(nèi)容輸入等引起元素狀態(tài)改變的行為都有可能改變稅務頁面或HTML源碼。HTML元素一般通過元素ID、指定標簽名稱和指定類名進行獲取。通過getElementById(“元素ID”)、getElementsByTagName(“元素標簽名”)和getElementsByClassName(“元素類名”)進一步獲取HTML元素的屬性和事件。
當前傳統(tǒng)的基于音頻或視頻信息的遠程指引方法無法及時解決用戶在電子辦稅場景的問題,基于增強現(xiàn)實的視頻、手勢不太利于在電子辦稅場景指引,因此本文提出基于2D注釋的遠程指引方法。當用戶網(wǎng)頁經(jīng)過解析還原后,遠程專家客戶端顯示還原后的網(wǎng)頁,并在網(wǎng)頁上通過繪圖工具繪制2D的圖形注釋,最后將注釋信息通過網(wǎng)絡通信發(fā)送到用戶的Hololens眼鏡,在眼鏡中呈現(xiàn)遠程專家的指引信息。其中,網(wǎng)頁控件與畫布控件的定制、繪圖模塊開發(fā)和2D注釋的AR顯示是遠程指引的關(guān)鍵內(nèi)容。
4.1.1 網(wǎng)頁控件
目前在WPF開發(fā)中都是通過嵌入WebBrowser瀏覽器實現(xiàn)網(wǎng)頁顯示,但WebBrowser瀏覽器控件基于低版本的IE Core,對于HTML5和Js文件加載存在兼容性問題,且其界面效果較為簡單粗糙。遠程專家客戶端中的網(wǎng)頁顯示是通過嵌入CefSharp網(wǎng)頁瀏覽器實現(xiàn)的,CefSharp是基于Chromium Embedded Framework,是Google Chrome的開源版本,具有用于WPF應用程序的瀏覽器控件,支持HTML5、JavaScript、CSS3等元素。使用CefSharp瀏覽器控件首先需要下載CefSharp.dll、CefSharp.Core.dll和CefSharp.Wpf.dll,將這3個動態(tài)鏈接庫添加至當前工程,在XAML文件中實例化CefSharp中的ChromiumWebBrowser類,并進行初始參數(shù)的設置即可正常顯示網(wǎng)頁。
4.1.2 畫布控件的定制
為了能在網(wǎng)頁上繪制指引信息,需要在網(wǎng)頁顯示區(qū)上方添加透明的畫布,遠程專家客戶端使用WPF中InkCanvas畫布進行實現(xiàn),通過InkCanvas可以輕松實現(xiàn)各種筆形的繪圖,以及圖形的修改擦除。使用InkCanvas畫布需要引用System.Windows.Controls命名空間,本文通過繼承InkCanvas類自定義畫布CustomInkCanvas類,通過CustomInkCanvas類可以自定義畫布中的筆畫參數(shù)、樣式和事件。圖4為CustomInkCanvas類的UML類圖。
圖4 CustomInkCanvas類的UML類圖
CustomInkCanvas類的屬性主要有:
(1)cdRenderer:用于動態(tài)繪制筆畫墨跡,并將其呈現(xiàn)在畫布上;
(2)strokeParameter:線條筆畫的參數(shù),用于畫布呈現(xiàn)多種樣式的線條。
CustomInkCanvas類的方法主要有:
(1)CustomInkCanvas():CustomInkCanvas的帶參構(gòu)造方法,用于初始化畫布;
(2)OnStrokeCollected():用于將用戶剛完成的筆畫添加到畫布中。
為了讓遠程專家能做出多樣化的指引信息,遠程專家客戶端的繪圖模塊包括有繪圖工具、筆畫形狀和筆畫樣式,其中繪圖工具包括有畫筆工具、選擇工具和擦除工具;筆畫樣式包括筆畫粗細、筆畫虛實和筆畫顏色等;筆畫形狀有直線、曲線、矩形和橢圓4種形狀。
4.2.1 繪圖工具
繪圖工具的選擇是通過改變CustomInkCanvas類對象的EditingMode屬性實現(xiàn),EditingMode屬性繼承CustomInkCanvas的父類InkCanvas,表1是EditingMode屬性值對應的繪圖工具和功能,其中繪圖模塊的擦除工具是按筆畫擦除,EditingMode屬性值為EraseByStroke,當遠程專家沒有選擇任何工具,則將EditingMode屬性值置為None,不做任何操作。
表1 EditingMode屬性值對應的繪圖工具和功能
4.2.2 筆畫樣式與形狀
筆畫樣式和形狀都屬于筆畫的屬性,若要在WPF中使畫布呈現(xiàn)筆畫需要使用Stroke類,Stroke類需要引用System.Windows.Ink命名空間,為了實現(xiàn)筆畫的定制,通過直接繼承Stroke類實現(xiàn)自定義筆畫CustomStroke類,并重寫Stroke類的DrawCore()方法。為了實現(xiàn)不同樣式和形狀的筆畫,StrokeParameter類聚合了LineType類、GraphicType類和BrushType類3個枚舉類。LineType類表示筆畫的虛實類型;GraphicType類表示筆畫的形狀類型;BrushType類表示畫筆的類型,不同畫筆類型可以繪制出不同效果的筆畫。其中筆畫粗細與顏色通過StrokeParameter類的strokeWidth和strokeColor屬性實現(xiàn)。圖5為筆畫各類之間的UML類圖。
圖5 筆畫類之間的UML類圖
當遠程專家繪制完2D標注信息,需要將標注信息在用戶Hololens眼鏡上顯示。為了能讓用戶Hololens顯示指引信息,需要將2D注釋的坐標信息發(fā)送到用戶Hololens眼鏡上,2D注釋在畫布上是由許多個點組成,每一個點都有一對坐標值,坐標值是由X(橫坐標)和Y(縱坐標)構(gòu)成,當遠程專家繪制比較多的2D指引信息,需要將大量的坐標值對發(fā)送到用戶Hololens眼鏡,大量的坐標值對會占用更長的網(wǎng)絡傳輸時間,且使AR眼鏡CPU處理時間過長。因此,本文通過選擇性減少坐標值對的方法進行優(yōu)化,當2D注釋的筆畫形狀類型為直線(Line)、矩形(Rectangle)和橢圓(Ellipse),只需要將3種形狀的筆畫起始點坐標值和形狀類型通過網(wǎng)絡傳輸?shù)接脩鬑ololens眼鏡上,并使用Hololens內(nèi)置的繪圖API方法重新繪制即可。為了保證曲線的完整性,曲線(Curve)的筆畫則需要將所有采樣點的坐標值傳輸過去,并在Hololens眼鏡應用上重新連接所有的采樣點,最后Hololens眼鏡通過三維注冊技術(shù)將2D注釋和文字提示信息準確疊加在用戶電腦屏幕的網(wǎng)頁上。
實例場景:為了讓AR眼鏡顯示效果良好,用戶在黑色背景的辦稅房進行辦稅,電腦顯示器正放在用戶正前方,用戶使用鼠標與鍵盤進行辦稅服務。圖6是用戶辦稅的環(huán)境。
圖6 用戶辦稅環(huán)境
遠程專家則在PC使用遠程專家客戶端使用2D注釋和語音對用戶指引,遠程專家客戶端如圖7所示。遠程專家客戶端界面可分為語音會話、繪圖模塊、網(wǎng)頁和繪圖顯示區(qū)、語音控制和文字信息等5個部分,遠程專家通過繪圖模塊中的繪圖工具在網(wǎng)頁和繪圖顯示區(qū)上進行繪制2D注釋,并在文字信息模塊輸入相應的辦稅提示信息,輔助用戶理解指引信息。
圖7 遠程專家客戶端
AR硬件:Microsoft公司的第一代Hololens眼鏡。
軟件運行環(huán)境:遠程指引系統(tǒng)需要同時運行用戶PC端Chrome瀏覽器中的Javascript腳本、Hololens眼鏡應用和遠程專家客戶端,為了避免網(wǎng)絡堵塞造成的不利影響,各軟件都運行在同一個局域網(wǎng)內(nèi),表2是遠程AR專家指引系統(tǒng)中各軟件的運行環(huán)境。
表2 遠程AR專家指引系統(tǒng)中各軟件的運行環(huán)境
本文以遠程指引發(fā)票查詢?yōu)槔?,通過遠程專家客戶端指引用戶進行發(fā)票查詢。具體形式是在用戶在PC上使用Chrome瀏覽器打開稅務網(wǎng)頁,并通過語音請求遠程指引,遠程專家打開遠程專家客戶端軟件繪制2D注釋指引用戶進行發(fā)票查詢。
遠程專家使用繪圖模塊的工具在網(wǎng)頁和繪圖顯示區(qū)進行繪制,底部的文字信息區(qū)域可以輸入文字提示信息,最后點擊右下角的發(fā)送按鈕即可將2D標注信息發(fā)送至用戶的Hololens眼鏡上。
下面依次對遠程專家客戶端中的網(wǎng)頁與繪圖顯示、繪圖模塊以及2D注釋在AR中的顯示進行驗證:
(1)圖8(a)、圖8(c)和圖8(e)是PC上遠程專家客戶端軟件的運行截圖,圖中網(wǎng)頁與繪圖顯示正常,能進行正常的繪圖工作。本次實驗中遠程專家分別對繪圖模塊的4種形狀進行測試,并輸入了相關(guān)的文字提示信息,以圖8(c)為例,專家使用了橢圓形狀的筆畫標記了發(fā)票查詢頁面上的第一個輸入框,并輸入了“輸入您的發(fā)票代碼”文字提示信息;
(2)圖8(b)、圖8(d)和圖8(f)是用戶Hololens眼鏡運行狀態(tài)的截圖,使用Hololens自帶的攝像頭進行截圖,因Hololens攝像頭只有230萬像素,截圖無法看清網(wǎng)頁上文字,但仍能看到遠程專家繪制的2D注釋能在Hololens上正常顯示,且2D注釋與網(wǎng)頁的相對位置坐標正確,遠程專家的文字提示信息則顯示在專家語提示框中。以圖8(d)為例,在用戶Hololens視角中,橢圓形狀的筆畫疊加在用戶網(wǎng)頁上的第一個輸入框上,在專家語提示框顯示了“輸入您的發(fā)票代碼”。
圖8 遠程專家客戶端和用戶Hololens的工作視角
綜上所述,通過遠程專家指引用戶辦稅的開發(fā)實例,表明本文提出的遠程AR專家指引系統(tǒng)能在遠程指引中正常工作,遠程專家繪制的2D注釋和文字提示信息能準確疊加在用戶電腦屏幕的網(wǎng)頁上,基于2D注釋的指引方法能有效為用戶解決辦稅的疑難問題。
本文針對傳統(tǒng)遠程指引技術(shù)在電子辦稅場景下的弊端,提出一種面向辦稅輔助的遠程AR專家指引系統(tǒng),通過實時采集用戶稅務網(wǎng)頁信息,遠程專家使用遠程專家客戶端查看用戶當前稅務頁面狀況,并通過繪制2D注釋和語音會話指引用戶解決復雜的稅務問題。指引用戶發(fā)票查詢實例結(jié)果表明,遠程專家客戶端可以正確顯示還原后的網(wǎng)頁和繪制2D注釋信息,用戶Hololens眼鏡能準確顯示2D注釋和文字提示信息,遠程指引系統(tǒng)中的各軟件運行效果良好。