張華瑾 張萍 許淑華



摘? 要: 設計了一個擁有3D視覺效果和真實交互體驗的網上購物系統。將增強現實技術運用到商品瀏覽當中,打破了傳統網購單一的圖片瀏覽模式。通過攝像頭對標記進行識別,將真實場景采入,并建立三維坐標,實現實時跟蹤;對商品進行3D建模,將現實場景與虛擬商品模型相融合,反饋于商品瀏覽頁面。給消費者虛擬的商品使用權,感受到商品出現在家里的真實狀況。
關鍵詞: 增強現實; 交互體驗; 3D建模; 電子商務
中圖分類號:TP393? ? ? ? ? 文獻標志碼:A? ? ?文章編號:1006-8228(2019)09-33-03
The application of augmented reality technology in Internet shopping experience
Zhang Huajin, Zhang Ping, Xu Shuhua
(School of Maths and Physics, Shaoxing College, Shaoxing, Zhejiang 312000, China)
Abstract: An online shopping system with 3D visual effect and real interactive experience is designed. Augmented reality technology is applied to the commodity browsing of online shopping system, breaking the traditional single online shopping picture browsing mode. The tag is identified by the camera, the real scene is collected, and the 3d coordinates are established to realize real-time tracking. The 3D modeling of goods is carried out, and the real scene is integrated with the virtual goods model, which is fed back to the commodity browsing page. Give consumers the right to use virtual goods and feel the real situation of goods at home.
Key words: augmented reality; interaction experience; 3D modeling; electronic commerce
0 引言
1990年,美國波音公司的Caudell與同事在設計一個輔助布線系統時首次提出了“Augmented Reality”這個概念即增強現實。增強現實是在虛擬現實基礎上發展起來的一種新興技術,是用計算機產生的附加信息對真實世界的景象進行信息增強或擴張,具有將真實場景同虛擬物體加以融合的特性[5]。
目前AR技術已經應用在工業、醫療、軍事等領域,但還未走入普通民眾的日常生活。近年來,電子商務日漸成熟,網上購物趨于常態化。但市場上購物平臺以2D(平面)頁面模式居多。對商品的展示,多以照片和文字描述為主,消費者對商品缺乏全面的、立體的了解。
因此,本文設計了一個擁有3D視覺效果和真實交互體驗的網上購物系統。將增強現實技術運用到商品瀏覽中,利用攝像頭掃描真實場景,對商品進行3D建模,讓消費者全面地了解商品信息,避免購買商品后由于樣式與預想不一樣而產生的不滿意。
1 系統開發技術
1.1 增強現實技術
增強現實技術(Augmented Reality,AR)是一個技術組合,實現真實世界和虛擬內容之間的交互,即向真實視頻顯示中實時融入計算機生成內容的技術。它有三大特征,即虛實結合、三維注冊、實時交互。其實現主要有兩大步,一是采集真實世界的信息即識別,二是在重現實時媒體時融入虛擬內容(本文主要指商品模型)[1]。
1.1.1 基于真實場景的標記識別
本文涉及的增強現實技術采用特定類型的標記識別。通過計算機視覺算法識別這些標記,根據這些標記在攝像頭視圖中的攝影輪廓形狀來計算這些標記的方位。標記識別是對候選標記區域進行檢測,確定候選標記區域是否包含了標記的ID信息,從而確定候選標記區域是否就是標記,接著就可以根據標記的位置信息完成跟蹤注冊,并且加載的相應計算機虛擬模型。基于真實場景的標記識別主要包括以下幾部分[3]。
(1) 標記的設計
放置在現實場景中的人工標記在被系統識別后,提供了計算出真實場景坐標系與攝像機場景坐標系轉換關系所需要的基本信息,同時增強現實系統還可根據標記中所含的ID信息做出相應的反應。
(2) 標記的檢測
標記檢測的目的就是找到視頻圖像中的候選標記區域。候選標記區域就是符合一定條件有可能是標記的圖像區域。只有當候選標記區域經過標記識別這一步驟,并且能夠在候選標記區域中讀出合法的標記ID等信息,這樣候選標記區域才會被認為是含有合法標記,從而完成標記識別。
(3) 標記的校正
標記的校正就是將在成像平面上由于變化而扭曲的不規則的標記校正成正方形的,有著規則形狀的標記,從而使其能夠被識別。根據仿射原理可知,當三維空間中的一個四方形平面物體投影到另一個二維的成像半面時,所形成的圖像一般都不是原來的形狀,而且由于攝像機的位置和方向在拍攝過程中不斷的變化,因此標記在成像平面上總是不規則的凸多邊形。而在采取圖像匹配、編碼匹配進行標記識別時,需要規則的正方形標記才能與標記模板庫中的標記模板進行匹配。
(4) 標記ID匹配
在標記檢測過程中,增強現實系統會在視頻圖像中檢測和提取出多個候選標記區域,為了從這些候選標記區域中識別出真正含有標記的區域,則需要對著候選區域進行ID匹配,通過讀取候選區域中的信息來判斷它是否是標記。
1.1.2 3D虛擬建模
3D虛擬模型是實物的外觀信息、商務信息以及與客戶的交互信息的有機結合體,是實物的商務性,交互性和形象性的體現。在基于這三種信息上,我們了首先利用Blender進行商品建模,然后將模型導入Flash Builder中,重現實時媒體中融入虛擬內容的目的。最后在展示的時候,通過訪問數據庫的方式,找出需要的商務數據到瀏覽器。如圖1所示。
增強現實技術可以產生很多非常吸引人的交互體驗,例如幫助人們嘗試各種新式發型、實時顯示產品信息、逼真地演示玩具的玩法等。將這種技術應用于購物體驗上是一個大膽的嘗試,也是希望人們在購物時有一個更全面立體的體驗,做出更好的購買決策。
1.2 JSP網站建設
JSP(JavaServer Pages)是一種動態頁面技術,使用Java編程語言編寫類XML的tags和scriptlets,來封裝產生動態網頁的處理邏輯。網頁還能通過tags和scriptlets訪問存在于服務端的資源的應用邏輯。JSP將網頁邏輯與網頁設計的顯示分離,支持可重用的基于組件的設計,使基于Web的應用程序的開發變得迅速和容易[4]。本文在jsp技術的基礎上,利用Eclipse設計實現網站的構建。
2 系統分析
我們的系統旨在讓客戶在購買商品時,能夠使用增強現實功能,通過3D模型,全面立體的了解商品的信息。同時,真實的場景讓客戶體驗身臨其境的現實感覺,更直觀地分析商品與自身或周邊環境的匹配度,做出正確的購買決策。系統按照功能的性質分為前臺服務和后臺管理系系統。
⑴ 前臺服務系統
前臺服務系統主要提供商品的三維立體展示以及購物過程中的一系列服務,并考慮了會員功能和游客功能。系統前臺具有用戶注冊、用戶登錄、商品瀏覽、資料管理,訂單管理等功能。在系統前臺客戶可根據自身需求選擇相應的服務功能,如圖2。
⑵ 后臺管理系統
后臺系統主要是為管理者提供一個可視的數據庫操作界面[2],方便對相關信息進行及時有效的更新、維護、整理等操作。包括用戶管理、商品管理、商品類別管理、訂單管理等,如圖3所示。
3 主要模塊分析和設計
3.1 用戶登錄注冊模塊
用戶可以在網站首頁的登錄框中輸入用戶名和密碼進行登錄,當輸入的用戶名和密碼正確后才會成功登錄,否則將提示失敗。
3.2 會員信息管理模塊
游客進入網站首頁登錄后,點擊“會員中心”,即可進入“會員中心”頁面,這里為用戶提供了用戶注冊信息的查看和修改。
3.3 商品體驗模塊
本網站使用AR技術為商品提供體驗為用戶提供更真實、直觀的體驗,用戶可根據需求,打印標記,用攝像頭掃描標記,便可出現商品的3D模型,結合攝像頭掃描入的真實場景與之結合,可以給用戶一個真實的消費體驗。
3.4 在線支付模塊
在網上支付模塊,本網站采取間接接入的方式: ①選擇支付方式。②進行支付。③返回支付結果。
3.5 增強現實應用
(1) 3D商品展示
本系統將為人們展示設計商品的3D模型,讓顧客可以多角度進行觀看。如圖4所示。
(2) 基于瀏覽器的AR商品展示
本系統提供虛擬商品與真實環境融合的3D商品展示,看其是否適合自己,是否適合真實環境。如圖5所示。
4 結束語
本文設計了一個擁有3D視覺和真實交互體驗的網上購物系統,打破了傳統網購的瀏覽方式,尤其是為大型家具在線購買帶來了極大的便利。消費者可以利用攝像頭,體驗虛擬商品與真實環境的結合。此項應用能夠很好的提高消費者滿意度,降低退貨率,擴大家具在線銷售平臺。下一步,我們將繼續優化,解決動態模型不正常抖動問題,簡化系統操作。
參考文獻(References):
[1] Tnoy Mullen著,徐學磊譯.增強現實:必知必會的工具與方法[M]. 機械工業出版社,2013.
[2] 謝忠. SP中表單數據存儲的一種通用方法[A]. 計算機與信息技術,2007.9:91-95
[3] 盛君.基于標識的增強現實系統的研究[D]. 杭州電子科技大學碩士學位論文,2009.
[4] 吳晨清,榮震華.用JSP/Servle技術構建Web應用[J]. 計算機工程,2001.
[5] 王璞.移動增強現實技術在圖書館中的應用研究[A]. 上海海事大學圖書館,2013.6.