創(chuàng)意編程語(yǔ)言——Processing：聲控音量管理程序

張寧 北京市朝陽(yáng)區(qū)清森學(xué)校

●Processing簡(jiǎn)要介紹

Processing是一個(gè)FLOSS項(xiàng)目（免費(fèi)/自由/開源軟件），可以免費(fèi)下載，甚至根據(jù)需要修改源代碼以滿足個(gè)性化的需要。它是在Java基礎(chǔ)上進(jìn)一步開發(fā)的語(yǔ)言，這兩種語(yǔ)言的語(yǔ)法幾乎相同，但Processing又添加了一些與可視圖形和交互相關(guān)的自定義功能，其中與圖形相關(guān)的功能是繼承了PostScript（PDF的基礎(chǔ)）和OpenGL（一個(gè)3D圖形規(guī)范）。

●歷史發(fā)展

MIT 媒體實(shí)驗(yàn)室在可視化編程和創(chuàng)意編程領(lǐng)域具有舉足輕重的作用。1967年，西蒙·帕佩特（Seymour Papert）等人開發(fā)了Logo編程語(yǔ)言，開啟了圖形化編程的歷史進(jìn)程。通過(guò)簡(jiǎn)單指令指揮小烏龜運(yùn)動(dòng)，生成幾何圖形和設(shè)計(jì)圖案，深受中小學(xué)生的喜愛。1990年，MIT媒體實(shí)驗(yàn)室的約翰·馬爾德亞（John Maeda）教授發(fā)起了一個(gè)非常有影響力的編程教學(xué)試驗(yàn)—Design BY Numbers，該項(xiàng)目通過(guò)簡(jiǎn)潔易用的編程語(yǔ)言，把計(jì)算和編程介紹給視覺設(shè)計(jì)者和藝術(shù)家們。他和學(xué)生們?cè)O(shè)計(jì)和開發(fā)的一款軟件，致力于幫助設(shè)計(jì)者、藝術(shù)家和其他非編碼專業(yè)人員學(xué)習(xí)編程，雖然這款軟件隨著技術(shù)的發(fā)展，逐漸被遺忘，也不再被使用，但其影響深遠(yuǎn)，后續(xù)很多相關(guān)項(xiàng)目都是在其基礎(chǔ)上生根發(fā)芽。其中比較成功的是凱西·瑞爾（Casey Reas）和本·弗萊Ben Fry發(fā)起創(chuàng)建的Processing語(yǔ)言。

●程序案例

筆者以可視化聲控課堂音量管理程序?yàn)槔M(jìn)一步講解如何使用Processing實(shí)現(xiàn)可視化交互的設(shè)計(jì)和開發(fā)。

1.項(xiàng)目情境

營(yíng)造安靜的學(xué)習(xí)環(huán)境是高效課堂的必要條件，同時(shí)對(duì)應(yīng)《普通高中信息技術(shù)課程標(biāo)準(zhǔn)（2017年版）》中“模塊1：數(shù)據(jù)與計(jì)算”的要求（如表1），用Processing開發(fā)一款聲控管理可視化程序，引導(dǎo)學(xué)生在短時(shí)間內(nèi)達(dá)到課堂音量管理要求。通過(guò)Processing編程環(huán)境，可以讓學(xué)生動(dòng)手實(shí)驗(yàn)，調(diào)用相關(guān)的sound庫(kù)和方法，探究學(xué)習(xí)聲音的可視化過(guò)程。

表1

2.程序用戶界面

程序應(yīng)用界面如圖1所示，窗口右邊為音量等級(jí)，顏色越淺，音量等級(jí)越低，教師可以根據(jù)教學(xué)活動(dòng)的需求，選擇合適的音量等級(jí)。窗口下面黃色矩形為實(shí)時(shí)可視化的音量高低，代表音量等級(jí)的藍(lán)色方塊被觸發(fā)后，就會(huì)自動(dòng)從右向左移動(dòng)。

圖1 聲控音量管理程序界面

3.程序功能

輸入：通過(guò)調(diào)用sound庫(kù)，自動(dòng)獲取電腦自帶麥克風(fēng)輸入音量。通過(guò)鼠標(biāo)懸浮在音量等級(jí)上面觸發(fā)方塊運(yùn)動(dòng)。

輸出：通過(guò)條形圖的高度可視化顯示音量大小。當(dāng)右側(cè)小方塊連續(xù)完成5次成功移動(dòng)后，就會(huì)在屏幕左側(cè)顯示笑臉，以慶祝學(xué)生們完成了課堂音量要求。

處理：代表音量等級(jí)的小方塊被觸發(fā)后（鼠標(biāo)放在小方塊上方，每次僅觸發(fā)一個(gè)方塊），就會(huì)自動(dòng)從右向左移動(dòng)。當(dāng)沒有噪音干擾時(shí)，會(huì)完成一次成功移動(dòng)，同時(shí)左邊的圓臉會(huì)變大。當(dāng)有噪音干擾，并且超過(guò)了選取的音量等級(jí)時(shí)，小方塊就會(huì)重新回到起始位置，重新開始移動(dòng)，同時(shí)成功移動(dòng)次數(shù)也會(huì)被清零。

4.程序代碼解析

Processing程序中的void setup（）方法僅運(yùn)行一次，目的是完成程序變量初始化。void draw（）方法會(huì)一直循環(huán)執(zhí)行里面的方法。筆者根據(jù)程序功能，把程序拆分為三個(gè)模塊，分別為周圍環(huán)境音量可視化、音量等級(jí)方塊和繪制笑臉。

（1）周圍環(huán)境音量的實(shí)時(shí)可視化

首先需要通過(guò)調(diào)用processing.sound庫(kù)里面的方法，來(lái)獲取電腦麥克風(fēng)的輸入，并通過(guò)analyze方法轉(zhuǎn)化為0～1.0的音量范圍。然后，應(yīng)用內(nèi)置的Map方法，把音量大小映射為矩形的高度，進(jìn)而可以通過(guò)繪制矩形，實(shí)時(shí)獲得音量高低的可視化展示。關(guān)鍵程序片段如上頁(yè)表2所示，完整程序見文末鏈接。

表2

（2）音量等級(jí)方塊

用5個(gè)方塊來(lái)可視化5個(gè)音量等級(jí)?？紤]到后續(xù)對(duì)每個(gè)音量等級(jí)的操作，為了使程序簡(jiǎn)潔和易于維護(hù)，可以定義一個(gè)SoundLevelButton類，細(xì)化完成相應(yīng)的類屬性和方法。其中，overRect方法來(lái)判定鼠標(biāo)選定的是哪個(gè)音量等級(jí)；move方法在選定音量方塊觸發(fā)后，并且在成功移動(dòng)完成次數(shù)小于5時(shí)，保持自右向左的移動(dòng)。具體如表3所示。

表3

（3）笑臉生成

要使代碼結(jié)構(gòu)清晰，可以把笑臉生成單獨(dú)封裝為一個(gè)方法模塊，這樣也方便后續(xù)維護(hù)及代碼再次利用。如圖2所示代碼，形式參數(shù)x和y控制笑臉的大小，count獲取連續(xù)成功搬運(yùn)的次數(shù)，當(dāng)次數(shù)超過(guò)5次時(shí)，會(huì)繪制笑臉，表示聲音音量滿足教學(xué)要求。

圖2

●對(duì)中小學(xué)編程教學(xué)的意義

Processing作為一款最初面向藝術(shù)家和設(shè)計(jì)人員的編程語(yǔ)言，先天繼承了可視化編程和創(chuàng)意編程的基因。可視化實(shí)時(shí)反饋，降低了學(xué)習(xí)編程的門檻，提高了在給定技能水平下完成任務(wù)的趣味性和復(fù)雜性。實(shí)時(shí)可視化反饋和反復(fù)調(diào)試，促使學(xué)生自我思考的過(guò)程成為可能，提升了元認(rèn)知能力水平。程序運(yùn)行一旦成功會(huì)讓學(xué)生充滿成就感，使學(xué)生獲得學(xué)習(xí)動(dòng)力，而如果運(yùn)行失敗則會(huì)訓(xùn)練學(xué)生解決問題的能力，通過(guò)把問題拆分為易于解決的小問題，反復(fù)測(cè)試，進(jìn)而解決問題。這個(gè)過(guò)程也培養(yǎng)了學(xué)生的耐心和韌性。（本文所有代碼參見網(wǎng)址：https://gitee.com/edumaker/china-informationtechnology）