虛擬現(xiàn)實(shí)方向畢業(yè)設(shè)計(jì)中可視化編程研究

摘 ?要：在數(shù)字媒體藝術(shù)設(shè)計(jì)專業(yè)的畢業(yè)設(shè)計(jì)中，常常因?yàn)閷W(xué)生缺乏專業(yè)的編程經(jīng)驗(yàn)，導(dǎo)致作品的完成度受到桎梏。將可視化編程融入作品開(kāi)發(fā)中，可有效降低非程序員編寫(xiě)腳本代碼的難度，使其可將更多的精力投入到作品設(shè)計(jì)和美工方面，以提高畢設(shè)作品的藝術(shù)性、美觀性、科技性，同時(shí)還會(huì)培養(yǎng)學(xué)生的計(jì)算思維，為他們?cè)诮窈蠊ぷ髦薪鉀Q難題提供幫助。文章以使用UE4引擎中的藍(lán)圖制作天氣變化的案例，講解可視化編程中流程控制的應(yīng)用。

關(guān)鍵詞：虛擬現(xiàn)實(shí);畢業(yè)設(shè)計(jì);可視化編程;計(jì)算思維;UE4引擎

中圖分類號(hào)：TP311 ? 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：2096-4706（2021）12-0068-04

Abstract： In the graduation project of digital media art design specialty， the completion of works is often shackled due to students' lack of professional programming experience. Integrating visual programming into work development can effectively reduce the difficulty of non-programmers in writing script code， so that they can devote more energy to work design and art work， so as to improve the artistry， aesthetics， science and technology of finished works. Furthermore， it will also cultivate students' computational thinking and help them solve difficulties in their future work. Through an example of making weather change by using the blueprint in UE4 engine， this paper explains the application of process control in visual programming.

Keywords： virtual reality; graduation project; visual programming; computational thinking; UE4 engine

0 ?引 ?言

隨著計(jì)算機(jī)技術(shù)、網(wǎng)絡(luò)技術(shù)、硬件技術(shù)等相關(guān)領(lǐng)域的發(fā)展，虛擬技術(shù)逐漸走向大眾。畢業(yè)設(shè)計(jì)中使用虛擬現(xiàn)實(shí)技術(shù)制作或呈現(xiàn)作品是各大專業(yè)的趨勢(shì)。我校的數(shù)字媒體藝術(shù)設(shè)計(jì)專業(yè)，畢業(yè)設(shè)計(jì)中設(shè)有虛擬現(xiàn)實(shí)方向，主要是將虛擬現(xiàn)實(shí)相關(guān)技術(shù)應(yīng)用到畢設(shè)中，以提高作品的藝術(shù)性、美觀性、科技性。然而，在實(shí)際教學(xué)和畢設(shè)創(chuàng)作中發(fā)現(xiàn)，由于該專業(yè)屬于藝術(shù)類，學(xué)生對(duì)編寫(xiě)代碼的功夫欠缺，無(wú)論是使用哪種編程語(yǔ)言，他們都需要花費(fèi)大量的的時(shí)間去掌握和運(yùn)用。可視化編程對(duì)使用者的門檻比較低，只需掌握基本使用方法，便可游刃有余地對(duì)畢設(shè)類小型作品進(jìn)行簡(jiǎn)單的交互制作。同時(shí)，學(xué)生可將更多的精力投入到作品的開(kāi)發(fā)設(shè)計(jì)和視覺(jué)美觀中，將專業(yè)的藝術(shù)特性融入到作品之中，使作品質(zhì)量得到可視性提高。

1 ?虛擬現(xiàn)實(shí)方向的畢業(yè)設(shè)計(jì)現(xiàn)狀

1.1 ?虛擬現(xiàn)實(shí)

虛擬現(xiàn)實(shí)（Virtual Reality， VR）是一門融合了計(jì)算機(jī)、電子信息、仿真技術(shù)等多個(gè)領(lǐng)域的一項(xiàng)全新的實(shí)用技術(shù)，其具有沉浸性、交互性和想象性的特點(diǎn)。應(yīng)用范圍也非常廣泛，除了常見(jiàn)的游戲、動(dòng)畫(huà)、電影等娛樂(lè)領(lǐng)域，還在醫(yī)學(xué)、軍事、航天、教學(xué)等領(lǐng)域發(fā)揮著越來(lái)越重要的作用，因此被譽(yù)為21世紀(jì)最有“前途”的技術(shù)。

1.2 ?數(shù)媒專業(yè)畢業(yè)設(shè)計(jì)現(xiàn)狀

畢業(yè)設(shè)計(jì)是對(duì)五年制高職學(xué)生學(xué)習(xí)成果的總體檢驗(yàn)，在畢設(shè)創(chuàng)作中，需要選擇合適的技術(shù)來(lái)匹配學(xué)生水平，使作品的完成度、藝術(shù)性都有很好的體現(xiàn)。目前數(shù)字媒體藝術(shù)設(shè)計(jì)專業(yè)的主要課程屬于藝術(shù)類。學(xué)生對(duì)作品的設(shè)計(jì)、呈現(xiàn)有很多上乘的創(chuàng)意和想法，而在畢設(shè)中發(fā)現(xiàn)，制約學(xué)生完成“藝術(shù)性創(chuàng)作”的最大障礙是“交互”。交互性作為虛擬現(xiàn)實(shí)的三大特點(diǎn)之一，是決定作品是否可以完成以及作品體驗(yàn)感好壞的關(guān)鍵點(diǎn)。所謂交互，在技術(shù)上依賴于“編程”。因此選用哪款軟件來(lái)完成畢設(shè)作品，是在啟動(dòng)創(chuàng)作之前最值得斟酌的問(wèn)題。

2 ?編程的選擇

2.1 ?編程的實(shí)質(zhì)

2020年發(fā)布的《關(guān)于政協(xié)十三屆全國(guó)委員會(huì)第三次會(huì)議提案答復(fù)的函》中，教育部提到將編程教育納入中小學(xué)相關(guān)課程，幫助學(xué)生掌握信息技術(shù)基礎(chǔ)知識(shí)與技能、增強(qiáng)信息意識(shí)、發(fā)展計(jì)算思維、提高數(shù)字化學(xué)習(xí)與創(chuàng)新能力、樹(shù)立正確的信息社會(huì)價(jià)值觀和責(zé)任感。目前，我國(guó)中小學(xué)普遍開(kāi)設(shè)了編程課，其重點(diǎn)是培養(yǎng)學(xué)生的計(jì)算思維（Computational Thinking）。計(jì)算思維是未來(lái)發(fā)展的核心技能，是運(yùn)用計(jì)算機(jī)科學(xué)的基礎(chǔ)概念進(jìn)行問(wèn)題求解、系統(tǒng)設(shè)計(jì)以及人類行為理解等涵蓋計(jì)算機(jī)科學(xué)之廣度的一系列思維活動(dòng)。通俗地說(shuō)，編程課的目的是為了讓學(xué)生更好地去接受信息化社會(huì)，而不是學(xué)會(huì)“寫(xiě)代碼”這一專業(yè)技術(shù)。

2.2 ?可視化編程

絆住數(shù)媒專業(yè)學(xué)生畢設(shè)創(chuàng)作腳步的，是“寫(xiě)代碼”本身。虛擬現(xiàn)實(shí)技術(shù)方面的軟件種類繁多，各自運(yùn)用的編程語(yǔ)言都不盡相同，在有限的學(xué)習(xí)時(shí)間內(nèi)，只能各有取舍。目前歷屆數(shù)媒學(xué)生有一個(gè)共同點(diǎn)就是，從小缺乏計(jì)算思維的培養(yǎng)和某一編程語(yǔ)言的學(xué)習(xí)經(jīng)驗(yàn)，對(duì)“寫(xiě)代碼”有著先入為主的恐懼感。

對(duì)于此類學(xué)生，可視化編程是一個(gè)不二之選。所謂可視，指的是無(wú)須編寫(xiě)代碼，使用圖形化界面進(jìn)行較為直觀的操作流程，且隨時(shí)可以看到結(jié)果，程序與結(jié)果的調(diào)整同步。相較于傳統(tǒng)的編程方式，可視化編程非常適合新手或業(yè)余程序員。可視化編程軟件分為基于“塊”的編程，如Scratch等適用于兒童或新手學(xué)習(xí)者的編程教育;以及基于“節(jié)點(diǎn)”的編程，如UE4等使用流程圖來(lái)表示狀態(tài)、邏輯或數(shù)據(jù)的變化。目前Unity 3D可免費(fèi)加載圖形化編程插件BOLT。

使用可視化編程可以有效地避免語(yǔ)法錯(cuò)誤，解開(kāi)代碼對(duì)學(xué)生創(chuàng)作的桎梏。有助于將數(shù)字媒體藝術(shù)設(shè)計(jì)專業(yè)中的藝術(shù)與技術(shù)充分結(jié)合。

3 ?UE4藍(lán)圖的流程控制

3.1 ?數(shù)學(xué)中的程序框圖

在五年制高職學(xué)生第三冊(cè)數(shù)學(xué)教材（江蘇省職業(yè)學(xué)校文化課教材，鳳凰職教出版社）中，有一章專門講解算法與程序框圖。可能學(xué)生在當(dāng)時(shí)并沒(méi)有留下很深的印象，只需把本章數(shù)學(xué)內(nèi)容熟練掌握，即可完成對(duì)編程流程控制的學(xué)習(xí)。程序框圖分為順序結(jié)構(gòu)、條件結(jié)構(gòu)和循環(huán)結(jié)構(gòu)，并給出了相應(yīng)的數(shù)學(xué)基礎(chǔ)練習(xí)題。在學(xué)習(xí)藍(lán)圖操作時(shí)，可以使用這些題目。其實(shí)在編程中還有大量的數(shù)學(xué)基礎(chǔ)知識(shí)，都可以在有需求時(shí)，進(jìn)行學(xué)習(xí)鞏固。程序框圖的條件結(jié)構(gòu)如圖1所示。

3.2 ?藍(lán)圖中的流程控制

UE4是虛幻引擎4的簡(jiǎn)稱，是開(kāi)發(fā)商EpicGames的核心作品之一，近期已推出了虛幻引擎5版本。該引擎最初是以游戲開(kāi)發(fā)為主，現(xiàn)在已經(jīng)運(yùn)用到影視與現(xiàn)場(chǎng)活動(dòng)、建筑、工程與施工、汽車、產(chǎn)品設(shè)計(jì)和制造等多個(gè)領(lǐng)域。其以精湛的渲染畫(huà)質(zhì)、可視化編程——藍(lán)圖、免費(fèi)開(kāi)源等特點(diǎn)，吸引越來(lái)越多人去學(xué)習(xí)創(chuàng)作。

圖2為經(jīng)典C語(yǔ)言中的條件語(yǔ)句，不能因看到語(yǔ)句簡(jiǎn)練而產(chǎn)生“我也可以勝任”的想法，這只是單條件語(yǔ)句，一般會(huì)出現(xiàn)多條件嵌套的情況，且具體步驟A、B還需要詳細(xì)地編寫(xiě)代碼。在編寫(xiě)的幾百、幾千行代碼中尋找編譯的錯(cuò)誤，是一件非常苦惱的事情。有人將搜尋代碼比喻為在黑暗中舉著火把查看一大面墻上的信息，難度極大。

在UE4藍(lán)圖中，只需要右鍵單擊鼠標(biāo)搜索中文“分支”即可快速創(chuàng)建出條件結(jié)構(gòu)，然后將對(duì)應(yīng)的條件、步驟進(jìn)行鼠標(biāo)拉線連接。如圖3所示，其使用方式和圖1數(shù)學(xué)程序框圖非常相似，有助于開(kāi)發(fā)者的代碼編寫(xiě)和調(diào)試。程序框圖有規(guī)范的圖形符號(hào)和連接線，表示不同的算法步驟意義。藍(lán)圖中同樣用不同的顏色來(lái)區(qū)分不同的節(jié)點(diǎn)，如事件節(jié)點(diǎn)、執(zhí)行節(jié)點(diǎn)、讀取節(jié)點(diǎn)，分別用紅、藍(lán)、綠表示。包括節(jié)點(diǎn)的引腳，根據(jù)數(shù)據(jù)類型也有各自的顏色。有些可以轉(zhuǎn)換的數(shù)據(jù)，在相連時(shí)會(huì)自動(dòng)添加類型轉(zhuǎn)換節(jié)點(diǎn)，再也不必?fù)?dān)心變量轉(zhuǎn)換出錯(cuò)了。程序框圖是由上至下的，藍(lán)圖是從左向右。在模擬運(yùn)行時(shí)，流程進(jìn)行中連接線會(huì)以實(shí)時(shí)動(dòng)態(tài)的形式進(jìn)行演示，可隨時(shí)查看編譯過(guò)程和運(yùn)行結(jié)果，可視化為黑暗中的人提供了清晰的視角。

當(dāng)然藍(lán)圖中不止是分支，還包含編程常用的序列、循環(huán)、執(zhí)行一次、執(zhí)行N次、門等。根據(jù)編程的需要，可以通過(guò)搜索快速選擇這些節(jié)點(diǎn)。藍(lán)圖按功能可以分為關(guān)卡藍(lán)圖、藍(lán)圖類等，除流程控制這一基本功能之外，可以說(shuō)所有的交互功能都可以通過(guò)藍(lán)圖來(lái)實(shí)現(xiàn)。同時(shí)，UE4中的物理基礎(chǔ)渲染PRB材質(zhì)，也是藍(lán)圖的一種，可以將各種復(fù)雜的數(shù)學(xué)計(jì)算方式融合到節(jié)點(diǎn)和連線中，讓美術(shù)人員通過(guò)參數(shù)快速調(diào)節(jié)所需的視覺(jué)效果。

4 ?天氣變化案例的制作

4.1 ?案例流程圖

以天氣變化——雨雪為例，使用UE4引擎藍(lán)圖來(lái)進(jìn)行簡(jiǎn)單的創(chuàng)作，展示可視化編程流程控制的應(yīng)用。編寫(xiě)之前先進(jìn)行需求分析，繪制流程圖。

需求分析：程序開(kāi)始后進(jìn)行降雨，水面濺起雨花，地面逐漸濕潤(rùn)。降雨漸小，直到停止，雨花消失。之后進(jìn)行降雪，地表逐漸積雪，雪停后積雪消融，流程圖如圖4所示。為匹配藍(lán)圖的編寫(xiě)習(xí)慣，特使用橫向排版，從左至右。另外，對(duì)雨花生成制作單獨(dú)的事件，流程圖如圖5所示。

4.2 ?素材的準(zhǔn)備

4.2.1 ?地形的制作

新建一個(gè)空關(guān)卡，使用地形工具Landscape，創(chuàng)建新的地形并進(jìn)行繪制。制作地形材質(zhì)球，UE4中為達(dá)到逼真的視覺(jué)效果，在高級(jí)材質(zhì)制作中，會(huì)用到很多復(fù)雜的數(shù)學(xué)公式、材質(zhì)函數(shù)等。案例中僅簡(jiǎn)單地設(shè)置分層材質(zhì)，包括草地、石頭、泥土。為達(dá)到所需的案例效果：針對(duì)地面濕潤(rùn)和積雪添加兩個(gè)材質(zhì)函數(shù)集Snow和Wet，分別兩個(gè)材質(zhì)函數(shù)集添加一個(gè)標(biāo)量參數(shù)，設(shè)置相應(yīng)的名字，并設(shè)置默認(rèn)值為0。材質(zhì)函數(shù)集可以直接拖拽到材質(zhì)編輯面板中進(jìn)行使用，標(biāo)量參數(shù)指單個(gè)的數(shù)值，還有向量參數(shù)，包含RGBA四個(gè)參數(shù)。

如果需要更加逼真的效果，可以對(duì)雨花、地面濕潤(rùn)水流效果、積雪進(jìn)行單獨(dú)的材質(zhì)制作，使用材質(zhì)中的UV移動(dòng)動(dòng)畫(huà)來(lái)實(shí)現(xiàn)，這種渲染方法對(duì)性能要求不高，可以渲染出有一定實(shí)感的物體。

4.2.2 ?藍(lán)圖1：雨花生成編寫(xiě)

使用UE4粒子系統(tǒng)分別制作：雨、雨花。其中，在雨的粒子中“生成”標(biāo)簽中設(shè)置參數(shù)NumberR，用來(lái)在藍(lán)圖中控制雨量的大小。創(chuàng)建一個(gè)靜態(tài)網(wǎng)格體平面，設(shè)置合適的大小，放置在地形凹處作為湖面，對(duì)其設(shè)置合適的湖水材質(zhì)。

編寫(xiě)中，單獨(dú)制作比較復(fù)雜的流程，這樣既可以使總流程清晰明了，又可以實(shí)現(xiàn)復(fù)用，這邊對(duì)雨花生成單獨(dú)制做了藍(lán)圖。在藍(lán)圖1雨花生成中，創(chuàng)建自定義事件“生成雨花”，設(shè)置變量：Rain Flower（布爾型），用來(lái)判斷是否需要執(zhí)行后面的操作。如果變量為真，則執(zhí)行：檢測(cè)粒子雨的碰撞，如有則在一定范圍內(nèi)隨機(jī)生成雨花粒子（檢測(cè)湖的邊界）;如沒(méi)有，則中斷。此處使用了“分支”“For Loop”，如圖6所示，很好地體現(xiàn)了流程控制的簡(jiǎn)潔性，只需從節(jié)點(diǎn)的輸入和輸出分別拉線，就可以如流程圖所示對(duì)流程事件進(jìn)行條件判斷、循環(huán)操作。

4.2.3 ?藍(lán)圖2：天氣變化準(zhǔn)備

制作粒子：降雪，也可以增加參數(shù)NumberS，用來(lái)控制雪量。創(chuàng)建變量：Lake（引用藍(lán)圖1雨花生成，并對(duì)其賦值）。在藍(lán)圖2天氣變化中，為了達(dá)到“漸進(jìn)”的效果，分別創(chuàng)建三個(gè)時(shí)間軸：濕潤(rùn)、雨量、積雪。時(shí)間軸的作用可理解為對(duì)時(shí)間線上的不同時(shí)間點(diǎn)設(shè)置關(guān)鍵幀，制作直線或曲線，類似于繪制數(shù)學(xué)函數(shù)圖，從而達(dá)到數(shù)值漸變的效果。時(shí)間線在后期類、動(dòng)畫(huà)類軟件中都很常見(jiàn)，在藍(lán)圖中輸入輸出項(xiàng)較多，可以制作出不同的效果。

4.3 ?整體案例的編寫(xiě)

最后在藍(lán)圖2天氣變化中做整體案例編寫(xiě)。根據(jù)流程圖按順序連接各節(jié)點(diǎn)即可，對(duì)同時(shí)進(jìn)行的事件可以使用“序列”來(lái)控制，如圖7所示，也可以通過(guò)時(shí)間軸節(jié)點(diǎn)上的不同輸出項(xiàng)“Update”“Finished”來(lái)分支，如圖8所示。最后的積雪消融效果，也可以使用時(shí)間軸節(jié)點(diǎn)上的輸入項(xiàng)“Reverse”進(jìn)行時(shí)間軸的倒播，而無(wú)須再重新編寫(xiě)一遍消融，比流程圖更簡(jiǎn)潔。

此外，藍(lán)圖中還使用了節(jié)點(diǎn)：“添加粒子系統(tǒng)組件”“設(shè)置標(biāo)量參數(shù)”用來(lái)添加雨雪粒子和降雨雪量。為使效果更加清晰，中間可添加節(jié)點(diǎn)“延遲”。這些節(jié)點(diǎn)都可以在需要使用時(shí)，參考官網(wǎng)、圖書(shū)、視頻教程等，了解其用法。

至此，天氣變化簡(jiǎn)單案例的制作已完成，將藍(lán)圖2拖入關(guān)卡，點(diǎn)擊播放可以看到完成的效果，如圖9、圖10所示。本文僅對(duì)流程控制節(jié)點(diǎn)進(jìn)行了講解，突出可視化編程的優(yōu)勢(shì)。無(wú)論選用何種編程方式，編寫(xiě)中都不可避免地會(huì)出現(xiàn)錯(cuò)誤，還是需要不斷地進(jìn)行調(diào)試-編寫(xiě)-調(diào)試。至少，可以不用在語(yǔ)法檢查上花費(fèi)時(shí)間了。

5 ?結(jié) ?論

本文以UE4藍(lán)圖制作天氣變化為例，展示可視化編程使流程控制更加清晰便捷，解決了目前部分?jǐn)?shù)媒學(xué)生在“寫(xiě)代碼”方面所存在不足。將可視化編程引入藝術(shù)類畢業(yè)設(shè)計(jì)創(chuàng)作，可提高畢設(shè)作品的藝術(shù)性、美觀性、科技性，以使畢業(yè)生設(shè)計(jì)出優(yōu)秀的虛擬現(xiàn)實(shí)作品。同時(shí)逐漸培養(yǎng)學(xué)生的計(jì)算思維，為就業(yè)做準(zhǔn)備。

對(duì)于藍(lán)圖的學(xué)習(xí)，初期只需掌握基本操作和常用節(jié)點(diǎn)即可，龐大的藍(lán)點(diǎn)可以在需要使用時(shí)選擇性地學(xué)習(xí)。目前學(xué)生都可以很好地根據(jù)教程案例進(jìn)行模仿、移植，完成簡(jiǎn)單交互的作品。為了能夠使作品流暢地運(yùn)行在不同的平臺(tái)上，還需要對(duì)編程進(jìn)行優(yōu)化，使作品既有很好的視覺(jué)效果，又不會(huì)太消耗資源造成卡頓，這些還需要繼續(xù)研究學(xué)習(xí)。

參考文獻(xiàn)：

[1] 教育部.關(guān)于政協(xié)十三屆全國(guó)委員會(huì)第三次會(huì)議第3172號(hào)（教育類297號(hào)）提案答復(fù)的函 [EB/OL].（2020-11-06）.http：//www.moe.gov.cn/jyb_xxgk/xxgk_jyta/jyta_jiaocaiju/202012/t20201209_504364.html.

[2] 本刊編輯部.美國(guó)計(jì)算機(jī)科學(xué)家周以真：使計(jì)算思維成為常識(shí) [J].留學(xué)生，2017（8）：13-15.

[3] 朱月曈.可復(fù)用的雨天場(chǎng)景材質(zhì)設(shè)計(jì)與實(shí)現(xiàn) [J].影視制作，2021，27（2）：55-60.

[4] 朱海南，萬(wàn)定生，余洋.基于UE4的洪水淹沒(méi)仿真技術(shù)研究與應(yīng)用 [J].信息技術(shù)，2020，44（3）：13-18.

[5] 孔晨.UE4在高校設(shè)計(jì)類專業(yè)虛擬現(xiàn)實(shí)課程中的教學(xué)應(yīng)用 [J].機(jī)電信息，2020（23）：40-41.

[6] 玄令岐.基于UE4的迷宮逃生游戲設(shè)計(jì) [J].電子質(zhì)量，2017（3）：42-46.

作者簡(jiǎn)介：田晉（1983.10—），漢族，江蘇蘇州人，講師，碩士研究生，研究方向：信息技術(shù)、數(shù)字媒體。