每週二晚上直播，已開課也能加入，回放永久看。十年走過的路，11 週帶你走一次：從 p5.js 到 TouchDesigner、體感互動與音像表演，做出 8 件作品。吳哲宇 × MonoLab，Hahow 直播課。

Hahow 直播課・每週二 19:00・2026.09.22 – 12.22

11 週完成 8 件作品，打造你的個人創作流

從 p5.js 的第一行程式，走到 TouchDesigner、體感互動和音像表演。每週二晚上，哲宇在直播裡把程式一行一行寫給你看，寫錯了就當場一起修。

程度

沒寫過程式也能上。第 0 堂從註冊 OpenProcessing 開始。

工具

p5.js → TouchDesigner。加上 MediaPipe 與 AI 工具，TD 用免費版。

時間

每週二 19:00–21:30。11 堂直播，回放沒有觀看期限。

每週要花

直播 2.5 小時＋作業。近一半同學每週留 1 到 3 小時寫作業。

做出來

8 件作品。第 9 堂期末發表，哲宇逐一點評。

作業

每堂一份。下一堂開場，一起看大家的作業。

這一期的同學（課前問卷 110 份）

• 64% 開課前自己寫不出完整的程式
• 23% 是專業工程師
• 35% 上過哲宇或 MonoLab 的課

適合你，如果

• 有美感、沒寫過程式，想讓作品動起來
• 學過 p5.js 或 TouchDesigner，作品一直停在「會動」
• 想把作品帶進展覽、演出或商業案
• 已經在用 AI 寫程式，想知道自己在指揮什麼

可能不適合，如果

• 只想把一個工具學到精通
• 希望直播的每一步都等全班打完才往下走（直播節奏偏快，細節靠回放補）

難度照課綱慢慢爬，換到 TouchDesigner 的那兩堂先放慢。第 9 堂是期末發表，哲宇線上逐一點評每個人的作品。

1. 第 0 堂〈新媒體藝術的全景地圖〉　9/22（二） 19:00–21:30・OpenProcessing。在 OpenProcessing 從零寫出滑鼠筆刷，再讓一段弧線每一格多轉一點，長成鸚鵡螺。
2. 第 1 堂〈第一個生成藝術作品〉　9/29（二） 19:00–21:30・p5.js。用色票、if／else 和 for 迴圈排出環狀的花，再把一塊畫截下來，做成自己的筆刷。
3. 第 2 堂〈數學之美：向量與粒子〉　10/6（二） 19:00–21:30・p5.js。位置加上速度，就是下一刻的位置。從一顆會彈的球，做到按住滑鼠噴出來的粒子槍，再讓 noise 力場推著粒子流動。
4. 第 3 堂〈自然的演算法〉　10/13（二） 19:00–21:30・p5.js。用規則長出自然：粒子死掉時分裂出下一代、照一串字畫出 L-System 的樹、三條規則讓 500 隻鳥自己成群。
5. 第 4 堂〈聲音 × 視覺：音頻分析〉　10/20（二） 19:00–21:30・p5.js + 麥克風。麥克風輸入、音頻分析、音像共感（p5.js 畢業作）。
6. 第 5 堂〈TouchDesigner 入門〉　11/10（二） 19:00–21:30・TD。節點式思維、TOP／CHOP／SOP 基礎、2D 視覺。
7. 第 6 堂〈TouchDesigner 進階〉　11/17（二） 19:00–21:30・TD。3D 世界、材質、光影、影像處理。
8. 第 7 堂〈體感互動〉　11/24（二） 19:00–21:30・TD + MediaPipe。MediaPipe 手勢與身體追蹤、即時影像互動。
9. 第 8 堂〈系統整合 × 音像表演〉　12/1（二） 19:00–21:30・全工具。把所有工具串起來，做一場即時演出。
10. 第 9 堂〈學員作品發表講評會〉　12/15（二） 19:00–21:30・自選。學員分享作品，哲宇線上點評。
11. 第 10 堂〈AI 協作 × 創作永續〉　12/22（二） 19:00–21:30・AI 工具組合。AI 作為創作夥伴；讓創作持續發生的工作流。

完整課程

週二 19:00・直播

先講概念、看作品，再進程式。2 小時教學加 30 分鐘問答，聊天室的問題當場回。

兩天內・回放

直播後兩天內，回放上架 Hahow。

課後・筆記與模組

課程網站上每一堂都有照上課順序整理的筆記、範例程式和互動模組，學員登入後也能在網站上看回放。

下一堂前一天 21:00・作業

交到 Hahow 作業區，Discord 貼一份。下一堂開場，哲宇挑幾件作業出來講。

直播照顧不到每一個人，所以一堂課不只是一場直播，前後還有這些：

直播當下

問題當場回

聊天室的問題當場回，Discord 提問區的問題也會念出來回答。

白板推導

概念先在白板上手畫一次，看懂了再進程式。

直播頁

本週講綱、開播倒數、麥克風測試，一鍵加到行事曆。網址每週都一樣。

課後兩天內

回放

兩天內上架 Hahow；登入課程網站也看得到，點章節就跳到那一段。

筆記

照上課順序整理，每一段標著回放裡的時間，最後一節是「卡住的時候」。

範例與案例

每堂附 OpenProcessing 範例程式、哲宇的案例和延伸閱讀，Fork 就能接著改。

自己練的時候

互動模組

每一堂的示範都做成互動模組，拉滑桿看程式怎麼變。

常用指令

上課一直會用到的程式片段，搜尋、一鍵複製。

Discord

卡住的程式貼上來問。Discord 和 Hahow 的提問每天彙整一次給哲宇。

整個 11 週

作業講評

每堂開場花 10 到 20 分鐘看大家的作業，挑幾件出來講。

作品牆

同學的作品每堂一組；課堂上貼出來的，標著它在直播裡出現的時間。

課後回饋

每堂一份回饋表，大家的意見拿來改筆記和模組。

「上課通常是聽和理解，之後看回放才慢慢跟著打。」

新媒體藝術家，MonoLab 創辦人。陽明交通大學電機系畢業，紐約大學整合數位媒體碩士。

《靈魂魚》2024 年在威尼斯藝術雙年展期間，於 European Cultural Centre 主辦的 Personal Structures 展出。《花的靈魂》2023 年在 Art Basel Miami Beach × Tezos Foundation 展出。2023 年在台北 101 AMBI SPACE ONE 舉辦個展《萬物公式》。

2026 年，兩件委託新作在台灣設計展展出，七月到法國 IRCAM 駐地，創作《The Last Input》。

2024 年在陽明交通大學開了一學期的〈生成式演算互動藝術實作〉。

課堂上會拆的作品

• 《靈魂魚》Personal Structures，威尼斯，2024。第 3 堂拆過：魚身上的旗子，就是一條鏈條
• 《萬物公式》個展，台北 101 AMBI SPACE ONE，2023。第 6 堂（課綱）：TouchDesigner 的 3D 世界
• 《演算詩篇：夢境與孤寂的邊界》沉浸式演奏會，華山 1914，2025。第 4 堂（課綱）：聲音與視覺怎麼一起運算
• 《瓶中的永恆花園》臺法沉浸式內容駐地開發計畫，2024。第 7 堂（課綱）：體感互動

一封信

小學的時候，我在玩 Flash，幫班上架官網。國中開始用逐格動畫加攝影加 Flash 做作品，拿到宏碁數位創作獎首獎。高中迷上 After Effects 和 3D 渲染，大學讀了電機系，在寫 AutoCAD 的巨集。

但我一直不知道，我做的這些事情，加在一起叫什麼。

後來我去了紐約。NYU 的研究室裡，我第一次看到有人用程式碼畫畫、用數學公式讓花開出來。原來我從小做的事情，有名字。

如果當時有人給我一張地圖，告訴我「嘿，這個世界長這樣，有這些工具、這些社群、這些可能性」，也許不需要十年。這堂課就是那張地圖。我不打算教你成為專家，11 堂課做不到。但我可以在 11 週裡，帶你走過我花了十年才看見的風景，然後你可以自己選擇要往哪裡走。

與其把知識壁壘起來，不如把土壤變肥沃一點。

這一期同學在作業裡寫的

「這次嘗試與 AI 協作，AI 秒速寫完初版，然後再花數小時當家教，一行行慢慢教我、慢慢一起改。」

「願每個人都有自己的花期，終將綻放。這次玩得很開心～」

「概念是常見的四種要素：墨、霓、藤、絲。每次開啟都能隨機抽到其中一款筆刷自由創作。」

這一期的同學（匿名）

「從蓋印章到粒子系統，感覺像是跨了一個世界 XDD」

「循序漸進地帶到各種觀念，深淺也很剛好……想要深入時可以自己課後再慢慢玩模組查資料。」

「面對程式小白，老師鼓勵我們，沒有打擊挫敗我們」

「跟不上，不過可看回放，就沒什麼問題」

「實際操作外，也有解說原理……不只是學會模板，更有想像空間」

「確實瞭解這些演算法及實作的眉角」

哲宇之前的 Hahow 課

「老師的節奏循序漸進，每個步驟都講解非常清楚，不管是想從０開始或是想精進技能，都是網頁工程師、網頁設計師的必修課！而且跟著作業做完已後，就有超高質量的作品集，找工作或實習都變得輕鬆很多！」

「在YT聽老師分享各種創作藝術的用途如互動櫥窗及建築光雕等，才了解到創作藝術的可能性，也因為上過哲宇老師開的網頁動畫特效入門，親自感受到內容有多豐富，所以當這門課程推出時立馬手刀報名，也感謝哲宇老師作為創作藝術者分享各種知識及貢獻。」

「這是一堂對於完全零基礎的初學者來說相當友善的課。自己目前是以自學方式在學習網頁設計，在網路上看到許多人都推薦如果要踏入網頁設計這條路必定要看老師的教學影片，簡單易懂，適時地提出作業也能督促自己反覆地去練習。目前還在追進度，很期待自己的第一個網頁設計作品。」

「老師豐沛的視覺設計及程式知識，無私教授令我感受到想提昇學生專業技能的用心，此次課程講解很多在基礎上的觀念，需一再重複複習與思考，課程範例比上次更加精采絕倫，非常推薦想進入前端網頁程式自我提昇的人，必、有、收、穫。(好老師不多了，還好我們眼前有一個，真的很幸運。)」

「這是一堂由淺入深，相當扎實的網頁入門課程 老師的口條清晰，邏輯清楚。 非常適合什麼都不懂的初學者來入門 從頭開始慢慢聽，慢慢練習 收穫幫助非常多 我本來只是略懂ＣＳＳ 聽完這堂課，很多基礎觀念都理解了。 作品的成形也更加輕鬆 非常推薦這堂課！」

「我完全沒有程式基礎，但老師的課讓我不這麼害怕接觸程式，還有點期待自己可以怎麼應用，課程也是循序漸進，手把手的教學，但因為只能用下班時間學習，所以學習很龜速，但我還是很喜歡老師的課」

已經開課了，現在加入來得及嗎？

來得及。已經上完的堂，回放都在 Hahow，直播後兩天內上架，接下來的直播可以一起上。

完全沒寫過程式，跟得上嗎？

可以上，但前幾堂會吃力。第 0 堂從註冊 OpenProcessing 開始，一路寫到會動的畫。不少同學的做法是直播先聽懂概念，回放再跟著打，卡住的地方貼上 Discord 問。

每週要花多少時間？

直播 2.5 小時（週二 19:00 到 21:30），加上作業。課前問卷 110 份裡，47% 的同學每週留 1 到 3 小時，38% 留 3 小時以上。前 3 堂只看回放的同學填了 8 份回饋，8 份都說節奏剛好。

直播時間到不了，會錯過嗎？

不會。每一堂都錄下來，直播後兩天內上架 Hahow，沒有觀看期限。

人在國外、有時差，能上嗎？

可以。回放沒有觀看期限，作業交到 Hahow、問題貼 Discord，不用跟直播同一個時間。這一期也有同學在國外上。

我已經會 p5.js 或 TouchDesigner，會不會太基礎？

前幾堂可以當快速複習，重點放在第 5 到 10 堂的整合與應用。

需要買什麼設備？TouchDesigner 要錢嗎？

一台能跑 TouchDesigner 的電腦（建議 8GB 記憶體以上），Mac 和 Windows 都可以，TouchDesigner 用免費版就夠上完這門課。筆電內建的鏡頭和麥克風就夠。MIDI 控制器是選配，第 8 堂會用到。

作業怎麼交？誰會看？

每一堂上完有一份作業，下一堂直播前一天 21:00 前交到 Hahow 作業區。哲宇會在下一堂之前看過，開場挑幾件出來講。第 9 堂期末發表，每個人的作品哲宇都會線上點評。

上完可以接案嗎？

沒辦法保證。這門課給你一張地圖和 8 件作品。商業案怎麼做、作品怎麼走到現場，哲宇會講他自己走過的路。

上課要用 Discord 嗎？

要。報名後到 Hahow 的課程公告找 Discord 邀請，直播連結、問答和作業分享都在那裡。

跟《互動藝術程式創作入門》差在哪？

《互動藝術程式創作入門》是一堂工具課，帶你從零學會用 p5.js 做互動藝術。這堂課要帶你看清新媒體藝術的全貌：有哪些路徑、工具之間怎麼銜接、商業案怎麼做、AI 時代怎麼持續創作。工具從 p5.js、TouchDesigner、MediaPipe 到 AI 工具組，修過舊課的人會往前走一大步，新手可以把它當成進這個領域的第一張地圖。

跟 MonoLab 的 TouchDesigner 課差在哪？

這堂是入門全景，11 週看完整個領域。MonoLab 平台上的 TouchDesigner 課只教 TouchDesigner，從零開始把這一個工具學完整。一個是地圖，一個是持續專精。

到 Hahow 報名。價格與優惠以 Hahow 頁面為準。