很早以前大概13、14年就通過清華大學付志勇教授了解到了Processing這個工具，起初只是初步了解并沒有下定決心學習（當初資料太少了）。由于當時只是初步的看了看，所以很多內容和知識點都是一知半解的。雖然15年曾在B站做過幾個視頻教程，也在鄭州創(chuàng)客空間的公眾號發(fā)布過幾個圖文教程，但是回過頭來看，真的是錯誤一堆一堆，加上也沒有更完，現在我都感覺不滿意。

再加上從去年開始，越來越多的高校開始在藝術系開展Processing的課程，所以我決定再出一個Processing視頻和文字教程。這個全新的Processing教程，也可以說是督促我學習和理解的一個教程吧~這個系列我會講的特別詳細，可能廢話比較多。當然以后我還是會像之前的Arduino教程一樣，出一個特別簡潔的示例教程。大家也可以多多留言和討論我這個Processing課程的內容，讓我們一起共同學習進步，廢話不多說我們開始吧~

---

目錄

---

• 什么是Processing

• Processing的由來

• Processing能做什么

• 數據可視化

• 生成藝術

• 互動藝術

• 第零步下載安裝

• 第一個程序

---

什么是Processing

既然你已經點開了這個文章，我就暫且默認你已經對Processing有了一定的了解。不過為了照顧手滑點進來一臉懵逼的同學，我在這里還是先簡單的講解一下什么是Processing！

從字面理解，Processing就是數據處理的意思。其實它是一個把編程語言和開發(fā)環(huán)境結合在一起的產物，誕生于2001年，是一種具有革命前瞻性的行星計算機語言，和C\C++、python、java等這些語言類似，只不過和這些給工程師、程序員設計的語言不同，它面向的是藝術家、設計師等藝術類的同學。所以，它的代碼不是很復雜，卻可以做出很多很多有意思的作品，比如數字藝術作品、數據可視化作品和互動多媒體藝術作品等。作為Arduino IDE的前身，它也非常易用，官方提供了大量的庫，比如串口、網絡、視頻、可視化、聲音、GUI、3D動畫等等。隨著JS、Python以及Ruby的流行，Processing逐漸延伸出了多種語言的版本，發(fā)展出如p5.js、Python.py、ruby-python等不版本。由于Processing的編程語言是Java為主，所以Processing天生就具有跨平臺的特點，它不僅支持Linux、Windows、MacOSX這三大平臺外目前還支持樹莓派、安卓等設備平臺。隨著目前瀏覽器都已經支持HTML5,Processing目前也推出了自己的基于HTML5做開發(fā)的P5.js版本。當然對我來說可能更喜歡的是Processing可以通過串口等很方便的與Arduino結合做出很多好玩的內容。比如下圖這個隨處可見的雷達應用就是非常出名的Processing與Arduino結合的作品。

這里引入一個之前的學生向我提問的對話：

學生問：“為啥不用Photoshop、Illustrator、Flash等這類專業(yè)的設計軟件，而用Processing呢？”

我答：“使用這類軟件時，很有可能在你還沒有察覺的情況下，自己就已經陷入了這些企業(yè)設計的工具的功能限制里，你的想象力會局限在一個框架內，如果你使用編程語言自己編寫，這樣不僅作品的內容是藝術，編程的形式及創(chuàng)作過程也可以被認為是一種藝術。”

當然選擇Processing還有可能是因為它的便捷性，上面展示的這個效果用AE來做還是比較麻煩的，但是我用Processing的話，三分鐘就可以寫出這個代碼，并且使用起來也很方便。

其實我也不能特別準確的告訴你什么是Processing，因為Processing太特殊了。它也是一個全新的“材料”，和雕塑家手中的木頭、石頭不同，它是全新的。從藝術角度來說，它是一種全新的媒介，與電影、攝像、繪畫這些傳統(tǒng)的媒介不同的是，它更加獨特，不僅可以生成動態(tài)表單、處理手勢、定義行為，還可以模擬自然系統(tǒng)以及整合其他各種媒介。

抽象動畫師和程序員Larry Cuba：“我的每一部電影都是在不同的系統(tǒng)中使用不同的編程語言制作出來的，一種編程語言能給予你表達一些想法的力量，但同時也限制了你表達其他想法的能力。”

Processing編程可以結合各種各樣的編程語言。Processing不一定需要你擅長編程、數學這些專業(yè)知識。只要你有想象力，就可以用它做出不同的內容。它還可以和Arduino結合在一起做出很多有趣的交互裝置。另外，Processing的程序代碼是開放的，使用者可依照自己的需要自由裁剪出最合適的使用模式。Processing的應用千變萬化，但你會看到它們都遵守開放原始碼的規(guī)定。我認為Processing和Arduino一樣很適合藝術類研究生、本科甚至中小學生學習，而且很可能比現在我們大力推廣的Python還要適合。

感覺還是沒有能夠講清楚Processing到底是什么，能夠做什么。（可能也是我沒有完全了解吧！）還是在下文放一下我找到的Processing作品，雖然不知道你現在能不能理解什么是Processing，但我相信，隨著學習的深入，慢慢你就能夠了解什么是Processing了。

Processing的由來

首先，Processing是由Casey Reas與Ben Fry共同創(chuàng)造的。

(左Casey Reas和右Ben Fry在奧地利林茲電子藝術節(jié))

他們是麻省理工學院媒體實驗室旗下美學與運算小組(Aesthetics & Computation Group)的成員。他們是受到當時在媒體實驗室美學與計算小組任教的John Maeda開發(fā)的Design by Numbers語言啟發(fā)改進創(chuàng)造的Processing。

(Design by Numbers界面)

(John Maeda作品《Infinity Wide》)

Casey Reas和Ben Fry創(chuàng)造Processing是為了讓使用編程做交互式圖形更容易，這主要受到Design By Numbers語言的影響。他們在2001年開始有了開發(fā)一個這樣的軟件的想法，他們計劃制作一種像畫草圖一樣容易的編程軟件，并且它能夠互動地全屏展示出來。之后，Processing經歷了很長的發(fā)展過程，之后的幾年里推出了內測版和公測版。從2008年11月1.0版本問世到今天，在全世界范圍內，每天都有上萬人下載Processing。

(Casey Reas作品)

(Ben Fry作品)

Processing能做什么

我從網絡上找了一些Processing不同類型的例子大家可以看一看。

數據可視化

數據視覺化（Data Visualization）是一門對數據進行視覺化表達的應用學科，旨將各種屬性或包含各種變量的抽象數據轉化為具象的視覺圖像。數據視覺化的主要目的是通過圖形化手段進行清晰、有效的信息傳遞。數據視覺化并不意味著為了功能而設計成無聊的功能性圖表，也不意味著是為了美學形式而設計成炫目華麗的畫面。為了有效地傳達信息，美學形式和功能需要齊頭并進，通過對海量的復雜數據進行分析，并以非常直觀的視覺手段進行表達。然而，設計師常常無法取得美學形式和功能之間的平衡，以至于創(chuàng)造出一些華麗的可視化圖表，卻犧牲了信息的有效傳遞。

《New York talk exchange》這個作品可以用數據可視化的方式展示紐約與世界各大城市之間的數據交換。

《We feel fine》這個作品可以在網絡搜集所有包含“I feel”和“I am feeling”的句子然后記錄下來。

生成藝術

生成藝術（Generative Art）通過計算機體現了自然與人工的結合、隨機性與計劃性的統(tǒng)一，有望實現大批量個性化的生產、有計劃隨機運作和非指定的仿真過程。在這一過程中，設計師只要設定生成藝術算法公式，然后交給計算機處理就可以了。但這一算法的特征是：最后生成的結果是設計師所無法預料的，并且同一算法的不同時間段運算所產生的結果也是不同的，具有很強的隨機性。紐約大學的Philip Galanter解釋：“藝術家應用計算機程序，或一系列自然語言規(guī)則，或一個機器，或其他發(fā)明物，產生出一個具有一定自控性的過程，該過程的直接或間接結果是一個完整的藝術品”。

《哥本哈根全球氣候大會logo》設計師可以在Processing中運用算法公式編寫程序，再由計算機按照算法公式隨機“創(chuàng)作”出作品，算法在兩次運算后生成的結果也不會完全一樣。哥本哈根氣候大會的標志就是生成藝術作品，靜態(tài)圖形和動態(tài)視頻兩部分都在Processing中生成，代碼生成不斷交織的線條，象征地球環(huán)境與氣候的變化，視覺效果讓人耳目一新。

《Solar》是一首歌的視覺效果。

《ElectroPlastique》是他使用Processing創(chuàng)作的，是和音樂一同展現的，畫面由程序制定的規(guī)律生成有機形態(tài)。

《Happy Place》

互動藝術

互動藝術的最大特點是能夠讓觀眾參與其中，并感應觀眾的行為和做出反應，在當今時代，互動藝術是和計算機技術結合的綜合系統(tǒng)。觀眾和機器之間的“對話”是雙向的、循環(huán)往復的，形成了一個信息交流的系統(tǒng)。

《Messa di Voce》它是將聲音與視覺相互結合的互動裝置。作品是兩個口技表演藝術家參與的現場表演，當人發(fā)出聲音的時候，在屏幕上飛出小球或者水波，如同從人的嘴里傳出的一樣，現場效果非常奇妙。傳感器能精確捕捉到人發(fā)聲的位置，將人的聲音轉換為視覺元素，創(chuàng)作藝術家為Golan Levin和ZachLieberman。實施流程為：聲音-傳感器-控制器-程序-輸出-承載體。

《Sur la table》桌子上方安裝了攝像頭，可以捕捉到桌面上的物體色彩，當觀眾把一些物品放置到桌面上時，攝像頭將影像傳輸給計算機，在Processing中將視頻按照很窄的范圍處理，輸出看到的畫面效果如同流水般運動。當觀眾移動物品時，產生的拉伸影像也會變動。

《Delay Mirror》是瑞典斯德哥爾摩互動設計學院一位學生的作品，作品構建了一個虛擬的“鏡子”，由顯示屏、攝像頭、計算機等組成。與平常的鏡子不同的是，當觀眾靠近鏡子的時候，所看到的不是即時出現的影像，而是3 秒鐘之前的樣子，觀眾感到很奇妙的超現實，似乎鏡子里是另外一個自己。這是由于用程序將輸入的影像延時了，最后輸出到屏幕上。

第零步下載安裝

剛才舉了這么多例子。那么開始第零步，下載安裝Processing IDE吧！首先打開Processing的官網。https://Processing.org/在這里你可以點擊Download選擇下載普通版本，或者下載p5、android、樹莓派等其他版本。

在下載界面中可以根據你的操作系統(tǒng)下載最新版本。或者選擇Stable Releaes以前的穩(wěn)定版本下載。當然你也可以選擇Pre-Releases未發(fā)布的測試版本超前體驗。當然我建議你直接下載最新的普通版本就好了。具體怎么下載解壓安裝我就不再贅述。以后的教程目前以windows 10系統(tǒng)舉例（大家多打賞我就換mac）對了目前教程用的版本是3.5.4可能下一篇就換新的了我會及時更新大家注意。

解壓以后我們直接點擊Processing.exe就可以運行Processing的開發(fā)環(huán)境（IDE）。對了（如果打開是英文的可以點擊File→Preferences→Language選擇中文然后點擊“ok”再重啟IDE即可。）

IDE的基本使用其實不用太講解，基本包含五個區(qū)域。我下面簡單講解了一下各個區(qū)域的內容與功能。

菜單

菜單欄提供了基本上所有的功能。你打開、保存、導出、設置、幫助這些都在這里面。詳細重要功能以后我會慢慢講給大家。

工具欄

三角形圖標：編譯代碼，打開顯示窗口，運行程序

方形圖標：終止運行中的程序

最右邊“java”的地方是選擇不同的模式。比如目前是java模式、我還可以變成安卓或者其他模式。

文件管理標簽

相當于一個一個的程序列表（Processing稱之為草圖），每個程序會自動按照年+月+日+編號命名。

文件管理器

你寫程序的地方一般我們稱之為代碼編寫區(qū)，但是官方翻譯為文件管理器。

文本控制臺與消息區(qū)

在下面可以切換顯示程序信息（大小、錯誤等）也可以顯示println輸出的內容。

第一個程序

認識了基本的界面操作后，我們現在可以真正的開始Processing的學習了。為了有儀式感我們先寫一個最經典的小程序。

所有語言的第一個程序《Hello,world》

不過，剛才那個程序貌似不能體現出Processing的特點。大家可以把這個程序抄一下，然后試著編譯運行，看看會有什么效果呢？編寫好程序后點擊三角形運行按鈕運行。

void setup() {size(1080, 720);}void draw() {if (mousePressed) {fill(0);} else {fill(255);}ellipse(mouseX, mouseY, 80, 80);}

如果你成功運行了這個程序，你就會看到這樣的效果可以隨著你的鼠標生成白色填充的圓形，當你點擊鼠標后顯示黑色填充圓形。

到此，恭喜你你已經入門Processing的學習了。我們下節(jié)課將開始學習Processing世界基本的法則，同時開始學習基本的2D圖像。

參考資料：

[1]譚亮. Processing互動編程藝術[M]. 電子工業(yè)出版社, 2011.

[2]Casey Reas,Ben Fry. Processing語言權威指南[M]. 電子工業(yè)出版社, 2019.

總結

以上是生活随笔為你收集整理的Processing入门教程-Processing的“前世今生”的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。