羅立宏， 宋擇林

(廣東工業(yè)大學(xué) 藝術(shù)設(shè)計(jì)學(xué)院， 廣州 510006)

0 引 言

互動(dòng)投影是一種新型的多媒體展示技術(shù)，利用先進(jìn)的計(jì)算機(jī)視覺(jué)技術(shù)和投影顯示技術(shù)來(lái)營(yíng)造一種奇幻動(dòng)感的交互體驗(yàn)[1]。從技術(shù)原理上看：它首先通過(guò)感應(yīng)設(shè)備捕捉到人體運(yùn)動(dòng)的信息；這些信息送往影像分析系統(tǒng)進(jìn)行分析．識(shí)別出人體的動(dòng)作及其變化；影像播放系統(tǒng)根據(jù)識(shí)別出的動(dòng)作及其變化播放相應(yīng)的影像．并利用投影儀等設(shè)備將影像投射到特定的位置上，從而實(shí)現(xiàn)人體的運(yùn)動(dòng)動(dòng)作與影像之間的互動(dòng)[2]。

互動(dòng)投影技術(shù)和觸摸屏技術(shù)完全不同：① 觸摸屏技術(shù)需要一個(gè)與人體接觸的介質(zhì)(觸摸屏)來(lái)感應(yīng)動(dòng)作，這樣動(dòng)作就必須施加到一個(gè)載體上；互動(dòng)投影則不需要，參與者只要在特定的區(qū)域內(nèi)，可以自由動(dòng)作。② 觸摸屏技術(shù)能夠處理的動(dòng)作少而簡(jiǎn)單．只有利用手指點(diǎn)擊、滑動(dòng)、移動(dòng)等，只是用手指替代了鼠標(biāo);互動(dòng)投影可以采用身體的任何部分來(lái)產(chǎn)生動(dòng)作．包括手、腳、頭等部位，動(dòng)作可以自由發(fā)揮．可以是揮手、踢腳．踩、跳等。③ 觸摸屏技術(shù)交互的對(duì)象是觸摸屏，而互動(dòng)投影技術(shù)交互的對(duì)象是影像．是對(duì)投影的影像施加交互動(dòng)作。由于互動(dòng)投影具有很強(qiáng)的互動(dòng)體驗(yàn)感，相對(duì)于傳統(tǒng)的鼠標(biāo)、鍵盤(pán)為主的交互方式，在互動(dòng)上發(fā)生了革命的變化．使人能夠通過(guò)影像和姿勢(shì)變化進(jìn)行交互，更加人性化。隨著近年研究的深入，互動(dòng)投影還可對(duì)人體細(xì)微的動(dòng)作如手勢(shì)[3-4]、指尖活動(dòng)[5]進(jìn)行捕捉和分析，還可與增強(qiáng)現(xiàn)實(shí)結(jié)合在一起[6]，使互動(dòng)投影的交互方式更加精確化和多樣化。

互動(dòng)投影屬于虛擬現(xiàn)實(shí)技術(shù)的一種，這種技術(shù)在產(chǎn)品廣告、新車發(fā)布、建筑展示[7-8]、數(shù)字娛樂(lè)[9]、教育[10]甚至醫(yī)療領(lǐng)域[11]也有廣泛的應(yīng)用。在酒吧、兒童游樂(lè)場(chǎng)所應(yīng)用較多。游戲形式多種多樣：有摸魚(yú)、下棋、擊鼓、踢球、角色互動(dòng)等。

然而，以上提及的這些應(yīng)用中，把互動(dòng)投影用于藝術(shù)創(chuàng)作的還不多。但近年也有一些藝術(shù)家進(jìn)行了一些實(shí)踐。2015年，日本關(guān)系學(xué)院大學(xué)曾經(jīng)開(kāi)發(fā)了一個(gè)多人交互互動(dòng)投影映射系統(tǒng)，把互動(dòng)作品投影到建筑物上并與多人互動(dòng)[12]。2016年，Lange等[13]開(kāi)發(fā)了一個(gè)由多投影實(shí)現(xiàn)的混合現(xiàn)實(shí)繪畫(huà)系統(tǒng)，可以在虛擬空間中噴涂作畫(huà)。互動(dòng)投影是一種新型的多媒體手段，可以作為一種新的數(shù)字藝術(shù)創(chuàng)作和表現(xiàn)手段。然而，在這方面，國(guó)內(nèi)的研究并不是很多。為此，本文在這方面進(jìn)行了一些研究和探索，利用互動(dòng)投影創(chuàng)作新穎的可交互的中國(guó)畫(huà)數(shù)字藝術(shù)作品。

1 互動(dòng)投影系統(tǒng)的組成

為了創(chuàng)作一個(gè)互動(dòng)投影藝術(shù)作品，首先要了解一下互動(dòng)投影多媒體系統(tǒng)的組成。互動(dòng)投影系統(tǒng)有單通道系統(tǒng)的[14]，也有多通道系統(tǒng)的[15]。但究其根本，都由4個(gè)部分組成：

(1) 信號(hào)采集部分。主要任務(wù)是采集人體運(yùn)動(dòng)的信息，也就是完成信息的捕捉。信息捕捉設(shè)備有紅外感應(yīng)器、視頻攝錄機(jī)、熱力拍攝器等。

(2) 數(shù)據(jù)處理部分。 是互動(dòng)投影系統(tǒng)的核心部分，是把信號(hào)采集部分得到的數(shù)據(jù)進(jìn)行實(shí)時(shí)分析，識(shí)別出參與者的動(dòng)作及其變化，并將分析得到的結(jié)果與影像播放系統(tǒng)對(duì)接．形成動(dòng)作與投影影像的互動(dòng)。

(3) 成像部分。 是將影像呈現(xiàn)到特定的位置，其設(shè)備除投影機(jī)外，等離子顯示器、液晶顯示器、LED屏幕都可以作為互動(dòng)影像的載體。

(4) 輔助設(shè)備部分。包括傳輸線路、音響設(shè)備．安裝構(gòu)件等。

2 互動(dòng)投影數(shù)字藝術(shù)作品創(chuàng)作

考慮創(chuàng)作一個(gè)中國(guó)畫(huà)水墨風(fēng)格的數(shù)字藝術(shù)作品。水墨藝術(shù)獨(dú)特的表現(xiàn)形式首先體現(xiàn)在水墨藝術(shù)中特有的簡(jiǎn)潔的形式語(yǔ)言，即“計(jì)白當(dāng)黑”的樸素形象。水墨藝術(shù)簡(jiǎn)約的畫(huà)面不等于簡(jiǎn)單，而是形象簡(jiǎn)捷，寓意豐富，妙在以極少的要素表達(dá)最多的信息?！耙陨賱俣唷薄耙砸划?dāng)十”“計(jì)白當(dāng)黑”“無(wú)畫(huà)處皆成妙境”平面設(shè)計(jì)是中國(guó)繪畫(huà)文化對(duì)簡(jiǎn)約美感的總結(jié)。其畫(huà)風(fēng)元素極其簡(jiǎn)單，如水墨的枝條、水墨的嫩葉，運(yùn)用毛筆的書(shū)法性線條和滲化感的水墨效果，給人以詩(shī)一樣的意境，顯示了高雅的文化品位和人文情懷。

2.1 構(gòu)圖設(shè)計(jì)

為了使畫(huà)面整潔干凈又不失畫(huà)風(fēng)優(yōu)美，才有長(zhǎng)幅水墨畫(huà)的比例3072像素：768像素；在畫(huà)面設(shè)計(jì)上保持松弛有度，不至于擁擠又不會(huì)顯單調(diào)。設(shè)計(jì)風(fēng)格以石頭，蘭花為前景，3個(gè)形態(tài)不一的石頭均勻排布，石上盛開(kāi)著嬌艷的蘭花；在畫(huà)面上方，設(shè)計(jì)了若隱若現(xiàn)的山脈，豐富畫(huà)面的元素，體現(xiàn)背景的深度。

2.2 蘭花設(shè)計(jì)

在每個(gè)石頭均設(shè)計(jì)嬌艷盛開(kāi)的搖曳的蘭花，構(gòu)想蘭花會(huì)輕輕搖曳，并偶爾受到風(fēng)吹加速搖動(dòng)，所以在蘭花元素設(shè)計(jì)中制作兩組動(dòng)畫(huà)序列幀，慢慢搖動(dòng)和加速搖動(dòng)(見(jiàn)圖1)。

圖1 背景與蘭花

由于蘭花搖曳有緩慢和加速2種狀態(tài)，所以設(shè)計(jì)思路為新建lanhua元件，前面為蘭花緩慢搖曳的序列幀，后面放置加速搖曳的序列幀，為了使蘭花在沒(méi)觸發(fā)的狀態(tài)下不會(huì)播放加速的狀態(tài)，這里使用gotoAndPlay()語(yǔ)句來(lái)控制。每個(gè)緩慢搖曳的蘭花圖片設(shè)計(jì)播放時(shí)長(zhǎng)為3幀，每個(gè)加速搖曳的蘭花圖片設(shè)計(jì)播放時(shí)長(zhǎng)為1幀；前55幀為緩慢搖曳蘭花，第55～90幀為加速搖晃狀態(tài)的蘭花，并在第55幀動(dòng)作面板添加actionscript語(yǔ)句：gotoAndPlay(1)；故每次播放緩慢搖曳蘭花到結(jié)束的55幀時(shí)，就跳回第一幀重新播放元件而不會(huì)播放加速搖晃的蘭花。

2.3 飛鳥(niǎo)設(shè)計(jì)

配合畫(huà)面風(fēng)格采用相應(yīng)的飛鳥(niǎo)，在色彩上選用了藍(lán)天的天藍(lán)色，體現(xiàn)自由歡快的飛鳥(niǎo)，并設(shè)計(jì)其扇翅的序列幀以便后期導(dǎo)入flash制作飛翔動(dòng)畫(huà)(見(jiàn)圖2)。

圖2 飛鳥(niǎo)序列幀

設(shè)計(jì)制作一個(gè)飛鳥(niǎo)偶爾飛入舞臺(tái)，并停在石頭直到觸發(fā)飛走的動(dòng)畫(huà)；故設(shè)計(jì)思路為設(shè)計(jì)制作一個(gè)飛鳥(niǎo)元件并在飛到某個(gè)石頭的時(shí)間停住。可以使用stop()語(yǔ)句來(lái)實(shí)現(xiàn)控制。新建元件birdfly，利用庫(kù)中的飛鳥(niǎo)扇翅的序列幀圖片制作一個(gè)鳥(niǎo)飛行的元件；新建元件birdstand，利用庫(kù)中的鳥(niǎo)搖頭的序列幀圖片制作一個(gè)鳥(niǎo)在石頭上搖頭的元件。新建元件bird，在該元件中為元件birdfly制作一個(gè)飛入舞臺(tái)的動(dòng)畫(huà)，并在后一幀放置元件birdstand和在該幀使用stop()語(yǔ)句使元件的播放到該幀停止，最后在往后的幀制作飛鳥(niǎo)飛出舞臺(tái)的動(dòng)畫(huà)。

2.4 蝴蝶設(shè)計(jì)

為了豐富畫(huà)面的色彩，本作采用2個(gè)顏色形態(tài)相異的飛蝶，并設(shè)計(jì)飛舞的序列幀以便導(dǎo)入flash中制作動(dòng)畫(huà)(見(jiàn)圖3)。

圖3 蝴蝶的序列幀

單純依靠設(shè)置關(guān)鍵幀有時(shí)無(wú)法實(shí)現(xiàn)復(fù)雜的動(dòng)畫(huà)效果，有很多運(yùn)動(dòng)是弧線或者不規(guī)則的，這時(shí)就要應(yīng)用 “引導(dǎo)路徑動(dòng)畫(huà)”了，將一個(gè)或多個(gè)層鏈接到一個(gè)運(yùn)動(dòng)引導(dǎo)層，使一個(gè)或者多個(gè)對(duì)象沿同一條路徑運(yùn)動(dòng)的動(dòng)畫(huà)形式被稱為“引導(dǎo)路徑動(dòng)畫(huà)”。新建元件hudie1，放置蝴蝶素材的序列幀，每個(gè)圖片占2幀；新建元件butterfly1，在元件butterfly1放置元件hudie1，調(diào)整元件hudie1的位置，并新建一個(gè)引導(dǎo)層使用鋼筆工具繪制蝴蝶飛舞的路線，創(chuàng)建補(bǔ)間動(dòng)畫(huà)。新建元件hudie2，放置蝴蝶素材的序列幀，每個(gè)圖片占2幀；新建元件butterfly2，在元件butterfly2放置元件hudie2，調(diào)整元件hudie2的位置，并新建一個(gè)引導(dǎo)層使用鋼筆工具繪制蝴蝶飛舞的路線，創(chuàng)建補(bǔ)間動(dòng)畫(huà)(見(jiàn)圖4)。

圖4 蝴蝶的路徑動(dòng)畫(huà)

除此以外，作品還制作了遠(yuǎn)處大雁飛過(guò)、落花等序列幀圖像，方法類似，不再累述。

2.5 互動(dòng)功能制作

然后在多媒體軟件Adobe Flash中導(dǎo)入以上素材。Flash舞臺(tái)背景設(shè)置為3 072×768像素。導(dǎo)入動(dòng)畫(huà)素材，形成動(dòng)畫(huà)元件。并特別為蝴蝶元件設(shè)置飛舞的路徑，以便影子觸碰到蝴蝶時(shí)蝴蝶按此路徑飛舞。編寫(xiě)ActionScript互動(dòng)腳本，捕捉鼠標(biāo)接近事件，當(dāng)鼠標(biāo)接近時(shí)，各種動(dòng)畫(huà)內(nèi)容會(huì)觸發(fā)。例如鼠標(biāo)光標(biāo)靠近蝴蝶是，啟動(dòng)蝴蝶飛舞的動(dòng)畫(huà)；鼠標(biāo)光標(biāo)靠近花時(shí)，觸發(fā)落花動(dòng)畫(huà)，鼠標(biāo)光標(biāo)靠近鳥(niǎo)兒時(shí)，鳥(niǎo)兒飛走，等等。捕捉鼠標(biāo)移動(dòng)時(shí)間，當(dāng)鼠標(biāo)從左向右快速移動(dòng)時(shí)，觸發(fā)蘭花搖曳的動(dòng)畫(huà)，產(chǎn)生風(fēng)吹葉搖的效果。ActionScript是Flash多媒體軟件平臺(tái)中的交互腳本語(yǔ)言，例如蝴蝶交互的腳本代碼如下：

import flash.events.MouseEvent;

import flash.events.Event;

import flash.utils.Timer;

import flash.events.TimerEvent;

var Butterfly:butterfly = new butterfly();

var Butterfly2:butterfly2 = new butterfly2();

addChild(Butterfly);

addChild(Butterfly2);

Butterfly.x =-3.90;

Butterfly.y =-5.70;

Butterfly2.x = 3.45;

Butterfly2.y =-39.15;

function fly(evt:MouseEvent):void{

evt.target.play();

}

Butterfly.addEventListener(MouseEvent.ROLL_OVER,fly);

Butterfly2.addEventListener(MouseEvent.ROLL_OVER,fly);

最后由互動(dòng)投影軟件隱藏鼠標(biāo)光標(biāo)，并由影子控制鼠標(biāo)光標(biāo)的實(shí)際位置，作品就完成了。完成后的作品效果見(jiàn)圖5。

圖5 互動(dòng)投影數(shù)字藝術(shù)作品《蘭花飄香》效果

3 結(jié) 語(yǔ)

互動(dòng)投影是一種新穎的多媒體技術(shù)?；?dòng)投影技術(shù)在未來(lái)必將在游戲娛樂(lè)，會(huì)展展示等等多個(gè)方面發(fā)揮極其重要的作用，目前我國(guó)的互動(dòng)投影技術(shù)正在快速發(fā)展。本文使用互動(dòng)投影技術(shù)和Flash交互動(dòng)畫(huà)技術(shù)，設(shè)計(jì)了一個(gè)國(guó)畫(huà)風(fēng)格的畫(huà)面，并使用ActionScript實(shí)現(xiàn)了動(dòng)畫(huà)的交互，創(chuàng)作了一個(gè)新穎有趣的數(shù)字藝術(shù)作品。交互數(shù)字藝術(shù)是新興的藝術(shù)領(lǐng)域，還需要更多藝術(shù)家共同參與與創(chuàng)作?？上驳氖?，越來(lái)越多的藝術(shù)家和院校越來(lái)越重視新媒體藝術(shù)，很多高等院校也正在專門(mén)建設(shè)新媒體藝術(shù)實(shí)驗(yàn)室[16]，相信不久的將來(lái)將會(huì)涌現(xiàn)出越來(lái)越多精彩的互動(dòng)投影藝術(shù)作品。