基于Processing編程技術(shù)的可視化設(shè)計(jì)研究

張林康

摘要：現(xiàn)今社會(huì)的不斷發(fā)展，人們對(duì)數(shù)據(jù)信息進(jìn)行整理和歸納的需求大幅度上升。Processing是一個(gè)開(kāi)源的設(shè)計(jì)工具，具有快捷方便的優(yōu)勢(shì)，其為數(shù)據(jù)的整理和分析提供了強(qiáng)大的技術(shù)支持。文章研究目的是以馬戲團(tuán)行業(yè)現(xiàn)狀為背景，將分析全息馬戲團(tuán)和傳統(tǒng)馬戲團(tuán)的數(shù)據(jù)對(duì)比作為基礎(chǔ)，運(yùn)用Processing編程技術(shù)與信息可視化結(jié)合的方法將這些數(shù)據(jù)進(jìn)行模塊化、交互化、動(dòng)態(tài)化的可視化設(shè)計(jì)，拓寬了信息呈現(xiàn)的形式，為馬戲團(tuán)行業(yè)的創(chuàng)新發(fā)展提供參考。

關(guān)鍵詞：Processing；信息可視化設(shè)計(jì)；馬戲團(tuán)現(xiàn)狀；互動(dòng)性

中圖分類號(hào)：TP311? ? ? 文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1009-3044（2022）30-0092-03

開(kāi)放科學(xué)（資源服務(wù)）標(biāo)識(shí)碼（OSID）：

現(xiàn)如今動(dòng)物保護(hù)的話題熱度不斷上升，動(dòng)物保護(hù)協(xié)會(huì)將輿論焦點(diǎn)聚集在馬戲團(tuán)行業(yè)上，再加上疫情的影響使馬戲團(tuán)行業(yè)暗淡無(wú)光。馬戲團(tuán)行業(yè)的相關(guān)人員急需在這樣嚴(yán)峻的背景下找到解決方案，來(lái)改變現(xiàn)狀。現(xiàn)如今馬戲團(tuán)行業(yè)被分為傳統(tǒng)馬戲團(tuán)和全息投影馬戲團(tuán)兩種形式并存的局面，馬戲團(tuán)行業(yè)的管理者對(duì)這兩者的發(fā)展前景掌握不清。因此該可視化設(shè)計(jì)是通過(guò)比對(duì)全息馬戲團(tuán)和傳統(tǒng)馬戲團(tuán)的優(yōu)缺點(diǎn)，來(lái)為行業(yè)人員提供數(shù)據(jù)參考，方便他們尋找創(chuàng)新性方案來(lái)改善馬戲團(tuán)的悲慘現(xiàn)狀。

1? Processing在可視化設(shè)計(jì)中的特點(diǎn)

信息可視化設(shè)計(jì)是通過(guò)利用圖形圖像方面的技術(shù)與方法，將抽象的數(shù)據(jù)信息落實(shí)下來(lái)，幫助人們理解和分析數(shù)據(jù)。包括信息圖形設(shè)計(jì)、動(dòng)態(tài)信息影像（MG動(dòng)畫）、交互信息設(shè)計(jì)、數(shù)據(jù)可視化。側(cè)重用視覺(jué)化的方式，歸納和表現(xiàn)信息與數(shù)據(jù)的內(nèi)在聯(lián)系、模式和結(jié)構(gòu)。信息可視化最基本的模型是“數(shù)據(jù)、信息、知識(shí)、智慧”DIKW層次模型，數(shù)據(jù)、信息、知識(shí)這三者是對(duì)過(guò)去進(jìn)行數(shù)據(jù)分析，而智慧是對(duì)未來(lái)提出正確的方案。該文的研究?jī)?nèi)容正是DIKW模型的前三個(gè)層面，通過(guò)對(duì)馬戲團(tuán)的過(guò)去和現(xiàn)在進(jìn)行數(shù)據(jù)調(diào)查，做成可視化設(shè)計(jì)，來(lái)為馬戲團(tuán)行業(yè)相關(guān)人員提供幫助。

Processing是一款可用于視覺(jué)藝術(shù)的編程語(yǔ)言[1]，大量擴(kuò)展的API得到開(kāi)發(fā)，為數(shù)據(jù)可視化設(shè)計(jì)提供了算法動(dòng)畫和實(shí)時(shí)交互的技術(shù)支持，足以支撐其在可視化方面的應(yīng)用。從統(tǒng)計(jì)和數(shù)據(jù)處理的角度來(lái)講，針對(duì)馬戲團(tuán)現(xiàn)狀所調(diào)研的數(shù)據(jù)信息可以很好地利用Processing進(jìn)行圖形處理，加之以動(dòng)態(tài)效果作為展示，呈現(xiàn)出馬戲團(tuán)的發(fā)展過(guò)程、全息馬戲團(tuán)與傳統(tǒng)馬戲團(tuán)的比對(duì)等動(dòng)態(tài)信息，打破了常規(guī)軟件進(jìn)行可視化設(shè)計(jì)的單一效果，促進(jìn)不同風(fēng)格形式的融合，更能吸引用戶無(wú)意識(shí)的注意。

2 可視化設(shè)計(jì)的原則

2.1 內(nèi)容模塊化

信息可視化設(shè)計(jì)要求設(shè)計(jì)本身具有模塊化、圖形化、精準(zhǔn)化的特點(diǎn)。文本、圖形、色彩作為信息可視化設(shè)計(jì)的基本要素，就要求我們?cè)谶M(jìn)行設(shè)計(jì)時(shí)要以此為視覺(jué)原則來(lái)指導(dǎo)實(shí)踐，要根據(jù)信息的主次進(jìn)行層級(jí)的區(qū)分，達(dá)到視覺(jué)層級(jí)清晰的效果。在視覺(jué)設(shè)計(jì)中，扁平化是可視化設(shè)計(jì)的主流，我們?cè)谶M(jìn)行可視化設(shè)計(jì)時(shí)將整體風(fēng)格采取了扁平化的處理方式，這種形式便于可視化圖像的加載與傳遞，減輕了人們的審美負(fù)擔(dān)，所表達(dá)的形象也可以直觀地展示給用戶。

2.2? 視覺(jué)形式化

變化與統(tǒng)一[2]。統(tǒng)一是指各個(gè)元素之間的相關(guān)性，在進(jìn)行Processing的可視化設(shè)計(jì)的代碼編程時(shí)，可以把顏色、造型控制在有序的數(shù)值范圍內(nèi)，使整體的信息圖形與色彩有關(guān)聯(lián)性，呈現(xiàn)視覺(jué)上的統(tǒng)一。變化是一種特征的表現(xiàn)，是作品生命力的體現(xiàn)，突出信息圖表的形象差異性。通過(guò)這些變化給人們?cè)斐梢曈X(jué)上的跳躍感和新鮮感，使人們的情緒跌宕起伏。

比例與尺度。比例是各個(gè)體之間或個(gè)體與整體之間的數(shù)量關(guān)系，受到數(shù)值關(guān)系的影響；尺度是將元素的大小給出一個(gè)參照物，依據(jù)參照物來(lái)衡量其他元素的大小關(guān)系。將數(shù)據(jù)信息進(jìn)行可視化設(shè)計(jì)，必須要用到比例關(guān)系，要規(guī)定一定的量為參考，根據(jù)數(shù)據(jù)信息的變化進(jìn)行各種量的變化，從而以圖形的形式展示給用戶。把握住可視化設(shè)計(jì)中數(shù)據(jù)間的比例關(guān)系，能夠使所呈現(xiàn)的內(nèi)容更加準(zhǔn)確性、嚴(yán)謹(jǐn)性。

3 Processing編程在信息可視化設(shè)計(jì)中的實(shí)踐

3.1 數(shù)據(jù)分析與統(tǒng)計(jì)設(shè)計(jì)

將馬戲團(tuán)行業(yè)現(xiàn)狀作為信息背景，進(jìn)行可視化設(shè)計(jì)。馬戲團(tuán)行業(yè)在運(yùn)作模式上分為兩大類，一類是傳統(tǒng)馬戲團(tuán)，另一類則是全息投影馬戲團(tuán)。發(fā)現(xiàn)問(wèn)題抓典型，通過(guò)分析大蘋果馬戲團(tuán)、太陽(yáng)馬戲團(tuán)、埇橋馬戲團(tuán)、玲玲馬戲團(tuán)這四家大型傳統(tǒng)馬戲團(tuán)，得出制約馬戲團(tuán)發(fā)展的因素不只是動(dòng)物協(xié)會(huì)的反對(duì)，也要面臨動(dòng)物表演的危險(xiǎn)性、疫情、運(yùn)營(yíng)成本等問(wèn)題。而全息投影馬戲團(tuán)以德國(guó)龍卡利馬戲團(tuán)為首，所存在的問(wèn)題則是設(shè)備技術(shù)、專業(yè)人員的缺失等。將這些數(shù)據(jù)進(jìn)行統(tǒng)計(jì)和歸類，可以劃分為三大模塊：馬戲團(tuán)行業(yè)的發(fā)展趨勢(shì)、傳統(tǒng)馬戲團(tuán)目前所存在的問(wèn)題以及優(yōu)勢(shì)、全息投影馬戲團(tuán)目前所存在的問(wèn)題以及優(yōu)勢(shì)。

馬戲團(tuán)的發(fā)展趨勢(shì)。以我國(guó)埇橋馬戲團(tuán)為代表，埇橋共有馬戲團(tuán)400余家[3]，從業(yè)人員近2萬(wàn)人，年收入高達(dá)4億元，一家馬戲團(tuán)一年的凈收入高達(dá)15萬(wàn)元。而在2010年以后，國(guó)家出臺(tái)了關(guān)于保護(hù)野生動(dòng)物、禁止虐待性動(dòng)物表演的相關(guān)政策，隨后疫情的到來(lái)，導(dǎo)致馬戲團(tuán)無(wú)法進(jìn)行演出。太陽(yáng)馬戲團(tuán)于2020年6月申請(qǐng)破產(chǎn)保護(hù)。紐約大蘋果馬戲團(tuán)于2016年11月申請(qǐng)破產(chǎn)保護(hù)，玲玲馬戲團(tuán)于2017年5月21日被迫關(guān)閉，埇橋馬戲團(tuán)也逐漸銷聲匿跡，馬戲團(tuán)行業(yè)日漸衰落，已是不爭(zhēng)的事實(shí)。

傳統(tǒng)馬戲團(tuán)面臨的問(wèn)題以及優(yōu)勢(shì)。所存在的問(wèn)題：（1）動(dòng)物表演危險(xiǎn)系數(shù)高，國(guó)內(nèi)、國(guó)外動(dòng)物表演傷人案件頻發(fā)，以我國(guó)馬戲團(tuán)動(dòng)物表演傷人事件為例：2014年10月，重慶皇家馬戲團(tuán)劇場(chǎng)一名女孩被老虎咬傷頭部身亡；2015年1月，莆田馬戲團(tuán)一名小孩被老虎抓傷；2017年11月，洪洞縣馬戲團(tuán)兩名兒童被老虎抓傷。（2）在運(yùn)營(yíng)成本方面[4]，以埇橋馬戲團(tuán)為例，一只獅子一天吃掉的肉食近80元，一個(gè)中型馬戲團(tuán)一年在飼養(yǎng)動(dòng)物的成本上就要花費(fèi)接近60萬(wàn)元，再加上人工費(fèi)用，衣食住行每天接近3200元，而當(dāng)時(shí)票價(jià)為成人20元、小孩15元，則要每天演出3場(chǎng)以上，才能有所盈利。（3）疫情的影響使馬戲團(tuán)不能營(yíng)業(yè)，以太陽(yáng)馬戲團(tuán)為例，受疫情的影響裁員超4600人，占總員工95%，面臨9億美元的債務(wù)危機(jī)。（4）動(dòng)物協(xié)會(huì)的施壓與抗議。在這種形勢(shì)的影響下，中國(guó)現(xiàn)存的馬戲團(tuán)比之前少了50%。傳統(tǒng)馬戲團(tuán)的優(yōu)勢(shì)：形式多樣性，團(tuán)隊(duì)人員有著不同的文化內(nèi)涵，碰撞出無(wú)限創(chuàng)意的火花，每場(chǎng)演出都能帶給人們視覺(jué)盛宴。

全息馬戲團(tuán)所面臨的問(wèn)題以及優(yōu)勢(shì)。以德國(guó)Roncalli馬戲團(tuán)為例，全息馬戲團(tuán)的所面臨的問(wèn)題在于要求馬戲團(tuán)具有高技術(shù)手段，以及精密的設(shè)備和專業(yè)的技術(shù)人員共同演繹，進(jìn)行一次全息動(dòng)物表演需要由15個(gè)3D畫像以及相關(guān)技術(shù)團(tuán)隊(duì)協(xié)作完成，使用11架雙鐳射投影機(jī)，3000臺(tái)云端處理器同步運(yùn)算，這就導(dǎo)致那些普通的個(gè)人馬戲團(tuán)想要完成從傳統(tǒng)到創(chuàng)新的改變需要有足夠的資金支持購(gòu)買技術(shù)。而它的優(yōu)勢(shì)主要有：（1）全息投影馬戲團(tuán)動(dòng)物表演危險(xiǎn)系數(shù)大大降低。（2）全息投影馬戲團(tuán)則需要前期購(gòu)買設(shè)備的費(fèi)用，動(dòng)物建模所需的費(fèi)用等，相比較傳統(tǒng)馬戲團(tuán)來(lái)說(shuō)，后期運(yùn)營(yíng)所花費(fèi)的資金頻率少。（3）全息投影馬戲團(tuán)所需要的場(chǎng)地可以根據(jù)環(huán)境的需求，進(jìn)行設(shè)備的調(diào)節(jié)，但是傳統(tǒng)馬戲團(tuán)館的場(chǎng)地需求則比較固定。

3.2? 數(shù)據(jù)可視化

根據(jù)以上得到的數(shù)據(jù)，在procreate里繪制1：1的草圖方案。尺寸大小采用680*1010的長(zhǎng)方形構(gòu)圖，適合電腦展示。將草圖進(jìn)行模塊化分區(qū)，分為三大模塊。第一模塊為傳統(tǒng)馬戲團(tuán)的現(xiàn)狀，第二模塊為傳統(tǒng)馬戲團(tuán)的問(wèn)題以及優(yōu)勢(shì)，第三板塊為全息馬戲團(tuán)的問(wèn)題以及優(yōu)勢(shì)。再根據(jù)可視化設(shè)計(jì)的原則，確定好畫面的文本、配色、圖形。

文本方面，確定好一級(jí)標(biāo)題、二級(jí)標(biāo)題、三級(jí)具體信息，從字體大小、字體顏色去進(jìn)行層級(jí)的劃分。給出字體代碼myFont1 = createFont（"微軟雅黑"，40，false）;myFont2 = createFont（"宋體"，15，false）。如馬戲團(tuán)行業(yè)現(xiàn)狀為一級(jí)標(biāo)題，采用白色、myFont1（微軟雅黑字體），60號(hào)字；傳統(tǒng)馬戲團(tuán)的現(xiàn)狀為二級(jí)標(biāo)題，采用黑色、myFont2（宋體字體），24號(hào)字；存在的具體問(wèn)題和具體優(yōu)勢(shì)為三級(jí)標(biāo)題，采用黑色、myFont2，15號(hào)字；具體的內(nèi)容為四級(jí)標(biāo)題，采用灰色宋體，10號(hào)字。填充顏色代碼fill（0），指定字體代碼為textFont（myFont1，30），字體大小代碼為textSize（15），然后輸入文字信息代碼text（“馬戲團(tuán)現(xiàn)狀”，21，180）。通過(guò)信息之間的層級(jí)關(guān)系，來(lái)引導(dǎo)用戶的閱讀邏輯，為用戶打造良好的獲取信息的氛圍。

圖形方面，進(jìn)行了扁平化設(shè)計(jì)，圖形是對(duì)文字信息的二次解釋，幫助用戶更直觀地理解畫面。扁平化的設(shè)計(jì)手法是對(duì)事物造型特征進(jìn)行概括，包括線條、顏色、造型，給用戶帶來(lái)更直接的感受。在進(jìn)行馬戲團(tuán)可視化設(shè)計(jì)時(shí)，將馬戲團(tuán)的外觀進(jìn)行扁平化處理，從馬戲團(tuán)中提取色彩和造型，同時(shí)對(duì)數(shù)據(jù)圖表也進(jìn)行扁平化的處理方式。

色彩方面，根據(jù)馬戲團(tuán)的特征提取色彩元素。在配色方面，選用了馬戲團(tuán)的傳統(tǒng)顏色，綠色和橘紅色，碰撞在一起充滿滑稽可愛(ài)的特點(diǎn)，一級(jí)信息采用了紅色配黑色的顏色，使第一層級(jí)信息被用戶第一眼看到，二級(jí)信息采用灰綠色，三級(jí)信息采用淺黃色，背景選用白色。將每個(gè)板塊顏色進(jìn)行合理搭配，使數(shù)據(jù)更加清晰地傳達(dá)給受眾。同時(shí)加入了馬戲團(tuán)的亮片特效，輸入代碼for（int x=155；x=575；x+=140）對(duì)燈光的顏色變化限定范圍，保持作品的隨機(jī)性優(yōu)勢(shì)。

動(dòng)效交互方面，為了呼應(yīng)馬戲團(tuán)主題，動(dòng)效的加入要盡量與馬戲團(tuán)的特征相吻合，即滑稽性。從馬戲團(tuán)小丑的五官和道具出發(fā)，將小丑的眼睛和自行車輪胎進(jìn)行扁平化、動(dòng)態(tài)化、交互化處理。將畫面中的馬戲團(tuán)擬人化，加入兩只眼睛動(dòng)效，眼球會(huì)隨著鼠標(biāo)而轉(zhuǎn)動(dòng)，充分體現(xiàn)了馬戲團(tuán)的娛樂(lè)性。通過(guò)對(duì)眼球增加變量，同時(shí)限定轉(zhuǎn)動(dòng)范圍void update（int mx，int my），且將角度給出變量angle=atan2（my-y，mx-x），如圖1-2。自行車輪胎在界面打開(kāi)之后，輪胎上的小方塊會(huì)一直轉(zhuǎn)動(dòng)，代表輪胎的動(dòng)態(tài)效果，具體代碼為填充方塊顏色fill（255，217，71）;進(jìn)行轉(zhuǎn)動(dòng)translate（325，470），設(shè)定角度rotate（radians（angle））;rect（0，0，24，24）;以及轉(zhuǎn)動(dòng)的角度頻率angle+=0.8。

4? Processing在可視化設(shè)計(jì)應(yīng)用的價(jià)值

Processing在語(yǔ)法上相比于Java語(yǔ)言簡(jiǎn)易許多，并且具有較完善的人性化設(shè)計(jì)，不需要太復(fù)雜的語(yǔ)言代碼，也能設(shè)計(jì)出較完美的圖像和交互作品。在具體的可視化設(shè)計(jì)過(guò)程中，Processing軟件為交互概念的落實(shí)起到了支撐作用，設(shè)計(jì)者可以將抽象的數(shù)字信息生成動(dòng)態(tài)的圖形效果。同時(shí)設(shè)計(jì)者可以利用IDE[5]快速地將自己的概念想法以圖像的形式落實(shí)在電腦上，同時(shí)也能更快速地發(fā)現(xiàn)設(shè)計(jì)過(guò)程中存在的問(wèn)題，方便設(shè)計(jì)者準(zhǔn)確有效地改善設(shè)計(jì)作品，具有高效的特點(diǎn)。

基于Processing的信息可視化設(shè)計(jì)提高了用戶的互動(dòng)體驗(yàn)性，在設(shè)計(jì)制作的過(guò)程中實(shí)現(xiàn)了視覺(jué)感官和觸覺(jué)感官的結(jié)合，給用戶帶來(lái)了全方位的體驗(yàn)感受。Processing的互動(dòng)體驗(yàn)還表現(xiàn)在隨機(jī)性上，隨機(jī)性是其他的設(shè)計(jì)軟件所不能比較的，相同的代碼無(wú)法展現(xiàn)出相同的效果，所呈現(xiàn)的效果具有唯一性，用戶和設(shè)計(jì)師都無(wú)法明確成品最終的設(shè)計(jì)形態(tài)，因此用戶也能夠始終保持著新鮮感和好奇心去感受作品本身。

5 結(jié)束語(yǔ)

在信息可視化設(shè)計(jì)的未來(lái)發(fā)展中，信息可視化設(shè)計(jì)要始終以用戶為中心，從用戶需求出發(fā)，發(fā)現(xiàn)用戶所面臨的問(wèn)題、用戶需要的數(shù)據(jù)和功能，設(shè)計(jì)者要滿足用戶最多的信息需求，為用戶的下一步規(guī)劃提供價(jià)值參考。另外，設(shè)計(jì)者在進(jìn)行信息可視化時(shí)也要根植于社會(huì)文化內(nèi)涵，以社會(huì)文化為理論支撐，根據(jù)社會(huì)的需求進(jìn)行可視化設(shè)計(jì)，解決現(xiàn)如今社會(huì)所面臨的突出問(wèn)題，提升可視化設(shè)計(jì)的文化價(jià)值，達(dá)到服務(wù)于人，服務(wù)于社會(huì)的要求。

參考文獻(xiàn)：

[1] 陳楨，陳媛媛.基于Processing的新媒體生成藝術(shù)交互設(shè)計(jì)實(shí)驗(yàn)研究[J].藝術(shù)科技，2021，34（10）：4-6.

[2] 李媛.界面設(shè)計(jì)中形式美法則的運(yùn)用[J].西部皮革，2018，40（2）：5.

[3] 侯俊杰，劉海龍，田慧麗.埇橋馬戲團(tuán)現(xiàn)狀的調(diào)查與分析[J].宿州學(xué)院學(xué)報(bào)，2017，32（7）：87-89.

[4] 沈寅飛，周靜雅，邢汝飛.馬戲團(tuán)生存現(xiàn)狀調(diào)查[J].方圓，2018（9）：22-25.

[5] 葛雯.交互式圖形編程語(yǔ)言Processing應(yīng)用淺析[J].產(chǎn)業(yè)科技創(chuàng)新，2020，2（24）：35-36.

【通聯(lián)編輯：光文玲】