基于移動(dòng)終端的家具互動(dòng)展示系統(tǒng)的應(yīng)用研究

謝新慧　司占軍　尚博

摘要：該研究實(shí)現(xiàn)了基于移動(dòng)終端的家居互動(dòng)展示系統(tǒng)。通過Auto CAD創(chuàng)建房屋的戶型圖，利用3d max創(chuàng)建建筑物以及所有家具的三維模型，并在Photo shop中對家具及建筑物貼圖進(jìn)行修飾，最后導(dǎo)入到unity中實(shí)現(xiàn)房屋漫游以及其他交互功能。在最終的展示系統(tǒng)中，用戶可以任意進(jìn)入家具城、品牌家具的網(wǎng)上展廳，并以第一人稱的角度對家具城里的家具進(jìn)行參觀。同時(shí)，用戶可以根據(jù)自己的意愿選擇某個(gè)家具，對其進(jìn)行移動(dòng)，旋轉(zhuǎn)等操作，實(shí)現(xiàn)近距離觀看家具的功能。

關(guān)鍵詞：虛擬現(xiàn)實(shí)；家具互動(dòng)；房屋漫游

中圖分類號(hào)：TP319 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1009-3044（2018）15-0209-03

隨著科技飛速發(fā)展，人們的生活質(zhì)量不斷提高[1]。人們早已不能滿足二維的平面世界，虛擬現(xiàn)實(shí)技術(shù)（VR技術(shù)）應(yīng)運(yùn)而生[2]。虛擬現(xiàn)實(shí)技術(shù)是把現(xiàn)實(shí)世界構(gòu)建成一個(gè)新的3D虛擬立體模型，用戶可以借用第三方設(shè)施或設(shè)備體驗(yàn)身臨其境的處于所構(gòu)建的3D模型中[1]。VR技術(shù)打破了很久以來的平面展示系統(tǒng)的限制，它利用自己所創(chuàng)建的立體仿真環(huán)境的優(yōu)點(diǎn)在很多領(lǐng)域占有一席之地。比如現(xiàn)在的房地產(chǎn)業(yè)，客戶看到的不僅僅是簡單的戶型圖，或者是房屋的室內(nèi)照片，而是以第一人稱的視角，真正進(jìn)入到自己喜歡的房屋內(nèi)進(jìn)行游覽、觀看。對房屋的各個(gè)部位和角落都可以清楚地了解。另外，對家具的擺放和布局也可以有一個(gè)清楚地了解。

基于移動(dòng)終端的家具互動(dòng)展示系統(tǒng)，顧名思義，就是把某一個(gè)戶型和家具在移動(dòng)終端上展示出來的系統(tǒng)[2]，這里的移動(dòng)終端可以是平板電腦，手機(jī)等。在向用戶展示的過程中，用戶可以完成與家具的簡單交互，比如對家具進(jìn)行簡單的移動(dòng)，旋轉(zhuǎn)等。在該系統(tǒng)中，人們可以全方位地了解自己喜歡的戶型，并且對戶型里面的家具也可以有比較明確的了解。

1 開發(fā)環(huán)境與軟件

制圖環(huán)境： Windows 8系統(tǒng)，Intel（R） Core（TM）i7 CPU ，4G內(nèi)存，64位操作系統(tǒng)

建模環(huán)境：Windows 8系統(tǒng)，Intel（R） Core（TM）i7 CPU ，4G內(nèi)存，64位操作系統(tǒng)

開發(fā)環(huán)境：Windows 7系統(tǒng)，Intel（R） Core（TM）i7 CPU ，4G內(nèi)存，64位操作系統(tǒng)

制作軟件： Auto CAD 2014、3ds Max 2014、Unity 5.6.1f1 （64-bit）、Photo shop cc

2 設(shè)計(jì)思路

首先進(jìn)行市場調(diào)研，了解虛擬家裝的應(yīng)用市場，確定所要建立的戶型結(jié)構(gòu)以及搜集相關(guān)的貼圖素材。然后在3ds Max中進(jìn)行建模并實(shí)現(xiàn)相應(yīng)的渲染效果。在Unity3D中實(shí)現(xiàn)后期交互功能，并進(jìn)行發(fā)布及性能的測試。

3 設(shè)計(jì)與實(shí)現(xiàn)

3.1 前期準(zhǔn)備工作

對整個(gè)虛擬家裝市場進(jìn)行調(diào)研，根據(jù)市場需求制定出相應(yīng)的策劃方案。同時(shí)通過書籍的查閱和互聯(lián)網(wǎng)查詢來收集相關(guān)貼圖和模型素材，并下載相關(guān)軟件，儲(chǔ)備相關(guān)知識(shí)，為后期制作做好充分準(zhǔn)備[3]。

3.2 房屋模型的構(gòu)建

房屋模型構(gòu)建過程分為三部分，房子的戶型建立、門窗的建立、家具及電器模型的建立。

房子的戶型建立。首先在3D MAX設(shè)置毫米為基本單位。然后，將CAD戶型圖拖入3D MAX的透視圖中，先描輪廓，并選擇校準(zhǔn)工具將描好的輪廓進(jìn)行校準(zhǔn)，使用捕捉工具將所有點(diǎn)的橫坐標(biāo)和縱坐標(biāo)對齊到一個(gè)點(diǎn)上。將戶型圖描好并且校準(zhǔn)之后，選中戶型圖，右鍵選擇“轉(zhuǎn)換為可編輯多邊形”，然后選擇“邊”工具，隨后選擇“擠出”工具，將戶型擠出為立體狀，高度設(shè)置為2550mm，房屋的墻體則建立完畢。如圖2所示。

門窗的建立。在建立門模型時(shí)，為了整個(gè)門呈現(xiàn)動(dòng)態(tài)，需要制作為打開的狀態(tài)，首先要選中這個(gè)門，利用“捕捉”工具，將門旋轉(zhuǎn)，并且移動(dòng)到門框的邊上，即可實(shí)現(xiàn)。如圖3所示。在建立窗戶時(shí)，關(guān)鍵在于玻璃材質(zhì)的參數(shù)設(shè)置，為了渲染出逼真的玻璃效果，在這里要指定Vray渲染器并選用Vray材質(zhì)。具體參數(shù)如下：漫反射設(shè)置為116，141，196；反射參數(shù)為22，22，22；反射高光為0.95；折射參數(shù)為200，200，200；折射光澤度為0.9。

部分家具及電器模型的建立。為了在展示系統(tǒng)中呈現(xiàn)逼真的效果，家具的建模需要精細(xì)一些，對每個(gè)家具進(jìn)行建模之前要了解其構(gòu)造，進(jìn)行有步驟有層次地建模過程。如圖4所示是制作完成的椅子。

3.3 模型的貼圖重建

在家具互動(dòng)展示系統(tǒng)中，主要對以下四部分進(jìn)行貼圖：房屋內(nèi)部墻體的貼圖、門和窗戶的貼圖、所有的家具以及部分電器的貼圖以及地面的貼圖。貼圖需要“材質(zhì)編輯器”命令來實(shí)現(xiàn)。在3D MAX中可以執(zhí)行“渲染”—“材質(zhì)編輯器”命令，或者在主工具欄中單擊“材質(zhì)編輯器”命令按鈕。目前材質(zhì)編輯器有“材質(zhì)編輯器”和“Slate材質(zhì)編輯器”兩種。在這里使用“精簡材質(zhì)編輯器”，然后將提前搜集好的貼圖素材賦予不同的模型，實(shí)現(xiàn)最終的貼圖效果。

3.4 場景設(shè)計(jì)與相關(guān)腳本的編寫

將模型導(dǎo)入到unity中后，可能會(huì)存在貼圖大量丟失等問題，這時(shí)就需要進(jìn)行重新貼圖。首先在assets文件夾的models文件夾下建立新的文件夾，命名為materials，然后把所有貼圖素材放在文件夾里面，用英文名稱命名。完成之后，將materials貼圖文件夾復(fù)制到unity的根目錄下，然后再導(dǎo)入由3D MAX生成的 fbx格式的文件，模型就自動(dòng)恢復(fù)成先前的貼圖。

建模過程和貼圖渲染過程結(jié)束后，需要在Unity3D中實(shí)現(xiàn)房屋漫游和交互效果。房屋漫游是第一人稱攝像機(jī)的自由移動(dòng)過程，在該過程的設(shè)置中要注意的是房屋和家具要設(shè)置“碰撞”效果，這樣可以防止人物的“穿墻”效果和“掉落”現(xiàn)象。交互過程是用戶和家具的交互，用戶可以通過點(diǎn)擊家具實(shí)現(xiàn)家具的簡單移動(dòng)和旋轉(zhuǎn)[4]。而漫游和交互功能需要通過編寫腳本代碼來實(shí)現(xiàn)，腳本如下：

1）漫游腳本：

using System.Collections；

using System.Collections.Generic；

using UnityEngine；

public class MoveObject ： MonoBehaviour {

public Vector3 pos；

public Quaternion rot；

// Use this for initialization

void Start （） {

pos = this.transform.position；

rot = this.transform.rotation；

}

}

2）交互效果腳本：

using System.Collections；

using System.Collections.Generic；

using UnityEngine；

public class PlayerMovement ： MonoBehaviour {

public GameObject OBJECTS， PROPS， target， btn_quit；

public Transform this_cam；

public Rigidbody this_rigid；

public EasyJoystick stick_move， stick_rotate；

public bool isMobileControl = false， canMove = true；

private Vector3 pos；

private Quaternion rot；

private float speed = 3.0f， sideSpeed = 1.5f；

// Use this for initialization

void Start （） {

pos = this.transform.localPosition；

rot = this.transform.localRotation；

}

// Update is called once per frame

void Update （） {

if （！isMobileControl）

MovePlayer （）；

Shoot （）；

}

private void MovePlayer（）{

if （canMove） {

Screen.lockCursor = true；

if （Input.GetKey （KeyCode.W）） {

this.transform.Translate （Vector3.forward * speed * Time.deltaTime）；

} else if （Input.GetKey （KeyCode.S）） {

this.transform.Translate （Vector3.back * speed * Time.deltaTime）；

}

if （Input.GetKey （KeyCode.A）） {

this.transform.Translate （Vector3.left * sideSpeed * Time.deltaTime）；

} else if （Input.GetKey （KeyCode.D）） {

this.transform.Translate （Vector3.right * sideSpeed * Time.deltaTime）；

}

} else {

Screen.lockCursor = false；

}

}

private void Shoot（）{

if （Input.GetMouseButtonDown （0）） {

Ray ray = new Ray（）；

RaycastHit hit；

if （！isMobileControl） {

ray = new Ray （this_cam.position， this_cam.forward）；

} else {

ray = this_cam.transform.GetComponent （）.ScreenPointToRay （Input.mousePosition）；

}

if （Physics.Raycast （ray， out hit， 100.0f， ～（1 << 5））） {

if （hit.collider.transform.GetComponent （） ！= null） {

target = hit.collider.gameObject；

OBJECTS.SetActive （false）；

for （int i = 0； i < PROPS.transform.childCount； i++） {

PROPS.transform.GetChild （i）.gameObject.SetActive （false）；

}

target.SetActive （true）；

btn_quit.SetActive （true）；

canMove = false；

this_rigid.useGravity = false；

this_rigid.isKinematic = true；

stick_move.XAxisTransform = target.transform；

stick_move.YAxisTransform = target.transform；

stick_rotate.XAxisTransform = target.transform；

stick_rotate.YAxisTransform = target.transform；

} else if （hit.collider.tag == "UI"） {

return；

}

}

}

}

public void QuitEditMode（）{

target.transform.position = target.transform.GetComponent （）.pos；

target.transform.rotation = target.transform.GetComponent （）.rot；

target = null；

//this.transform.localPosition = pos；

//this.transform.localRotation = rot；

OBJECTS.SetActive （true）；

for （int i = 0； i < PROPS.transform.childCount； i++） {

PROPS.transform.GetChild （i）.gameObject.SetActive （true）；

}

btn_quit.SetActive （false）；

canMove = true；

this_rigid.useGravity = true；

this_rigid.isKinematic = false；

stick_move.XAxisTransform = this.transform；

stick_move.YAxisTransform = this.transform；

stick_rotate.XAxisTransform = this.transform；

stick_rotate.YAxisTransform = this_cam；

}

}

3.5 測試及發(fā)布

功能實(shí)現(xiàn)后在工具欄中點(diǎn)擊“播放”按鈕進(jìn)行場景的初步測試，觀察模型與貼圖是否符合實(shí)際情況[5]。保存之后，使用快捷鍵“CTRL+ALT+B”， 導(dǎo)出“EXE”文件。然后運(yùn)行“EXE”文件，測試軟件是否能夠正常運(yùn)行，同時(shí)注意內(nèi)容是否完整以及所有的功能是否都能實(shí)現(xiàn)。在檢查無誤后，選擇文件左上角的file工具欄，點(diǎn)擊Build Settings，然后點(diǎn)擊Android，把作品發(fā)布到Android手機(jī)上。

4 總結(jié)

本設(shè)計(jì)利用Auto CAD 、3ds MAX、Unity3D軟件對家具展示系統(tǒng)App進(jìn)行設(shè)計(jì)及開發(fā)，實(shí)現(xiàn)了家具的虛擬交互展示[6]。在后續(xù)開發(fā)中，可以使用VR眼鏡，達(dá)到更好的沉浸式的漫游體驗(yàn)?；贏ndroid平臺(tái)的App應(yīng)用程序，讓使用者可以更生動(dòng)和直觀的展示家具工藝、造型、裝飾等藝術(shù)風(fēng)格。

參考文獻(xiàn)：

[1] 石寧. 淺談建筑施工管理創(chuàng)新策略[J]. 房地產(chǎn)導(dǎo)刊， 2015（34）.

[2] 趙鵬程. 虛擬現(xiàn)實(shí)中三維動(dòng)畫建模方法的研究[J]. 信息與電腦， 2016（19）： 59-60.

[3] 張姣姣， 董明治， 司占軍. 兒童三維互動(dòng)讀物的設(shè)計(jì)與制作[J]. 電腦知識(shí)與技術(shù)， 2017.

[4] 唐蕾， 林作新， 張亞池. 家具產(chǎn)品互動(dòng)設(shè)計(jì)中的行為本質(zhì)研究[J]. 家具與室內(nèi)裝飾， 2016（10）： 20-23.

[5] 董春俠， 司占軍. 基于Unity3D的虛擬校園App設(shè)計(jì)與開發(fā)[J]. 軟件導(dǎo)刊， 2017（2）： 94-96.

[6] 郭海新. 基于Unity3D的在線家具展示系統(tǒng)的實(shí)現(xiàn)[J]. 商情， 2017（47）.