基于VR技術(shù)的小學(xué)勞技作品展示平臺的設(shè)計(jì)與實(shí)現(xiàn)

闕喜元

【摘要】本文研究以Photoshop、AutoCAD、3ds Max、Unity3D為主要技術(shù)手段，介紹了如何以御窯小學(xué)的御窯文化展示廳為原型，打造虛擬展廳的全過程。系統(tǒng)中的UI界面與貼圖素材的制作使用了Photoshop CS;平面圖的設(shè)計(jì)使用了AutoCAD 2007;場景與物品的建模使用了3ds Max 2014，最后結(jié)合三維建模工具和C#語言在Unity3D引擎中實(shí)現(xiàn)交互。整個(gè)系統(tǒng)界面友好、操作簡便，有利于更好的傳播傳統(tǒng)文化，促進(jìn)學(xué)生良好勞動(dòng)技能的養(yǎng)成。

【關(guān)鍵詞】VR;Unity3D;御窯文化;展示平臺

一、總體設(shè)計(jì)概述

本項(xiàng)目以學(xué)校御窯文化展示廳為原型，在實(shí)地測量的基礎(chǔ)上，運(yùn)用AutoCAD完成平面設(shè)計(jì)，運(yùn)用3ds Max軟件對場景及展品進(jìn)行建模。在小學(xué)勞技作品展示平臺中所有模型將作為一個(gè)整體一同展示，通過Unity3D軟件為用戶設(shè)計(jì)兩種參觀模式，即自動(dòng)游覽與手動(dòng)參觀。自動(dòng)游覽可在不進(jìn)行任何操作的情況下，按照特定的路線完成整個(gè)參觀過程，手動(dòng)參觀則需要用戶通過鼠標(biāo)和鍵盤控制視角與位置。此外，為加強(qiáng)與參觀者的互動(dòng)，對具有交互功能的墻面貼圖進(jìn)行了設(shè)計(jì)，比如當(dāng)參觀者單擊圖片時(shí)，屏幕會(huì)彈出相關(guān)的知識介紹，供參觀者學(xué)習(xí)、參考。為了讓展廳更具真實(shí)感，對展廳窗戶的外景進(jìn)行了專門制作。

二、綜合框架設(shè)計(jì)

在充分考慮用戶需求的基礎(chǔ)上，開發(fā)團(tuán)隊(duì)對設(shè)計(jì)思路進(jìn)行了交流和調(diào)整，最終形成了本展項(xiàng)目的總體結(jié)構(gòu)。本項(xiàng)目既要具備虛擬展廳的常規(guī)功能，即展品的釋名、歷史沿革、制作技藝等內(nèi)容方面的展示;又要滿足學(xué)生學(xué)習(xí)的需求，于是我們通過圖文和視頻兩種方式全面介紹了展品的制作流程。此外，考慮到展品的制作步驟繁瑣，復(fù)雜而精細(xì)，并不適合小學(xué)生模仿。我們針對展品的特點(diǎn)，設(shè)置了操作性強(qiáng)的實(shí)踐項(xiàng)目，比如：根據(jù)御窯金磚的制作技藝，我們設(shè)計(jì)了瓷盤制作的實(shí)踐內(nèi)容;根據(jù)蟋蟀罐的制作技藝，設(shè)計(jì)了泥塑、筆筒的實(shí)踐內(nèi)容;根據(jù)緙絲的制作技藝，設(shè)計(jì)了編織的實(shí)踐內(nèi)容。這些拓展實(shí)踐項(xiàng)目已經(jīng)成為了學(xué)校的特色社團(tuán)活動(dòng)，學(xué)校也在積極編寫相關(guān)的校本教材。整個(gè)結(jié)構(gòu)主要包含了封面模塊，圖文模塊，視頻模塊，交互模塊等。關(guān)于封面設(shè)計(jì)，采用與展品及校園特色文化建設(shè)相符的“蘇式”風(fēng)格，用戶可通過三個(gè)通道分別瀏覽富有御窯文化特色的三件展品，也可以觀看學(xué)校傳承御窯文化的宣傳片。在進(jìn)入三維展廳后可以通過點(diǎn)擊指定的熱點(diǎn)參觀學(xué)習(xí)。

三、操作界面設(shè)計(jì)

隨著計(jì)算機(jī)技術(shù)和信息技術(shù)的不斷發(fā)展，新媒體、新技術(shù)在各領(lǐng)域中的應(yīng)用迅速而廣泛，并在人們的日常生活中發(fā)揮著積極的作用。處在這樣的信息社會(huì)，許多高新技術(shù)等待著我們?nèi)グl(fā)現(xiàn)和運(yùn)用。就操作界面來說，再也僅僅不局限于美工的設(shè)計(jì)與制作，通過代碼我們能夠?qū)崿F(xiàn)系統(tǒng)和用戶間的信息交流，它所傳達(dá)的信息能讓人們理解并接受，也被稱為人機(jī)接口[1]。很顯然，操作界面是人機(jī)交互的首要場所，正不斷得到各領(lǐng)域的關(guān)注，作為人機(jī)交互的接口，用戶與系統(tǒng)的信息交換始于此，其重要性不言而喻。如今，對于操作界面的設(shè)計(jì)越來越受重視，尤其是軟件設(shè)計(jì)行業(yè)。

本項(xiàng)目中，界面的設(shè)計(jì)使用青磚白墻黑瓦的“蘇式”風(fēng)格，封面內(nèi)容主要包括御窯金磚、蟋蟀罐、緙絲這三項(xiàng)御窯文化的典型代表，單擊相關(guān)圖標(biāo)都能通過文字、圖片、視頻三種方式了解其歷史沿革等?！坝G文化”圖標(biāo)主要向參觀者介紹御窯小學(xué)在“傳承御窯文化，爭創(chuàng)一流教育”過程中的點(diǎn)滴做法與取得的成績。單擊左側(cè)朱紅色的大門便可進(jìn)入勞技作品展示廳。事實(shí)上，為了讓參觀者能夠身臨其境，虛擬展廳內(nèi)部的環(huán)境與現(xiàn)實(shí)中的御窯文化展示廳高度相似。而本項(xiàng)目中對御窯文化的虛擬展示主要就是通過對展廳虛擬場景的設(shè)計(jì)和創(chuàng)建來實(shí)現(xiàn)的。

四、虛擬展廳的場景設(shè)計(jì)

（一）場景布局設(shè)計(jì)

虛擬展廳場景的布局設(shè)計(jì)必須遵循一定的秩序，在特定的空間內(nèi)，通過視覺傳達(dá)手段將預(yù)設(shè)的全部信息科學(xué)、合理地展現(xiàn)給用戶，力爭對用戶的心理和行動(dòng)起到積極的作用。這樣做是為了讓展示功能最終得以實(shí)現(xiàn)，其核心是怎樣高效的將需要表達(dá)的信息有效地傳遞給觀眾[2]。

在準(zhǔn)備階段，我們首先確定了項(xiàng)目的整體風(fēng)格為“蘇式江南風(fēng)”，并嚴(yán)格參照實(shí)景，對虛擬展廳將要實(shí)現(xiàn)的功能進(jìn)行了討論與規(guī)劃。本項(xiàng)目中，筆者手工繪制了展廳的平面圖并進(jìn)行了功能區(qū)域的劃分，在此基礎(chǔ)上運(yùn)用AutoCAD 2007對虛擬展廳的場景進(jìn)行布局。期間，項(xiàng)目組對虛擬展廳的布局進(jìn)行了反復(fù)的商討，為了充分發(fā)揮展廳的展示與學(xué)習(xí)功能，我們討論決定將展廳中央的操作臺換成了學(xué)校的特色教學(xué)項(xiàng)目“御窯金磚書寫桌”。在多次修改之后，最終形成統(tǒng)一意見，將方案確定下來。由于展廳的主要用戶為學(xué)生和教師，因此，整個(gè)展廳的功能設(shè)計(jì)考慮御窯文化體驗(yàn)與學(xué)生勞技作品制作兩條主線。中式廊道、蘇式吊頂、金磚、花邊滴水瓦等，就是讓用戶在游覽中學(xué)習(xí)了解御窯文化。然而，展品上的視頻圖標(biāo)則是為學(xué)生的學(xué)習(xí)準(zhǔn)備，只要單擊圖標(biāo)便能播放御窯小學(xué)勞技教研組精心錄制并編輯的各種學(xué)習(xí)視頻，通過視頻了解這些物品的歷史與制作方法。

（二）虛擬場景構(gòu)建

展廳的各項(xiàng)虛擬交互功能由Unity3D來實(shí)現(xiàn)的。不過，由于Unity3D本身不能夠場景建模，因此建模的工作還需借助其它軟件來實(shí)現(xiàn)，本項(xiàng)目中的模型是運(yùn)用3ds Max 2014完成制作的。三維建模是虛擬現(xiàn)實(shí)技術(shù)中的一項(xiàng)重要研究[3]。如今，應(yīng)用市場上能進(jìn)行3D建模的軟件很多。Maya和3ds Max是其中的主流，很多專業(yè)設(shè)計(jì)師選用這兩款軟件進(jìn)行3D建模。作為兩款最受歡迎的建模軟件，兩者在功能上互有優(yōu)勢。就3ds Max而言，在構(gòu)建場景和為模型添加材質(zhì)方面比Maya具有更加便捷、高效的表現(xiàn);Maya則是制作3D動(dòng)畫的最佳選擇。根據(jù)兩款軟件的特點(diǎn)，本項(xiàng)目最終選用3ds Max制作三維模型，一方面是因?yàn)樗m合完成本項(xiàng)目中場景模型及相關(guān)展品模型的構(gòu)建，另一方面也是因?yàn)?ds Max軟件對于非專業(yè)人士而言更易理解，更好上手，而且它的功能強(qiáng)大，對計(jì)算機(jī)硬件的要求也不是很高。此外，除了能制作三維模型，用戶還能通過3ds Max中提供的腳本語言直接控制模型[4]。

五、三維游覽系統(tǒng)的設(shè)計(jì)

（一）設(shè)計(jì)思路

首先，對典型物品進(jìn)行拍照，運(yùn)用Photoshop CS制作好貼圖。然后，在確保與實(shí)景高度吻合的基礎(chǔ)上，運(yùn)用AutoCAD2007將虛擬展廳的平面圖繪制出來。完成布局圖與貼圖后，用3ds Max 2014對展廳進(jìn)行建模，并將建好的場景模型導(dǎo)出，儲(chǔ)存為FBX格式。隨后，在Unity3D平臺中導(dǎo)入事先保存好的FBX格式的場景模型，運(yùn)用Unity3D軟件為場景添加照明、燈帶等效果，完成燈光渲染與烘焙，最后進(jìn)行代碼的編寫，實(shí)現(xiàn)在虛擬展廳中的移動(dòng)控制以及操作界面中功能菜單和導(dǎo)航欄的交互功能等。這樣，虛擬展廳就實(shí)現(xiàn)了自主游覽及人機(jī)交互的功能。完成以上工作后，在Unity3D平臺上將文件打包發(fā)布，保存為EXE格式的可執(zhí)行文件，當(dāng)然如果要掛在校園網(wǎng)上的話，可以發(fā)布成網(wǎng)絡(luò)文件。至此，整個(gè)三維游覽系統(tǒng)就制作完成了。本系統(tǒng)的場景逼真，交互內(nèi)容豐富，操作簡便，并成功實(shí)現(xiàn)了3D展示、互動(dòng)學(xué)習(xí)等功能，滿足學(xué)生自主學(xué)習(xí)和教師輔助教學(xué)的需要。此外，本系統(tǒng)的開發(fā)周期短，對開發(fā)人員的專業(yè)知識要求不高，也不需要投入大量的開發(fā)資金，適合在基礎(chǔ)教育階段的公辦學(xué)校內(nèi)推廣。

（二）開發(fā)流程

與普通的程序開發(fā)相比，三維虛擬程序的開發(fā)需要考慮更多的因素，過程相對復(fù)雜。在編寫基本程序的同時(shí)，必須考慮模型顯示、人機(jī)交互、物理運(yùn)算等邏輯關(guān)系[6]。本系統(tǒng)中，Unity3D的開發(fā)過程包含兩個(gè)方面：一是導(dǎo)入制作好的貼圖素材和展廳模型，二是為虛擬展廳實(shí)現(xiàn)游覽、交互等相關(guān)功能。導(dǎo)入素材及模型指的是把Photoshop CS軟件中處理好的貼圖素材和3ds Max 2014中制作好的展廳模型一同導(dǎo)入到 Unity3D軟件中，貼圖素材推薦使用PNG格式，模型格式使用FBX格式。功能實(shí)現(xiàn)階段的重點(diǎn)工作就是相關(guān)程序的編寫，這里值得注意的是，在編寫代碼時(shí)，要從需求分析著手，用軟件工程的想法通盤考慮開發(fā)過程[7]。

我們收集了大量與御窯文化相關(guān)的資料，為項(xiàng)目的開發(fā)做好充分的準(zhǔn)備。在登錄界面上，我們展示了三件具有御窯文化特色代表性的物件，并以蘇式朱紅色大門作為虛擬展廳的入口。在虛擬展廳中，我們根據(jù)御窯傳統(tǒng)文化和手工藝作品的展示需要，結(jié)合小學(xué)勞技課程指導(dǎo)綱要，以及小學(xué)生的認(rèn)知特點(diǎn)，運(yùn)用3ds Max 2014對展廳場景及展品進(jìn)行建模，隨后，通過Unity3D平臺完成三維游覽系統(tǒng)的制作。需要注意的是，為了讓用戶體驗(yàn)到真實(shí)感，虛擬展廳要做到盡可能還原御窯文化展示廳的真實(shí)面貌，我們在對模型進(jìn)行貼圖操作時(shí)要根據(jù)模型特點(diǎn)選擇合適的素材，比如展廳內(nèi)中式廊道柱子的材質(zhì)與金磚書寫板桌面的材料相近，但我們不能使用同樣的貼圖，根據(jù)嚴(yán)格按照實(shí)物特點(diǎn)選擇貼圖。所以，取樣的時(shí)候一定要多拍一些照片，用Photoshop多制作些貼圖素材。此外，在為復(fù)雜的模型貼圖時(shí)，要學(xué)會(huì)隨機(jī)應(yīng)變，靈活處理。所有貼圖工作要嚴(yán)格按照設(shè)計(jì)方案有序進(jìn)行。在Unity3D平臺上開發(fā)制作，全程都是可視的，開發(fā)者可以一邊開發(fā)一邊測試，直至項(xiàng)目的最終完成。

整個(gè)開發(fā)過程為：在Photoshop CS中制作貼圖素材，保存為PNG格式;在AutoCAD 2007中繪制平面圖形;在3ds Max 2014中對場景進(jìn)行建模并完成貼圖后發(fā)布為FBX 格式的文件;在Unity3D中導(dǎo)入FBX文件，對場景模型進(jìn)行烘焙與渲染，隨后進(jìn)行三維游覽系統(tǒng)的開發(fā)，完成各項(xiàng)檢測后打包發(fā)布成EXE文件。

參考文獻(xiàn)：

[1]劉偉，莊達(dá)民，柳忠起.人機(jī)界面設(shè)計(jì)[M].北京郵電大學(xué)出版社，2011.

[2]郭磊，張春紅.基于Web3D技術(shù)的企業(yè)虛擬展廳設(shè)計(jì)[J].科技傳播，2011.