基于Unity 3D的室內(nèi)裝修商城的設(shè)計(jì)與實(shí)現(xiàn)

章菲　徐燕　許淑華

摘 要： 設(shè)計(jì)了一個(gè)基于Unity 3D的虛擬室內(nèi)裝修商城系統(tǒng)。通過腳本編輯完成了動(dòng)態(tài)場(chǎng)景行為控制，表現(xiàn)了家具的移動(dòng)、視角的旋轉(zhuǎn)過程、裝修布置過程和顧客觀賞房間裝修后的場(chǎng)景，并實(shí)現(xiàn)了顧客裝修房間的動(dòng)態(tài)交互；對(duì)視角系統(tǒng)進(jìn)行了設(shè)計(jì)，結(jié)合碰撞檢測(cè)技術(shù)，利用游戲引擎Unity 3D建立了室內(nèi)裝修的三維可視化漫游系統(tǒng)。消費(fèi)者可以在此平臺(tái)上選擇優(yōu)質(zhì)裝修材料和家電配置，進(jìn)行隨心所欲地搭配。該系統(tǒng)實(shí)現(xiàn)了三維室內(nèi)裝修的演示及購物。

關(guān)鍵詞： 室內(nèi)裝修； 場(chǎng)景建模； 商品建模； 模型集成； Unity 3D

中圖分類號(hào)：TP393 文獻(xiàn)標(biāo)志碼：A 文章編號(hào)：1006-8228（2016）01-52-04

Design and implementation of interior decoration store with Unity 3D

Zhang Fei， Xu yan， Xu Shuhua

（School of Maths and Physics， Shaoxing College， Shaoxing， Zhejiang 312000， China）

Abstract： A virtual interior decoration store system is designed based on 3D Unity. Through the script editing， the dynamic scene behavior control is accomplished， the movement of the furniture， the rotating process of the visual angle， the decoration layout process and the room scene after decoration are demonstrated， and the dynamic interaction with the customers is realized. To design the visual angle system， combined with collision detection technology， and using the game engine Unity 3D， a 3D visualization roaming system is built. Consumers can choose the quality decoration materials and home appliances configuration to carry out the decoration. The system has realized the process of three-dimensional interior decoration and shopping.

Key words： interior decoration； scene modeling； product modeling； model integration； Unity 3D

0 引言

電子商務(wù)已經(jīng)改變了現(xiàn)代商務(wù)活動(dòng)模式。正因?yàn)殡娮由虅?wù)的快捷、方便和安全的購物手段，并且能夠滿足消費(fèi)者個(gè)性而獨(dú)特的消費(fèi)需求[1]。電子商務(wù)的市場(chǎng)已經(jīng)走進(jìn)了千家萬戶，走進(jìn)了普通百姓的生活，其發(fā)展空間非常廣闊。

室內(nèi)裝修是伴隨著房地產(chǎn)市場(chǎng)發(fā)展而興起的專業(yè)服務(wù)行業(yè)。隨著住房面積的不斷擴(kuò)大，舒適性越來越受到人們重視，室內(nèi)裝修行業(yè)的需求市場(chǎng)正在急速擴(kuò)大。并且，隨著因特網(wǎng)的應(yīng)用逐步進(jìn)入社會(huì)的各行各業(yè)，一套完善的三維室內(nèi)裝修電子商務(wù)平臺(tái)已成為行業(yè)發(fā)展的急需品[2]。

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

1.1 3D技術(shù)

Unity 3D是由Unity Technologies開發(fā)的一個(gè)讓玩家輕松創(chuàng)建諸如三維視頻游戲、建筑可視化等類型互動(dòng)內(nèi)容的多平臺(tái)的綜合型游戲開發(fā)工具，是一款強(qiáng)大而又簡(jiǎn)單的集成編輯器和引擎，在電子商務(wù)的系統(tǒng)開發(fā)上使用Unity 3D是一個(gè)大膽的嘗試。它的許可方式以及可選的插件使得使用者在需要時(shí)可以得到適量的功能和定制。這樣的靈活性使得它可供一個(gè)獨(dú)立的愛好者或是一個(gè)大型的開發(fā)團(tuán)隊(duì)使用[3]。

Unity 3D的跨平臺(tái)性好，腳本語言簡(jiǎn)單，支持各種插件，能和大部分相關(guān)應(yīng)用程序協(xié)同工作。我們采用此游戲引擎，就是希望把三維多視角游戲帶到購物中，多平臺(tái)呈現(xiàn)我們的商品，與買家互動(dòng)。

1.2 其他技術(shù)支撐

⑴ 3DMax

3DMax是基于PC系統(tǒng)的三維動(dòng)畫渲染和制作軟件。其廣泛應(yīng)用于建筑設(shè)計(jì)、多媒體制作、游戲以及工程可視化等領(lǐng)域。

⑵ ASP

ASP是一種服務(wù)器端腳本編寫環(huán)境，可用來創(chuàng)建和運(yùn)行動(dòng)態(tài)網(wǎng)頁或Web應(yīng)用程序。

⑶ MySQL Database

MySQL是一個(gè)開放源碼的小型關(guān)聯(lián)式數(shù)據(jù)庫管理系統(tǒng)。其體積小、速度快，總體擁有成本低、開放源碼等特點(diǎn)。目前MySQL被廣泛應(yīng)用于Internet上的中小型網(wǎng)站中。

2 系統(tǒng)功能、建模和碰撞測(cè)試

2.1 系統(tǒng)功能構(gòu)架

⑴ 系統(tǒng)前臺(tái)功能結(jié)構(gòu)圖

前臺(tái)功能包括：用戶注冊(cè)、用戶登錄、商品瀏覽、資料管理、訂單管理、用戶退出等。結(jié)構(gòu)圖如圖1所示。

⑵ 系統(tǒng)后臺(tái)功能結(jié)構(gòu)圖

后臺(tái)功能包括：顧客管理、進(jìn)貨管理、退貨管理、訂貨管理和庫存管理，結(jié)構(gòu)圖如圖2所示。

主要功能描述如下。

⑴ 網(wǎng)站首頁

商品以分頁記錄的方式顯示。用戶可以進(jìn)行商品類別或套餐篩選，也可輸入商品的名稱進(jìn)行搜索。

⑵ 用戶的注冊(cè)和登錄

用戶要想在網(wǎng)站中購買商品，需要先注冊(cè)成為網(wǎng)站的會(huì)員，登錄后才能購買商品。

⑶ 用戶信息的修改

已經(jīng)注冊(cè)的會(huì)員，在登錄后可自行修改電子郵箱、電話號(hào)碼、登錄密碼等信息。

⑷ 購物車

用戶在網(wǎng)上看到一個(gè)中意的商品時(shí)，就可把它放入購物車中，便于用戶結(jié)賬付款。

⑸ 訂單查看系統(tǒng)

用戶可以通過訂單查詢系統(tǒng)，查看自己在不同時(shí)期的購物訂單情況。

2.2 系統(tǒng)活動(dòng)狀態(tài)分析

系統(tǒng)的活動(dòng)狀態(tài)主要有買方購物活動(dòng)和賣方管理商品活動(dòng)[4]。

買方購買活動(dòng)：買方購物狀態(tài)圖如圖3所示。

賣方管理商品活動(dòng)：賣方管理商品狀態(tài)圖如圖4所示。

2.3 虛擬居室漫游場(chǎng)景建模

在虛擬居室漫游場(chǎng)景中，虛擬家具、家電分布在居室內(nèi)，客戶可以通過漫游方式在居室行走，通過前后左右的移動(dòng)來觀察整個(gè)居室的家具、家電，可以隨意進(jìn)出房間，全方位瀏覽居室內(nèi)的家具家電。而整個(gè)操作都只要用鼠標(biāo)和鍵盤控制，可操作性強(qiáng)。

虛擬居室的場(chǎng)景設(shè)計(jì)如下。

⑴ 使用3D Max建立了一個(gè)虛擬居室建筑模型，并對(duì)模型進(jìn)行渲染和烘培。

⑵ 在居室模型的基礎(chǔ)上，構(gòu)建虛擬的房間，并且在房間中放置家具、家電模型。

⑶ 進(jìn)行顧客與場(chǎng)景之間的交互行為操作設(shè)計(jì)，這個(gè)設(shè)計(jì)需要在Unity 3D中完成，所以將剛才制作好的模型導(dǎo)出為fbx文件，將*.fbx格式的模型導(dǎo)入到Unity 3D中，將攝像機(jī)添加到模型中，再為此模型添加第一人稱視角，其中包含F(xiàn)PSInputController.js，CharacterMotor.js，MouseLook.js等幾種Javascript腳本語言，使得用戶可以通過鼠標(biāo)和鍵盤的操作，實(shí)現(xiàn)在這個(gè)場(chǎng)景自由地旋轉(zhuǎn)和移動(dòng)，進(jìn)行視角的變換。

2.4 碰撞測(cè)試

簡(jiǎn)單地講，碰撞試驗(yàn)就是檢驗(yàn)虛擬場(chǎng)景中不同對(duì)象間是否發(fā)生了碰撞[5]。就虛擬場(chǎng)景漫游中的碰撞檢測(cè)來說，它可以使用戶以更自然的方式與虛擬場(chǎng)景中的對(duì)象進(jìn)行交互，保持場(chǎng)景的真實(shí)性和用戶的沉浸感。如果沒有及時(shí)的碰撞檢測(cè)，當(dāng)虛擬場(chǎng)景中的一個(gè)對(duì)象碰到另一個(gè)對(duì)象時(shí)，往往會(huì)發(fā)生相互穿透、重疊等現(xiàn)象，而不會(huì)產(chǎn)生碰撞效果，這在現(xiàn)實(shí)世界中是不可能的，所以也就會(huì)破壞虛擬場(chǎng)景的真實(shí)感和用戶的沉浸感。

但是，物理引擎在很多情況下沒辦法判斷兩個(gè)物體是否發(fā)生碰撞，前一幀和后一幀都未發(fā)生碰撞的狀態(tài)下，物理引擎當(dāng)作什么也沒發(fā)生，就會(huì)出現(xiàn)穿越。本作品中，我們給相機(jī)和墻都加上剛體Rigid、包圍盒Collider，創(chuàng)建剛體包圍盒Box Collider，然后進(jìn)行碰撞測(cè)試。而我們?cè)赨nity 3D中使用的第一人稱控制器身已帶有碰撞檢測(cè)。

3 主要模塊分析和設(shè)計(jì)

3.1 用戶登錄注冊(cè)模塊

用戶可在網(wǎng)站首頁的登錄框中輸入用戶名和密碼登錄。如未開通賬戶則注冊(cè)后即可登錄系統(tǒng)。登錄成功后可進(jìn)行各種操作。用戶登錄注冊(cè)活動(dòng)圖如圖5所示。

3.2 會(huì)員信息管理模塊

顧客進(jìn)入網(wǎng)站首頁登陸后，點(diǎn)擊“會(huì)員中心”，即可進(jìn)入“會(huì)員中心”頁面。這里為用戶提供了用戶注冊(cè)信息查看和修改，提供了用戶密碼修改、購物查看、訂單查看。會(huì)員信息管理時(shí)序如圖6所示。

3.3 商品購物模塊

用戶瀏覽各類商品時(shí)，可將喜歡的商品放入購物車，然后進(jìn)行下訂單及支付操作。用戶購物后，網(wǎng)站對(duì)訂單進(jìn)行審核并根據(jù)用戶填寫的訂單，盡快將商品寄出，同時(shí)用戶在下訂單后可進(jìn)入個(gè)人中心對(duì)訂單狀態(tài)實(shí)時(shí)查詢。購物時(shí)序圖如圖7所示。

3.4 商品管理模塊

賣方可以登錄商品管理模塊，可以對(duì)自己鋪下的商品進(jìn)行管理。商品管理時(shí)序圖如圖8所示。

3.5 在線支付模塊

相對(duì)傳統(tǒng)的支付方式而言，在線支付方式的工具是信用卡支付和電子支票。

在網(wǎng)上支付模塊中，如何接入銀行系統(tǒng)或者第三方支付是最重要的。本作品采用間接接入方式。主要有三個(gè)功能。①選擇支付銀行。客戶通過瀏覽器選擇所需要的商品后，轉(zhuǎn)到支付頁面，該頁面顯示具體的訂單號(hào)和應(yīng)付全額。②進(jìn)行付款。客戶點(diǎn)擊支付后，則轉(zhuǎn)到相應(yīng)的銀行頁面和支付頁面。③返回支付結(jié)果?？蛻羧绻Ц冻晒Γ瑒t系統(tǒng)從支付網(wǎng)關(guān)接收信息，轉(zhuǎn)到系統(tǒng)的支付結(jié)果頁面。

3.6 3D室內(nèi)裝修商城

⑴ 用戶體驗(yàn)裝修效果圖

本商城將極具人性化地為用戶提供一個(gè)其戶型的空居室，讓其在家中自由地體驗(yàn)裝修的快感，提前感受裝修后的整體感覺。如有不滿意即可更換家具。如圖9所示。

4 結(jié)束語

基于3D Unity的室內(nèi)裝修系統(tǒng)是定位于專業(yè)室內(nèi)設(shè)計(jì)與裝修網(wǎng)站之間的系統(tǒng)。該系統(tǒng)基于B/S架構(gòu)開發(fā)，既保證了系統(tǒng)訪問的便利性，又實(shí)現(xiàn)了室內(nèi)設(shè)計(jì)的專業(yè)級(jí)服務(wù)，滿足了客戶對(duì)室內(nèi)裝修在個(gè)性化、便利化、專業(yè)化的需求。在整個(gè)系統(tǒng)開發(fā)過程中的技術(shù)選型和實(shí)現(xiàn)過程對(duì)今后系統(tǒng)的進(jìn)一步發(fā)展都有極為重要的借鑒意義。下一步，還可以對(duì)手機(jī)客戶端進(jìn)行開發(fā)，讓此商城系統(tǒng)更加高效。

參考文獻(xiàn)（References）：

[1] 史海濱.淺談我國電子商務(wù)的發(fā)展前景[J].中國商貿(mào)，

2012.12（b）：112-113

[2] 許時(shí)晨.室內(nèi)裝修電子商務(wù)平臺(tái)的構(gòu)建[D].復(fù)旦大學(xué)，2007.

[3] （美）Michelle Menard，（譯）史曉明.李強(qiáng).Unity游戲開發(fā)實(shí)戰(zhàn)[M].

機(jī)械工業(yè)出版社，2012.

[4] 王松樵，許淑華.基于Web3D的虛擬五金商城的設(shè)計(jì)與實(shí)現(xiàn)[J].

計(jì)算機(jī)時(shí)代，2012.10：42-45

[5] 馬登武.虛擬場(chǎng)景中的碰撞檢測(cè)算法[J].火力與指揮控制，

2004.4.