課程簡介

開課名稱:互動程式設計與應用
Course Name: Interactive Programming and Applications

授課教師:許素朱(小牛)教授 <xn.processing@gmail.com>
授課助教:陳威諭、林文哲

課程網址:http://fbilab.org/xn/processing
上課時間:(二)6,7,8 (15:30~18:30PM)
上課教室:研究大樓 R312

◎ 課程目標:
「互動程式設計與應用」是台北藝術大學新媒體藝術學系大二的課程,主要目的是從「人文藝術裡的Coding」培養人文藝術背景學生對Coding(寫程式)產生興趣,並進而撰寫程式做圖像創作。課程設計是架構在國際最受歡迎與與最普及的 Processing互動圖像程式設計語言,並結合結合互動感測與空間創意,做互動影像創意設計

Algorithm art是種新興影像藝術,運用電腦圖學與數學函式,產生一些無法畫出、無法拍攝出的深不可測的影像 (與Software Art, Generative Art, Fractal Art 之不同?)。而Processing程式語言,讓這些變成一種另類卻簡單的創作實現方式。國際已有成千上萬精彩Processing的作品,但怎麼啟發一些藝術背景沒有紮實數學與圖學理論基礎的同學投入創意行列,且在Processing創作瀚海中突破,是項挑戰

為此,本課程設計用倒序法,先讓同學從「應用目的」思考,進而「創意修改」,最後「深入探索」方式,來啟發同學對 Algorithm Art 的興趣,進而引導同學主動挖掘與探索 coding的奧妙,並進而創造出自己的作品。除此,我們更期盼培養同學跨域創意設計,因此課程設計將結合Arduino電子Kinect空間互動媒介來做實體混和媒體互動作品設計。

◎ 課程作業(兩人一組):
作業(1):我想,想、想、想(空間影像創意設計)
作業(2):我變,變、變、變(互動影像創意變化設計)
作業(3):我做,做、做、做(混和媒體互動影像設計)

◎ 課程預期成效:
1.培養同學瞭解國際Processing創作作品與應用之可能性。
2.培養同學熟悉Processing程式設計基本指令操作。
3.培養同學學習Processing程式結合Arduino互動感測器。
4.培養同學實際完成互動圖像設計與混和實境互動作品設計。
5.培養同學對Algorithm Art 與 Coding的興趣。

課程週課表

週次 課程內容 備註
[01] (02/14) * 課程介紹與分組
[02] (02/21) ●國際著名作品介紹
●Processing 基本操作:安裝、起步練習
Processing 繪圖指令:線、圓、方形、多邊行、…
[03] (02/28) ※ 228國定假日放假  (放假)
[04] (03/07) ●Processing 變數指令:special variables, loop, loop+draw …
●Processing 變數+繪圖案例解析
[05] (03/14) ●Processing 滑鼠指令:draw(), track mouse, map, location, type, tap a key, move with arrow key, …
●Processing 滑鼠移動圖會案例解析
[06] (03/21) ★作業(1):我想,想、想、想
(空間影像創意設計)
 ※小組作業
[07] (03/28) ●Processing 動作指令:translate, scale, rotate, …
●Processing動畫案例解析
[08] (04/04) ※ 清明節國定假日放假 (文化節)
[09] (04/11) ●Processing 多媒體指令:image, sound, …
●Processing圖像/聲音案例解析
[10] (04/18) ●Processing 進階指令操作:函式
[11] (04/25) ●Processing 進階指令操作:物件、陣列
[12] (05/02) ●Processing + Arduino 互動感測器(1)
[13] (05/09) ●Processing + Arduino 互動感測器(2)
[14] (05/16) ★作業(2):我變,變、變、變
(互動影像創意變化設計)
※小組作業
[15] (05/23) ●Processing + Kinect 互動感測器(1)
[16] (05/30) ※端午節國定假日放假
 (放假)
[17] (06/06) ●Processing + Kinect 互動感測器(2)
●分組綜合討論:作品創意發想報告
※小組作業
[18] (06/13) ★作業(3):我做,做、做、做
(混合媒體互動影像設計)
 ※小組作業


評分方式:

20% 平時課堂小練習與表現
25%   [3/21] 作業(1):我想,想、想、想(空間影像創意設計)
25%   [5/02] 作業(2):我變,變、變、變(互動影像創意變化設計)
30%   [6/13] 作業(3):我做,做、做、做(混和媒體互動影像設計)

參考文獻:

  1. Casey Reas, Ben Fry(著)。Processing: A Programming Handbook for Visual Designers。The MIT Press (2014)。
  2. Casey Reas, Ben Fry(著)、蔣大偉(譯)。Processing入門:互動式圖形實作介紹(第二版) / Make: Getting Started with Processing, Second Edition,碁峰(2016)。
  3. Greg Borenstein(著)、蔣大偉(譯)。3D視覺專題製作:Kinect、Processing、Arduino及MakerBot / Making Things See – 3D vision with Kinect, Processing, and Arduino。碁峰 (2013)。
  4. Processing.orghttps://www.processing.org
  5. Processing Libraryhttp://www.processing.org/reference/libraries
  6. Open Processing (Examples), https://www.openprocessing.org
  7. Ira Greenberg (2007). Processing: Creative Coding and Computational Art.

其他相關網站:

  1. Generative Digital Art: Tutorials and Inspiration ,http://www.noupe.com/inspiration/showcases/generative-digital-art-tutorials-and-inspiration.html
  2. 1000+ images about Generative Design & Glitch Art on Pinterest | Artworks, https://www.pinterest.com/rialikescoffee/generative-design-glitch-art/
  3. Danniel Shiffman – Learn Creative Code, http://shiffman.net/
  4. Inspiwrit : Processing experimentation, Exploration of Generative art, http://www.furtherfield.org/inspiwrit/?p=12005
  5. Visualisation Tools | Visualising Information for Advocacy, https://visualisingadvocacy.org/resources/visualisationtools
  6. Beautiful fractals with the chaos game, http://rectangleworld.com/blog/archives/561