本學期互動媒體課程結束後，老師佈置的課程設計是編寫一個繪畫系統。具體要求如下：

編寫一個“繪畫系統”，提供一系列繪畫材料（例如畫筆/顏料/濾鏡）給使用者操作，以創作出動態/互動的繪畫作品。這個繪畫系統是對“繪畫”的概念的擴充套件，但仍然體現出與傳統繪畫系統的相似性。
注意，目標可理解為:
創作一個app，看起來比較像“畫畫”的工具，但又絕不是復現已知的繪畫行為，而要體現出通常繪畫出不來的效果（動態、互動性）或意圖（傳統繪畫是創作
一個平面視覺影象，這個app可以創作其他東西）。

這個題目看起來很有意思，因為要求做的不是傳統的繪畫系統。傳統的繪畫系統其實見得很多了，例如Adobe Photoshop,Corel Painter,Sai,OpenCanvas等等很多專業的繪畫軟體，還有電腦系統自帶的簡易的畫圖軟體。這些繪畫系統會提供最基本的繪畫工具，畫布，畫筆，筆刷，顏料等等，儘可能地滿足作畫者的創作需要。那麼什麼是非傳統的繪畫系統呢？
這裡需要對繪畫的概念有一個清晰的描述，以便於我們解答上面的問題。

在部落格《什麼是繪畫–以抽象思維理解繪畫》裡面，作者給出了對繪畫概念非常好的闡述。首先列舉了古今中外各種稀奇古怪的“繪畫”，這些“繪畫”與傳統的紙筆繪畫有著巨大的差異，形式上也是千姿百態，但是從感覺上，我們又不得不承認它們確實也屬於繪畫。既然從形式上無法定義繪畫，那麼就只有挖掘繪畫的核心本質，也即它的抽象意義。
作者給出的繪畫的抽象定義是：

將“繪畫”這樣的行為看做四個要素的組合：
材料：各種物質要素，例如顏料、畫筆、畫布等
作畫者：創作手法、思想、審美、技巧等
互動方式：創作者如何與材料互動
作品：創作行為產生的結果，它以某種呈現方式給予觀賞者一定的體驗，傳遞一定的資訊
根據這種抽象，則可以將繪畫“定義”為： 繪畫：****作畫者以特定的互動方式操作一系列材料，製造出作品以呈現給觀賞者，傳達一定的思想和情感；

我個人對這個定義也非常地贊同。在這個定義下，繪畫的概念被極大的拓展。再來完成課程設計的題目就非常容易了，因為幾乎一切作品都可以被稱之為繪畫。

在processing和p5.js中，個人對p5.js相對熟悉，所以選擇p5.js來作為程式語言.查閱了很多資料以及別人的作品（相關連結會在文末給出），最後選定利用音樂視覺化的方法來創作我的繪畫系統。

簡單介紹一下p5.js（以下摘自p5.js官網首頁）：

p5.js是個 Javascript程式庫,它起源於 Processing的原旨:讓藝術家、設計師、教育家和初學者能更容易學習及使用程式設計,同時將其重新釋義給今日的網路環境。
藉著 Processing原有的繪圖冊比喻,p5js提供全套繪圖功能,但除了原有的畫布,整個瀏覽器頁面也能成為您繪圖的一部分!為此,p5js同時提供一系列附加程式庫以方便與HTML5物件互動,其中包括文字、輸入、影像、網路攝像頭、聲音等。

簡單介紹一下音樂視覺化（以下摘自wikipedia）

音樂視覺化或音樂視覺化是電子音樂視覺化工具和媒體播放器軟體中的一項功能, 它基於一段音樂生成動畫影象。影象通常是實時生成和呈現的,並以與音樂同步的方式進行, 因為音樂是在播放的。
視覺化技術的範圍從簡單的技術 (例如,示波器顯示的模擬) 到複雜的技術,其中通常包括多個合成效果。
音樂響度和頻譜的變化是用作視覺化輸入的屬性之一。 有效的音樂視覺化旨在實現音樂曲目的光譜特徵 (如頻率和振幅)與所呈現的視覺影象的物件或元件之間的高度視覺相關性顯示。

查閱資料的過程中見到了一些音樂視覺化的作品，利用音樂生成動態的絢麗多彩的動畫。p5.js本身也有聲音相關的庫，可以生成聲音。所以很容易就想到可以利用p5.js聲音庫函式生成聲音，再通過聲音視覺化方法，即根據聲音的頻率，振幅屬性繪出相關圖形。
最後的作品也是基於這樣的一個思路來實現的。
在這個繪畫系統下，繪畫的四要素與傳統的繪畫是有差異的，

• 材料：聲音
• 作畫者：人
• 互動方式：滑鼠,鍵盤
• 作品：動畫，靜態圖畫

應該可以說滿足了題目對於繪畫概念拓展的要求。

下面再簡單介紹一下繪畫系統的功能以及實現。
介面上一共有26個字母鍵，對應於鍵盤上的26個字母鍵。
有兩種互動方式：
（1）鍵盤：按下鍵盤上不同的鍵，會播放不同頻率的聲音，產生動態的動畫效果
（2）滑鼠：點選介面上的按鍵，會播放不同頻率的聲音，在螢幕上繪製靜態的圖畫。不同鍵的效果可以疊加。
靜態效果如下（動態效果不會製作）：包含了四種動畫，上面是波形圖，下面是頻率圖。然後兩個圓圈和一堆小星星也是對應於頻率繪製的。

程式碼很長，不再貼了。謝謝閱讀。

參考資料：
1.博文：什麼是繪畫–以抽象思維理解繪畫作者：magicbrushlv
2.示例：p5.js|examples
3.工程檔案:p5.js-聲音視覺化作者：龍族工作室
4.WIKIPEDIA百科：Music visualization