張華瑾 張萍 許淑華

摘? 要： 設計了一個擁有3D視覺效果和真實交互體驗的網(wǎng)上購物系統(tǒng)。將增強現(xiàn)實技術運用到商品瀏覽當中，打破了傳統(tǒng)網(wǎng)購單一的圖片瀏覽模式。通過攝像頭對標記進行識別，將真實場景采入，并建立三維坐標，實現(xiàn)實時跟蹤;對商品進行3D建模，將現(xiàn)實場景與虛擬商品模型相融合，反饋于商品瀏覽頁面。給消費者虛擬的商品使用權(quán)，感受到商品出現(xiàn)在家里的真實狀況。

關鍵詞： 增強現(xiàn)實; 交互體驗; 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與同事在設計一個輔助布線系統(tǒng)時首次提出了“Augmented Reality”這個概念即增強現(xiàn)實。增強現(xiàn)實是在虛擬現(xiàn)實基礎上發(fā)展起來的一種新興技術，是用計算機產(chǎn)生的附加信息對真實世界的景象進行信息增強或擴張，具有將真實場景同虛擬物體加以融合的特性[5]。

目前AR技術已經(jīng)應用在工業(yè)、醫(yī)療、軍事等領域，但還未走入普通民眾的日常生活。近年來，電子商務日漸成熟，網(wǎng)上購物趨于常態(tài)化。但市場上購物平臺以2D（平面）頁面模式居多。對商品的展示，多以照片和文字描述為主，消費者對商品缺乏全面的、立體的了解。

因此，本文設計了一個擁有3D視覺效果和真實交互體驗的網(wǎng)上購物系統(tǒng)。將增強現(xiàn)實技術運用到商品瀏覽中，利用攝像頭掃描真實場景，對商品進行3D建模，讓消費者全面地了解商品信息，避免購買商品后由于樣式與預想不一樣而產(chǎn)生的不滿意。

1 系統(tǒng)開發(fā)技術

1.1 增強現(xiàn)實技術

增強現(xiàn)實技術（Augmented Reality，AR）是一個技術組合，實現(xiàn)真實世界和虛擬內(nèi)容之間的交互，即向真實視頻顯示中實時融入計算機生成內(nèi)容的技術。它有三大特征，即虛實結(jié)合、三維注冊、實時交互。其實現(xiàn)主要有兩大步，一是采集真實世界的信息即識別，二是在重現(xiàn)實時媒體時融入虛擬內(nèi)容（本文主要指商品模型）[1]。

1.1.1 基于真實場景的標記識別

本文涉及的增強現(xiàn)實技術采用特定類型的標記識別。通過計算機視覺算法識別這些標記，根據(jù)這些標記在攝像頭視圖中的攝影輪廓形狀來計算這些標記的方位。標記識別是對候選標記區(qū)域進行檢測，確定候選標記區(qū)域是否包含了標記的ID信息，從而確定候選標記區(qū)域是否就是標記，接著就可以根據(jù)標記的位置信息完成跟蹤注冊，并且加載的相應計算機虛擬模型。基于真實場景的標記識別主要包括以下幾部分[3]。

（1） 標記的設計

放置在現(xiàn)實場景中的人工標記在被系統(tǒng)識別后，提供了計算出真實場景坐標系與攝像機場景坐標系轉(zhuǎn)換關系所需要的基本信息，同時增強現(xiàn)實系統(tǒng)還可根據(jù)標記中所含的ID信息做出相應的反應。

（2） 標記的檢測

標記檢測的目的就是找到視頻圖像中的候選標記區(qū)域。候選標記區(qū)域就是符合一定條件有可能是標記的圖像區(qū)域。只有當候選標記區(qū)域經(jīng)過標記識別這一步驟，并且能夠在候選標記區(qū)域中讀出合法的標記ID等信息，這樣候選標記區(qū)域才會被認為是含有合法標記，從而完成標記識別。

（3） 標記的校正

標記的校正就是將在成像平面上由于變化而扭曲的不規(guī)則的標記校正成正方形的，有著規(guī)則形狀的標記，從而使其能夠被識別。根據(jù)仿射原理可知，當三維空間中的一個四方形平面物體投影到另一個二維的成像半面時，所形成的圖像一般都不是原來的形狀，而且由于攝像機的位置和方向在拍攝過程中不斷的變化，因此標記在成像平面上總是不規(guī)則的凸多邊形。而在采取圖像匹配、編碼匹配進行標記識別時，需要規(guī)則的正方形標記才能與標記模板庫中的標記模板進行匹配。

（4） 標記ID匹配

在標記檢測過程中，增強現(xiàn)實系統(tǒng)會在視頻圖像中檢測和提取出多個候選標記區(qū)域，為了從這些候選標記區(qū)域中識別出真正含有標記的區(qū)域，則需要對著候選區(qū)域進行ID匹配，通過讀取候選區(qū)域中的信息來判斷它是否是標記。

1.1.2 3D虛擬建模

3D虛擬模型是實物的外觀信息、商務信息以及與客戶的交互信息的有機結(jié)合體，是實物的商務性，交互性和形象性的體現(xiàn)。在基于這三種信息上，我們了首先利用Blender進行商品建模，然后將模型導入Flash Builder中，重現(xiàn)實時媒體中融入虛擬內(nèi)容的目的。最后在展示的時候，通過訪問數(shù)據(jù)庫的方式，找出需要的商務數(shù)據(jù)到瀏覽器。如圖1所示。

增強現(xiàn)實技術可以產(chǎn)生很多非常吸引人的交互體驗，例如幫助人們嘗試各種新式發(fā)型、實時顯示產(chǎn)品信息、逼真地演示玩具的玩法等。將這種技術應用于購物體驗上是一個大膽的嘗試，也是希望人們在購物時有一個更全面立體的體驗，做出更好的購買決策。

1.2 JSP網(wǎng)站建設

JSP（JavaServer Pages）是一種動態(tài)頁面技術，使用Java編程語言編寫類XML的tags和scriptlets，來封裝產(chǎn)生動態(tài)網(wǎng)頁的處理邏輯。網(wǎng)頁還能通過tags和scriptlets訪問存在于服務端的資源的應用邏輯。JSP將網(wǎng)頁邏輯與網(wǎng)頁設計的顯示分離，支持可重用的基于組件的設計，使基于Web的應用程序的開發(fā)變得迅速和容易[4]。本文在jsp技術的基礎上，利用Eclipse設計實現(xiàn)網(wǎng)站的構(gòu)建。

2 系統(tǒng)分析

我們的系統(tǒng)旨在讓客戶在購買商品時，能夠使用增強現(xiàn)實功能，通過3D模型，全面立體的了解商品的信息。同時，真實的場景讓客戶體驗身臨其境的現(xiàn)實感覺，更直觀地分析商品與自身或周邊環(huán)境的匹配度，做出正確的購買決策。系統(tǒng)按照功能的性質(zhì)分為前臺服務和后臺管理系系統(tǒng)。

⑴ 前臺服務系統(tǒng)

前臺服務系統(tǒng)主要提供商品的三維立體展示以及購物過程中的一系列服務，并考慮了會員功能和游客功能。系統(tǒng)前臺具有用戶注冊、用戶登錄、商品瀏覽、資料管理，訂單管理等功能。在系統(tǒng)前臺客戶可根據(jù)自身需求選擇相應的服務功能，如圖2。

⑵ 后臺管理系統(tǒng)

后臺系統(tǒng)主要是為管理者提供一個可視的數(shù)據(jù)庫操作界面[2]，方便對相關信息進行及時有效的更新、維護、整理等操作。包括用戶管理、商品管理、商品類別管理、訂單管理等，如圖3所示。

3 主要模塊分析和設計

3.1 用戶登錄注冊模塊

用戶可以在網(wǎng)站首頁的登錄框中輸入用戶名和密碼進行登錄，當輸入的用戶名和密碼正確后才會成功登錄，否則將提示失敗。

3.2 會員信息管理模塊

游客進入網(wǎng)站首頁登錄后，點擊“會員中心”，即可進入“會員中心”頁面，這里為用戶提供了用戶注冊信息的查看和修改。

3.3 商品體驗模塊

本網(wǎng)站使用AR技術為商品提供體驗為用戶提供更真實、直觀的體驗，用戶可根據(jù)需求，打印標記，用攝像頭掃描標記，便可出現(xiàn)商品的3D模型，結(jié)合攝像頭掃描入的真實場景與之結(jié)合，可以給用戶一個真實的消費體驗。

3.4 在線支付模塊

在網(wǎng)上支付模塊，本網(wǎng)站采取間接接入的方式： ①選擇支付方式。②進行支付。③返回支付結(jié)果。

3.5 增強現(xiàn)實應用

（1） 3D商品展示

本系統(tǒng)將為人們展示設計商品的3D模型，讓顧客可以多角度進行觀看。如圖4所示。

（2） 基于瀏覽器的AR商品展示

本系統(tǒng)提供虛擬商品與真實環(huán)境融合的3D商品展示，看其是否適合自己，是否適合真實環(huán)境。如圖5所示。

4 結(jié)束語

本文設計了一個擁有3D視覺和真實交互體驗的網(wǎng)上購物系統(tǒng)，打破了傳統(tǒng)網(wǎng)購的瀏覽方式，尤其是為大型家具在線購買帶來了極大的便利。消費者可以利用攝像頭，體驗虛擬商品與真實環(huán)境的結(jié)合。此項應用能夠很好的提高消費者滿意度，降低退貨率，擴大家具在線銷售平臺。下一步，我們將繼續(xù)優(yōu)化，解決動態(tài)模型不正常抖動問題，簡化系統(tǒng)操作。

參考文獻（References）：

[1] Tnoy Mullen著，徐學磊譯.增強現(xiàn)實：必知必會的工具與方法[M]. 機械工業(yè)出版社，2013.

[2] 謝忠. SP中表單數(shù)據(jù)存儲的一種通用方法[A]. 計算機與信息技術，2007.9：91-95

[3] 盛君.基于標識的增強現(xiàn)實系統(tǒng)的研究[D]. 杭州電子科技大學碩士學位論文，2009.

[4] 吳晨清，榮震華.用JSP/Servle技術構(gòu)建Web應用[J]. 計算機工程，2001.

[5] 王璞.移動增強現(xiàn)實技術在圖書館中的應用研究[A]. 上海海事大學圖書館，2013.6.