CHE-YU WU / LAB # 一年的創作現場 沿著聲音、記憶與教學，走進這一年持續發生的實驗。 2021-09-09 — 2022-09-09 36 筆公開紀錄 紅線：來源關聯 麻線：共同主題 移到紙上看關係名稱 [完整紀錄 ↓](https://cheyuwu.com/zh/lab/2022/#lab-records) ![](https://kyoko.openprocessing.org/thumbnails/visualThumbnail2290248@2x.jpg) ![](https://cheyuwu.com/static/img/sketches/923989-sm.webp) ![](https://kyoko.openprocessing.org/thumbnails/visualThumbnail1060246@2x.jpg?hash=2021-01-12%2022%3A05%3A56) ![](https://cheyuwu.com/static/img/sketches/1635740-sm.webp) ![](https://cheyuwu.com/static/img/sketches/1615617-sm.webp) ![](https://kyoko.openprocessing.org/thumbnails/visualThumbnail625042@2x.jpg?hash=2018-11-09%2019%3A51%3A34) ![](https://kyoko.openprocessing.org/thumbnails/visualThumbnail853615@2x.jpg?hash=2020-03-06%2018%3A15%3A01) ![](https://cheyuwu.com/static/img/sketches/925596-sm.webp) 創作族譜**818 件每日創作，怎麼一件長出一件**46 個家族畫成有縮圖的分支樹，從 2018 到 2026→ [https://cheyuwu.com/zh/lineage](https://cheyuwu.com/zh/lineage) ****案件紀錄**2021-09-09 / 2022-09-0936 筆 這裡依月份往下讀，每張卡下面的小標是它的關係，點一下會跳到另一筆紀錄 ### 2021 · 09 ** - ** - - - - ** - *白晝之夜* ### 2021 · 10 ** - - - *生成式藝術* ** - *p5.js* ** - ### 2021 · 11 ** - ### 2021 · 12 ** - *聯展* ** ![](https://media.artblocks.io/216000000.png) - - - - - - - - *Art Blocks* ** - ** ![](https://doodlelabs.mo.cloudinary.net/mainnet/1001272.png) - - - ** - - ** - - *NFT* ** ![](https://cheyuwu.com/static/img/soulsea.jpg) - - *靈魂系列* ### 2022 · 01 ** - - *擴增實境* ### 2022 · 02 ** - ** - - *教學* ** - ### 2022 · 03 ** - - ** - ** - - ** ![](https://s3.ap-northeast-1.amazonaws.com/strapi-files.monolab.world/prd/large_06_f898586ce8.jpg) - - *個展* ### 2022 · 04 ** - - - *社群聚會* ** - ** - - *p5.js* ** - ** - ### 2022 · 05 ** - ** - ### 2022 · 06 ** ![](https://s3.ap-northeast-1.amazonaws.com/strapi-files.monolab.world/prd/large_soulfish_ca9e2ba6f6.gif) - ** - ** - - *Canvas* ### 2022 · 07 ** ![](https://cheyuwu.com/static/img/Projectp.png) - - ** - - *Shader* ** - *迴圈* ** - *生成式藝術* 完整紀錄 ## 逐一閱讀 每筆紀錄保留日期依據、公開來源與關係說明。 2021-09-16文章發布日期。已公開 ### 【p5.js 創作教學】CreativeCoding 花火大會（直播筆記） 直播筆記，回應日本 Creative Coder 社群在 Processing Community Day 期間於 Twitter 上發起的線上花火大會。內容從粒子系統出發，帶到多發花火依序綻放、粒子造型變化、HSB 色彩模式，以及把離開畫面的花火移除以維持效能。 - 粒子系統 - 直播筆記 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2021/09/16/p5-js-creativecoding%E8%8A%B1%E7%81%AB%E5%A4%A7%E6%9C%83/) - [Creative Coding TW](https://creativecoding.in/2021/09/16/p5-js-creativecoding%E8%8A%B1%E7%81%AB%E5%A4%A7%E6%9C%83/) - [【Canvas 創作教學】動態敵人偵測雷達圖](https://cheyuwu.com/zh/lab/2022/#lab-ccin-radar) · 同一條直播筆記系列 (策展主題) 2021-09-23文章發布日期。已公開 ### 【Canvas 創作教學】動態敵人偵測雷達圖 以 HTML5 Canvas 與 JavaScript 做一張互動式敵人偵測雷達圖。文章先講 Canvas 畫形狀與線條的基本操作，再引入極座標系統定位元素與模組化寫法，主軸是一道旋轉掃描光束掃出隨機分布的敵人，配上擴散圓與十字標記，最後補上刻度與動態虛線。 - Canvas - 極座標 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2021/09/23/canvas-creation-enemies-radar/) - [Creative Coding TW](https://creativecoding.in/2021/09/23/canvas-creation-enemies-radar/) - [【p5.js 創作教學】CreativeCoding 花火大會（直播筆記）](https://cheyuwu.com/zh/lab/2022/#lab-ccin-fireworks) · 同一條直播筆記系列 (策展主題) - [2021 臺北白晝之夜線上全攻略](https://cheyuwu.com/zh/lab/2022/#lab-nuit-blanche-guide) · 同一個社群媒體發布線 (策展主題) - [【p5.js 創作教學】Dreamy Bird 夢幻鳥](https://cheyuwu.com/zh/lab/2022/#lab-ccin-dreamy-bird) · 同一條教學文發布線 (策展主題) - [【互動網頁程式教學】活用 GUI Object 與繼承概念，完成 Canvas 物件導向的滑鼠拖曳互動](https://cheyuwu.com/zh/lab/2022/#lab-ccin-gui-object) · 同一條 Canvas 教學線 (策展主題) 2021-09-30文章發布日期，活動本身為十月二日至三日。已公開 ### 2021 臺北白晝之夜線上全攻略 整理 2021 臺北白晝之夜的線上版本。該屆因疫情改為全線上舉辦，主題訂為「線上感 Interoperability」，於十月二日至三日進行，邀請六十組跨領域藝術家在臺北十二個行政區創作，分成日常奇觀、佔領地標、怪奇街區、詩性空間四個子題。節目包含藝術百草圖、白晝夜夜談、臺北共創歌與白晝幻境映四個單元，文章也提到部分北投館舍延長開放與多間博物館夜間免費參觀。 - 白晝之夜 - 線上展演 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2021/09/30/2021-nuit-blanche-taipei/) - [Creative Coding TW](https://creativecoding.in/2021/09/30/2021-nuit-blanche-taipei/) - [【Canvas 創作教學】動態敵人偵測雷達圖](https://cheyuwu.com/zh/lab/2022/#lab-ccin-radar) · 同一個社群媒體發布線 (策展主題) 2021-10-10倉庫建立日期。公開原型 ### AB_Project_CheYu 程式碼庫 公開於 GitHub 的生成式作品程式碼庫，主要檔案包含 Sketch.js、Rarity.js 與各自的壓縮版本，另有 index.html 與數個變體頁面、canvas 系列圖檔與 build 目錄。README 只留下一行安裝提示，要求全域安裝 minify 工具。倉庫主分支累積二十九個 commit。 - 生成式藝術 - 開源 來源與相關紀錄 - [前往原始頁面 ↗](https://github.com/frank890417/AB_Project_CheYu) - [GitHub](https://github.com/frank890417/AB_Project_CheYu) - [Project Electriz（Art Blocks #216）](https://cheyuwu.com/zh/lab/2022/#lab-electriz) · Art Blocks 作品的製作端 (策展主題) - [SeaHamDAO 網站程式碼庫](https://cheyuwu.com/zh/lab/2022/#lab-seahamdao-website) · 同一年的開源程式碼庫 (策展主題) - [cheyu-genart-fairy-village 程式碼庫](https://cheyuwu.com/zh/lab/2022/#lab-fairy-village-repo) · 同一條 Art Blocks 製作線 (策展主題) 2021-10-12文章發布日期。已公開 ### 【p5.js 創作教學】Dreamy Bird 夢幻鳥 以 p5.js 與 OpenProcessing 記錄 Dreamy Bird 的八個開發階段，從金屬質感的顏色實驗一路長成會動的生物。技術面涵蓋 noise() 產生自然隨機、sin() 與 cos() 做波動動畫、atan2() 讓眼睛追著游標。成品是色彩繽紛、身體起伏、有魚鰭的生物，會回應使用者操作。文章強調創意程式需要反覆修整，把複雜專案拆成可處理的步驟。 - p5.js - 雜訊 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2021/10/12/p5-js-dreamy-bird/) - [Creative Coding TW](https://creativecoding.in/2021/10/12/p5-js-dreamy-bird/) - [【Canvas 創作教學】動態敵人偵測雷達圖](https://cheyuwu.com/zh/lab/2022/#lab-ccin-radar) · 同一條教學文發布線 (策展主題) 2021-10-26倉庫建立日期。公開原型 ### SeaHamDAO 網站程式碼庫 SeaHamDAO 網站的公開程式碼庫，以 Vue.js 建置，後端服務接 Firebase。倉庫內含 .firebaserc、firebase.json 與 database.rules.json 等設定檔，README 提供 yarn install、yarn serve 與 yarn build 的標準流程。主分支累積八十個 commit，另有兩顆星與一個 fork。 - DAO - 開源 來源與相關紀錄 - [前往原始頁面 ↗](https://github.com/frank890417/SeaHamDAO_Website) - [GitHub](https://github.com/frank890417/SeaHamDAO_Website) - [AB_Project_CheYu 程式碼庫](https://cheyuwu.com/zh/lab/2022/#lab-ab-project-repo) · 同一年的開源程式碼庫 (策展主題) 2021-11-30新聞稿發布日期，頁面另標示十二月十六日的更新時間。已公開 ### White Castle 宣布與 Doodle Labs、吳哲宇合作 NFT 美國連鎖速食品牌 White Castle 發布新聞稿，宣布與 NFT 平台 Doodle Labs Corp 及數位媒體藝術家吳哲宇合作推出 Sliderverse NFT 系列。系列共五千件生成式作品，發行於以太坊，採 Art Blocks 的鑄造技術，購買當下才生成，元件與風格處理各不相同。授權由 Brandgenuity 代理，部分收益捐給 Ingram-White Castle Foundation 旗下的員工紓困基金與員工獎學金。 - 品牌合作 - 生成式 NFT 來源與相關紀錄 - [前往原始頁面 ↗](https://www.prnewswire.com/news-releases/white-castle-announces-nft-collaboration-with-doodle-labs--media-artist-che-yu-wu-301446920.html) - [PR Newswire](https://www.prnewswire.com/news-releases/white-castle-announces-nft-collaboration-with-doodle-labs--media-artist-che-yu-wu-301446920.html) - [Sliderverse × White Castle（Doodle Labs）](https://cheyuwu.com/zh/lab/2022/#lab-sliderverse) · 這篇新聞稿宣布的系列 (來源關聯) 2021-12-07Art Blocks 頁面標示的發行日期。已公開 ### Project Electriz（Art Blocks #216） Art Blocks 第 216 號專案，共九百一十件作品，於 2021 年 12 月 7 日發行。作品以數位雲霧室觀察不明粒子的軌跡，畫面空間被切分成物理性質不同的區域，影響粒子的移動、旋轉、分裂與消滅，構成一套無法預測的實驗系統。藝術家頁面把這件作品放在物理、數學、音樂與藝術的交界上。 - Art Blocks - 粒子 ![Project Electriz 第一號輸出的作品畫面](https://media.artblocks.io/216000000.png) 來源與相關紀錄 - [前往原始頁面 ↗](https://www.artblocks.io/project/216) - [Art Blocks](https://www.artblocks.io/project/216) - [AB_Project_CheYu 程式碼庫](https://cheyuwu.com/zh/lab/2022/#lab-ab-project-repo) · Art Blocks 作品的製作端 (策展主題) - [Sliderverse × White Castle（Doodle Labs）](https://cheyuwu.com/zh/lab/2022/#lab-sliderverse) · 同年的 Art Blocks 技術線 (策展主題) - [Art Blocks《After Dinner Mints》第 29 集：吳哲宇](https://cheyuwu.com/zh/lab/2022/#lab-after-dinner-mints) · 節目討論的作品 (來源關聯) - [《SACRIFICE》M.A.D.S. Art Gallery 聯展](https://cheyuwu.com/zh/lab/2022/#lab-sacrifice-mads) · 同時期的生成式創作 (策展主題) - [【老闆週六來聊聊】我開始賣 NFT 作品啦！生成式藝術在 NFT 的價值](https://cheyuwu.com/zh/lab/2022/#lab-ccin-nft-value) · 文中預告的作品 (來源關聯) - [Neocha《Algorithmic Bliss》](https://cheyuwu.com/zh/lab/2022/#lab-neocha-algorithmic-bliss) · 報導提到的 Art Blocks 線 (策展主題) - [個展《混沌實驗室》第一檔 @ 双融域 AMBI SPACE ONE](https://cheyuwu.com/zh/lab/2022/#lab-chaos-lab-1) · 展覽的第二章展出 Electriz (策展主題) - [【老闆週六來聊聊】吳哲宇 Art Blocks Project Electriz 製作分享](https://cheyuwu.com/zh/lab/2022/#lab-ccin-electriz-making) · 文章拆解的作品 (來源關聯) 2021-12-08節目發布日期，另有來源記為十二月九日。已公開 ### Art Blocks《After Dinner Mints》第 29 集：吳哲宇 Art Blocks 官方節目《After Dinner Mints》第 29 集，來賓為吳哲宇。節目簡介把他介紹為剛在 Art Blocks 推出 Electriz 的生成式藝術家，並提到他為 sail-o-bots 打下的大部分基礎。 - Podcast - Art Blocks 來源與相關紀錄 - [前往原始頁面 ↗](https://www.youtube.com/watch?v=Qtj_AEq2j9M) - [Art Blocks on YouTube](https://www.youtube.com/watch?v=Qtj_AEq2j9M) - [Project Electriz（Art Blocks #216）](https://cheyuwu.com/zh/lab/2022/#lab-electriz) · 節目討論的作品 (來源關聯) 2021-12-15系列上線日期。已公開 ### Sliderverse × White Castle（Doodle Labs） 與美國速食品牌 White Castle 及 NFT 平台 Doodle Labs 合作的生成式 NFT 系列，共五千件，發行於以太坊。作品在購買當下才鑄造生成，元件組合與風格處理逐件不同，採用 Art Blocks 的生成式鑄造技術。White Castle 行銷長在新聞稿中稱他把多媒體技術與藝術結合成一種前所未見的創作體驗。 - NFT - 品牌合作 ![Sliderverse 系列其中一件作品畫面](https://doodlelabs.mo.cloudinary.net/mainnet/1001272.png) 來源與相關紀錄 - [前往原始頁面 ↗](https://sliderverse.doodlelabs.io/) - [PR Newswire](https://www.prnewswire.com/news-releases/white-castle-announces-nft-collaboration-with-doodle-labs--media-artist-che-yu-wu-301446920.html) - [White Castle 宣布與 Doodle Labs、吳哲宇合作 NFT](https://cheyuwu.com/zh/lab/2022/#lab-white-castle-pr) · 這篇新聞稿宣布的系列 (來源關聯) - [Project Electriz（Art Blocks #216）](https://cheyuwu.com/zh/lab/2022/#lab-electriz) · 同年的 Art Blocks 技術線 (策展主題) - [遠見雜誌《闖進紐約的台灣之光，憑 NFT 實現財富自由的 26 歲無名小卒》](https://cheyuwu.com/zh/lab/2022/#lab-gvm-2021) · 報導提到的品牌合作 (策展主題) 2021-12僅記到月份。頁面本身未標展期。已公開活動紀錄 ### 《SACRIFICE》M.A.D.S. Art Gallery 聯展 M.A.D.S. Art Gallery 的展覽頁面把吳哲宇列為數位藝術家，介紹為來自臺灣的當代新媒體藝術家，創作聚焦演算法與互動，並用「soulfully algorithm-driven」形容他在數位領域中安放生命與情感的做法。頁面展出的作品包含 The Soul of Flowers、Sweet Dreams、Causality、Nightmare、Chaos Dancer、Tangled 與 Triangle Picnic。藝術家自述提到他在工程與藝術之間取材自然、物理與數學，想在虛擬與真實之間架一座情感與精神的橋。 - 聯展 - 國際展出 來源與相關紀錄 - [前往原始頁面 ↗](https://www.madsgallery.art/item/6c595765-f20b-44a8-a22b-30dcf7e13ba4/artist/che-yu-wu) - [M.A.D.S. Art Gallery](https://www.madsgallery.art/item/6c595765-f20b-44a8-a22b-30dcf7e13ba4/artist/che-yu-wu) - [Project Electriz（Art Blocks #216）](https://cheyuwu.com/zh/lab/2022/#lab-electriz) · 同時期的生成式創作 (策展主題) 2021-12-24報導發布日期。已公開 ### 遠見雜誌《闖進紐約的台灣之光，憑 NFT 實現財富自由的 26 歲無名小卒》 遠見雜誌人物報導。文章記他在紐約的生成式創作歷程：小學時母親教他 Flash 網頁設計、父親帶他寫 Visual Basic，交通大學電機系畢業後赴紐約大學讀整合數位媒體。他沒走傳統工程師路線，先在 Hahow 開線上程式課累積破萬名學生，疫情期間開始每日一作，之後轉向以演算法生成的 NFT 作品。報導提到其 NFT 系列累積交易額破新臺幣一億元，單件最高成交 10 ETH，並提到與 White Castle 合作動畫漢堡 NFT。 - 人物報導 - NFT 來源與相關紀錄 - [前往原始頁面 ↗](https://www.gvm.com.tw/article/85552) - [遠見雜誌](https://www.gvm.com.tw/article/85552) - [Sliderverse × White Castle（Doodle Labs）](https://cheyuwu.com/zh/lab/2022/#lab-sliderverse) · 報導提到的品牌合作 (策展主題) - [Cheers 快樂工作人《不到 30 歲！他靠 NFT 翻身》](https://cheyuwu.com/zh/lab/2022/#lab-cheers-2022) · 同一波媒體報導 (策展主題) 2021-12-27文章發布日期。已公開 ### 【老闆週六來聊聊】我開始賣 NFT 作品啦！生成式藝術在 NFT 的價值 談 NFT 作為數位藝術家的新市場。文章解釋區塊鏈如何為數位作品建立真偽與所有權，處理數位藝術長期可無限複製的問題，接著比較 OpenSea、Art Blocks、Foundation 與 Rarible 四個平台各自適合的創作者類型，並談 NFT 讓創作者繞過傳統畫廊的守門。文中記錄他自己在這些平台上販售生成式作品的經過，包含一件機器人作品被抄襲上架 Art Blocks 後反而引來關注，也提到他在 Foundation 走精緻路線、在 OpenSea 走趣味迷因路線的兩條線，最後預告 Electriz。 - NFT - 生成式藝術 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2021/12/27/generative-art-in-nft/) - [Creative Coding TW](https://creativecoding.in/2021/12/27/generative-art-in-nft/) - [Project Electriz（Art Blocks #216）](https://cheyuwu.com/zh/lab/2022/#lab-electriz) · 文中預告的作品 (來源關聯) - [AR 系列二：高雄市立美術館「南方作為衝撞之所」](https://cheyuwu.com/zh/lab/2022/#lab-ccin-ar-kmfa) · 同一條專欄發布線 (策展主題) 2021-12-29官網 NFT 頁標示的發行日期。fxhash 平台已停止營運，原始作品頁無法連結。已公開 ### 靈魂海 SoulSea 發行於 fxhash 的生成式作品，共三百版。作品自述寫低頭望去，心裡的海是一條正弦波，潮水輕輕拍上岸邊，把靈魂當成海來寫，讓觀者在波動與各種海的意象裡想像數位意識。作品在瀏覽器裡即時運算，每一版的視覺各不相同。 - 靈魂系列 - fxhash ![靈魂海 SoulSea 作品畫面](https://cheyuwu.com/static/img/soulsea.jpg) 來源與相關紀錄 - [前往原始頁面 ↗](https://cheyuwu.com/nft) - [Che-Yu Wu 官方網站](https://cheyuwu.com/nft) - [靈魂魚 SoulFish](https://cheyuwu.com/zh/lab/2022/#lab-soulfish) · 靈魂系列 (策展主題) - [Creative Coding Taiwan 第一次社群聚：吳哲宇的生成式藝術宇宙](https://cheyuwu.com/zh/lab/2022/#lab-cct-meetup-1) · 講座介紹的作品 (策展主題) 2022-01-03文章發布日期。已公開 ### AR 系列二：高雄市立美術館「南方作為衝撞之所」 介紹高雄市立美術館的「南方作為衝撞之所」展覽，展中有十四件經典館藏加上擴增實境。該展在美術館整修後於 2021 年開展，適逢建館二十五週年。文章說明南方在此既是地理位置，也是一種看見多元歷史敘事與被忽略聲音的視角。觀眾可下載美術館的典藏特藏室應用程式，透過 AR 看陳澄波風景畫與鄭世璠〈三等車廂〉等作品的風動效果與立體建模。展覽也提供展場的 VR 三百六十度環景，讓疫情期間無法到場的人在線上觀看並閱讀藝術家背景。 - 擴增實境 - 美術館 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/01/03/ar-2-kmfa-south-plus/) - [Creative Coding TW](https://creativecoding.in/2022/01/03/ar-2-kmfa-south-plus/) - [【老闆週六來聊聊】我開始賣 NFT 作品啦！生成式藝術在 NFT 的價值](https://cheyuwu.com/zh/lab/2022/#lab-ccin-nft-value) · 同一條專欄發布線 (策展主題) - [把程式當畫筆！《互動藝術程式創作入門》學生作品賞析](https://cheyuwu.com/zh/lab/2022/#lab-ccin-student-works) · 同一條專欄發布線 (策展主題) 2022-02-07報導發布日期，文中提到的拜年活動記為七日。已公開 ### 智榮基金會《施振榮伯樂識馬 吳哲宇國際舞台發光》 智榮基金會發布的報導。宏碁創辦人施振榮在一場農曆新年線上拜年活動中提到，他在元宇宙世界裡發現一匹千里馬，指的是數位藝術家吳哲宇，並表示會協助把他的作品介紹給更多人。文章回溯兩人的淵源：吳哲宇在 2009 年第五屆宏碁數位創作獎國中組拿下第一名，連續五年拿下四座第一與一座評審團大獎。報導也記他在紐約大學取得整合數位媒體碩士後於國際數位藝術界受到注目，並列出接下來的計畫，包含在臺灣舉辦首次個展、推出探索演算法藝術與數位有機生命的沉浸式裝置、與其他臺灣數位藝術家共同策劃臺灣百岳 NFT 體驗展，以及成立 Formosa Art Bank DAO 支持臺灣 NFT 生態系的創作者。 - 人物報導 - 獎項淵源 來源與相關紀錄 - [前往原始頁面 ↗](https://stansfoundation.org/articles/378197) - [智榮基金會](https://stansfoundation.org/articles/378197) - [FAB DAO BlindBox NFT（第一與第二階段）](https://cheyuwu.com/zh/lab/2022/#lab-fab-dao-blindbox) · 報導提到的 FAB DAO 計畫 (策展主題) 2022-02-08文章發布日期。已公開 ### 把程式當畫筆！《互動藝術程式創作入門》學生作品賞析 介紹《互動藝術程式創作入門》課程的七件學生作品，說明沒有程式背景的初學者如何用 p5.js 做出視覺創作。七件作品分別是把音樂節奏轉成視覺粒子的 Drain、可用滑鼠切換日夜光線的室內空間 Houses、受俄國構成主義啟發以矩形與光影表現時間流動的 Shadow、點擊會噴墨的海底互動 Octopus Ink、以同心圓回應滑鼠位置的水墨漣漪、在原子爆炸與夢境方塊之間切換的神秘炸彈，以及在黑暗中談希望的粒子構成 Universe。文章對每件作品補上動畫技法、混合模式與進階效果的技術說明。 - 教學 - 學生作品 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/02/08/creative-coding-students-artworks/) - [Creative Coding TW](https://creativecoding.in/2022/02/08/creative-coding-students-artworks/) - [AR 系列二：高雄市立美術館「南方作為衝撞之所」](https://cheyuwu.com/zh/lab/2022/#lab-ccin-ar-kmfa) · 同一條專欄發布線 (策展主題) - [【互動網頁程式教學】用 GSAP 做直播互動網頁](https://cheyuwu.com/zh/lab/2022/#lab-ccin-gsap) · 同一條教學文發布線 (策展主題) 2022-02-15節目發布日期。已公開 ### 區塊勢 EP.150 賣授權是失策，純創作的 NFT 更搶手 區塊勢 Podcast 第 150 集，長度約五十五分鐘，來賓為新媒體藝術家吳哲宇。內容談他從在 Hahow 教互動藝術與網頁設計的哲宇老師走到 NFT 創作者的過程，也談電機背景如何進入數位藝術。節目聊到他最早在 OpenSea 發行的 NFT乏人問津、Art Blocks 上的抄襲事件反而讓作品被看見、他從把 NFT 當授權工具轉向純粹創作表達，以及 FAB DAO 如何連結非營利組織與新興創作者。節目的判斷是原創作品在 NFT 場域比授權路線更有共鳴。 - Podcast - NFT 來源與相關紀錄 - [前往原始頁面 ↗](https://podcasts.apple.com/podcast/id1441274280?i=1000551213155) - [Apple Podcasts](https://podcasts.apple.com/podcast/id1441274280?i=1000551213155) - [FAB DAO BlindBox NFT（第一與第二階段）](https://cheyuwu.com/zh/lab/2022/#lab-fab-dao-blindbox) · 節目談到的 FAB DAO (策展主題) 2022-03-10文章發布日期。已公開 ### 【互動網頁程式教學】用 GSAP 做直播互動網頁 教學文，用 Vue.js、Vue CLI 與 GSAP 做一個類似 Facebook 手機直播介面的網頁，包含影像串流、會像粒子飄動的表情符號反應，以及有進出場轉場的留言區。學習重點包含 Vue 的 ref 與 $refs 存取 DOM、以原生 JavaScript 載入影片串流、用 GSAP 的 TweenMax 與 TimelineMax 做表情動畫，以及用 transition-group 處理元素動畫。文章從單段與多段動畫的基礎開始，逐一做出直播標籤的呼吸效果、影像區、表情反應與留言，最後組成完整介面，並附上可運作的 CodeSandbox 範例。 - GSAP - Vue 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/03/10/gsap-livestream-webpage/) - [Creative Coding TW](https://creativecoding.in/2022/03/10/gsap-livestream-webpage/) - [把程式當畫筆！《互動藝術程式創作入門》學生作品賞析](https://cheyuwu.com/zh/lab/2022/#lab-ccin-student-works) · 同一條教學文發布線 (策展主題) - [【p5.js 創作教學】鳥與電線桿](https://cheyuwu.com/zh/lab/2022/#lab-ccin-birds-on-poles) · 同一條教學文發布線 (策展主題) 2022-03-17報導發布日期。已公開 ### Neocha《Algorithmic Bliss》 Neocha 雜誌的藝術家報導。文章描述他的生成式創作由演算法執行既定規則產生獨一無二的動態作品，並回溯他從小學接觸 Adobe Flash、讀資訊相關科系到進入紐約大學整合設計與媒體學程的路徑。報導把重點放在演算法創作裡的人的位置：機器產生影像，但人的挑選與情感意圖無法被取代。他在文中說機器不會有情感，因為它們太完美，人類則是有瑕疵的生物，好的藝術可以從這些瑕疵裡長出來。報導也記他在 Art Blocks 上因 Sea Hams 系列受到注目，程式碼被另一個團體抄襲後社群反而聚集聲援，最終使他進入 Art Blocks 名人堂、Sea Hams 成為平台的非官方吉祥物，以及他在 2021 年 12 月成立 FAB DAO 支持臺灣新興數位藝術家。 - 國際報導 - 生成式藝術 來源與相關紀錄 - [前往原始頁面 ↗](https://neocha.com/magazine/algorithmic-bliss/) - [Neocha](https://neocha.com/magazine/algorithmic-bliss/) - [Project Electriz（Art Blocks #216）](https://cheyuwu.com/zh/lab/2022/#lab-electriz) · 報導提到的 Art Blocks 線 (策展主題) 2022-03-24文章發布日期。已公開 ### 【p5.js 創作教學】鳥與電線桿 以十六個步驟用 p5.js 做出停在電線上的鳥群，從畫電線一路做到有動畫的完整場景。技法包含用 lerp() 做出電線桿之間的下垂曲線、用 class 與 constructor 建可重用物件、隨機生成不同間距與高度的電線桿、用上下兩段弧線組出鳥的身體、用色彩內插做漸層背景、讓鳥回應游標靠近、以及依圖層深度調整電線桿粗細。文章的主張是在規律中生成多樣，每個元素結構一致而尺寸顏色位置不同，重新整理頁面就看到不同時刻的配色。進階部分用 Perlin noise 做出自然的鳥群動作，並用 Coolors 取得多組可切換的色票。 - p5.js - 生成式構圖 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/03/24/p5-js-birds-on-poles/) - [Creative Coding TW](https://creativecoding.in/2022/03/24/p5-js-birds-on-poles/) - [【互動網頁程式教學】用 GSAP 做直播互動網頁](https://cheyuwu.com/zh/lab/2022/#lab-ccin-gsap) · 同一條教學文發布線 (策展主題) - [【p5.js 創作教學】Coral Carnival 珊瑚嘉年華](https://cheyuwu.com/zh/lab/2022/#lab-ccin-coral-carnival) · 同一條教學文發布線 (策展主題) 2022-03-29第一檔日期依藝術家自記。公開報導只記錄到五月二十日至二十二日那一檔。藝術家紀錄 ### 個展《混沌實驗室》第一檔 @ 双融域 AMBI SPACE ONE 生成藝術個展《混沌實驗室》的第一檔，副標為從 NFT 虛擬到現實世界的轉換，地點在臺北一〇一五樓的双融域 AMBI SPACE ONE。展覽集結他 2020 至 2022 年間的 NFT 創作，精選五十件生成式演算作品，題材取自自然、物理、現代藝術、數學韻律與音樂，把原本在線上的生成式影像轉譯成線下的沉浸式體驗。 - 個展 - 沉浸式 ![《混沌實驗室》展場沉浸投影畫面](https://s3.ap-northeast-1.amazonaws.com/strapi-files.monolab.world/prd/large_06_f898586ce8.jpg) 來源與相關紀錄 - [前往原始頁面 ↗](https://monolab.world/zh/exhibition/23) - [MONOLAB 展覽頁](https://monolab.world/zh/exhibition/23) - [展覽紀錄影片](https://youtu.be/B3mqk5w8FVo) - [《混沌實驗室》五月延伸場 @ 双融域 AMBI SPACE ONE](https://cheyuwu.com/zh/lab/2022/#lab-chaos-lab-2) · 同一檔展覽的五月延伸場 (策展主題) - [Project Electriz（Art Blocks #216）](https://cheyuwu.com/zh/lab/2022/#lab-electriz) · 展覽的第二章展出 Electriz (策展主題) 2022-04僅記到月份。已公開 ### Cheers 快樂工作人《不到 30 歲！他靠 NFT 翻身》 Cheers 快樂工作人的人物報導，主題是他在三十歲前以 NFT 生成式作品改變職涯與身價的歷程。 - 人物報導 - NFT 來源與相關紀錄 - [前往原始頁面 ↗](https://www.cheers.com.tw/article/article.action?id=5100763) - [Cheers 快樂工作人](https://www.cheers.com.tw/article/article.action?id=5100763) - [遠見雜誌《闖進紐約的台灣之光，憑 NFT 實現財富自由的 26 歲無名小卒》](https://cheyuwu.com/zh/lab/2022/#lab-gvm-2021) · 同一波媒體報導 (策展主題) 2022-04-07文章發布日期。已公開 ### 【p5.js 創作教學】Coral Carnival 珊瑚嘉年華 完整記錄珊瑚嘉年華這件生成式作品從無到有的十個步驟：從鋼琴、樂譜與植物長出的初始構想，建立基本的 V 形圖樣，用迴圈與旋轉做出放射狀的萬花筒結構，以 Coolors 建立色票，再用材質疊加與混合模式提升畫面質感，最後細修並輸出。技術概念包含以 frameCount() 驅動動畫、用 colorMode() 管理色彩、translate 與 rotate 與 scale 的空間變換，以及用 Perlin noise 產生自然隨機。文章的主張是生成式藝術靠材質、色彩、細節與變化一起把畫面撐到耐看。 - p5.js - 生成式藝術 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/04/07/p5-js-coral-carnival/) - [Creative Coding TW](https://creativecoding.in/2022/04/07/p5-js-coral-carnival/) - [【p5.js 創作教學】鳥與電線桿](https://cheyuwu.com/zh/lab/2022/#lab-ccin-birds-on-poles) · 同一條教學文發布線 (策展主題) - [【p5.js 創作教學】Sweet Trap](https://cheyuwu.com/zh/lab/2022/#lab-ccin-sweet-trap) · 同一條教學文發布線 (策展主題) 2022-04-14文章發布日期。對談本身記於 2021 年 10 月 21 日，屬於 2021 未來媒體藝術節的節目，藝術節期間為 2021 年 10 月 9 日至 11 月 23 日。已公開 ### 創意程式設計：Processing 與 p5.js 教學與趨勢觀察，王連晟與吳哲宇台美連線對談 臺灣當代文化實驗場 C-LAB 主辦的台美連線對談，屬於 2021 未來媒體藝術節的節目，對談者為北藝大講師、科技藝術家王連晟，以及 Monoame Design 創辦人、跨領域新媒體藝術家吳哲宇。內容談 Processing 與 p5.js 作為創意程式的入門工具，兩人都主張教學重點放在創作作品與思考方法，語言與技術是其次，也談了學院與業界教法的差異、生成式藝術的興起，以及 Art Blocks 這類 NFT 平台上多數作品都用 p5.js 寫成的現況。 - 對談 - 創意程式教學 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/04/14/clab-2021-lien-cheng-wang-che-yu-wu/) - [Creative Coding TW](https://creativecoding.in/2022/04/14/clab-2021-lien-cheng-wang-che-yu-wu/) - [Creative Coding Taiwan 第一次社群聚：吳哲宇的生成式藝術宇宙](https://cheyuwu.com/zh/lab/2022/#lab-cct-meetup-1) · 同一年的社群對談線 (策展主題) 2022-04-25文章發布日期。已公開 ### 【p5.js 創作教學】Sweet Trap 以十個步驟做出 Sweet Trap 這件生成式作品，畫面是繽紛的幾何形體向中心聚攏旋轉、外加細線點綴。流程從基本畫布設定與滑鼠互動開始，接著用極座標轉換做出花瓣狀的正弦波形，再處理三角函數定位、座標系旋轉與位移、從色票動態選色、以雜訊函式產生材質、形狀變化、陰影效果與格線背景。成品會疊上顯示即時參數的文字，每次執行隨機取用不同配色。 - p5.js - 極座標 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/04/25/p5-js-sweet-trap/) - [Creative Coding TW](https://creativecoding.in/2022/04/25/p5-js-sweet-trap/) - [【p5.js 創作教學】Coral Carnival 珊瑚嘉年華](https://cheyuwu.com/zh/lab/2022/#lab-ccin-coral-carnival) · 同一條教學文發布線 (策展主題) 2022-04僅記到月份。紀錄文標示活動日為 2022 年 4 月 14 日，文章於同年 5 月 6 日發布。已公開活動紀錄 ### Creative Coding Taiwan 第一次社群聚：吳哲宇的生成式藝術宇宙 Creative Coding Taiwan 社群第一次實體聚會的紀錄，主講人為藝術家、Monoame Design 創辦人吳哲宇。內容從創意程式的定義談起，把程式當成創作媒材以產生新的現象與連結，接著談生成式藝術裡的規則、限制、敘事、視覺呈現、變化與隨機。工具面涵蓋 p5.js、Open Processing、GLSL shader、Unreal Engine 與 TouchDesigner。他也介紹自己在 fxhash 的靈魂海系列與 OpenSea 的 CryptoPochi，談結合區塊鏈與網頁技術的互動式 NFT，並延伸到 GPU 運算與 GLSL 在創作上的應用。紀錄文標示這是約兩小時直播的三篇連載之一。 - 社群聚會 - 演講 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/05/06/creative-coding-meetup-202204-cheyu-wu/) - [Creative Coding TW](https://creativecoding.in/2022/05/06/creative-coding-meetup-202204-cheyu-wu/) - [創意程式設計：Processing 與 p5.js 教學與趨勢觀察，王連晟與吳哲宇台美連線對談](https://cheyuwu.com/zh/lab/2022/#lab-clab-dialogue-wang) · 同一年的社群對談線 (策展主題) - [Creative Coding Taiwan 五月社群聚：吳秉聖談聲光裝置與創意程式](https://cheyuwu.com/zh/lab/2022/#lab-cct-meetup-2) · 同一條社群聚會系列 (策展主題) - [靈魂海 SoulSea](https://cheyuwu.com/zh/lab/2022/#lab-soulsea) · 講座介紹的作品 (策展主題) 2022-05-20展期為 2022 年 5 月 20 日至 22 日，此處記開展日。已公開活動紀錄 ### 《混沌實驗室》五月延伸場 @ 双融域 AMBI SPACE ONE 《混沌實驗室》於 2022 年 5 月 20 日至 22 日在臺北一〇一五樓的双融域 AMBI SPACE ONE 展出，開放時間為上午十一點至下午六點。展覽精選他 2020 至 2022 年間的五十件生成式演算作品，靈感取自自然、物理、現代藝術、數學韻律與音樂，以五面高規格投影構成約四十分鐘的沉浸式視聽體驗，把虛擬影像轉成把觀眾包起來的實體現場。5 月 21 日與 22 日另有工作坊，談生成式 NFT 製作、區塊鏈技術與文化應用，線上展區則整理他從互動網頁設計、生成式藝術到互動 NFT 的創作歷程。票價全票新臺幣二百八十元、學生票一百五十元、愛心票一百四十元，四歲以下與六十五歲以上免票。 - 個展 - 沉浸式 來源與相關紀錄 - [前往原始頁面 ↗](https://monolab.world/zh/exhibition/23) - [MONOLAB 展覽頁](https://monolab.world/zh/exhibition/23) - [500輯](https://500times.udn.com/wtimes/story/12672/6329101) - [中央廣播電臺](https://www.rti.org.tw/news/view/id/2133415) - [個展《混沌實驗室》第一檔 @ 双融域 AMBI SPACE ONE](https://cheyuwu.com/zh/lab/2022/#lab-chaos-lab-1) · 同一檔展覽的五月延伸場 (策展主題) 2022-05-31紀錄文發布日期。文章未標示聚會場地。已公開 ### Creative Coding Taiwan 五月社群聚：吳秉聖談聲光裝置與創意程式 Creative Coding Taiwan 社群五月聚會的紀錄，講者為噪咖藝術的聲音藝術家與音樂總監吳秉聖，以及 Team9 技術總監、清華大學講師張文瀚。吳秉聖分享他把聲音、光線與互動裝置整合的做法，背景橫跨視覺與聲音藝術，修習過創意聲響與媒體技術。簡報介紹六件作品，包含回應在地織品文化的光裝置、音樂場館裡的互動地板燈、公共空間的合成器裝置、上海的玻璃柱聲音雕塑、戶外樂器裝置與互動打擊設置。他說自己從創作角度而不是工程角度進入程式，常用 Max MSP 與 TouchDesigner 這類視覺化程式工具，把聲音設計與機構、燈光系統整合進公共藝術。 - 社群聚會 - 聲音裝置 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/05/31/creative-coding-meetup-202205-pingshenwu/) - [Creative Coding TW](https://creativecoding.in/2022/05/31/creative-coding-meetup-202205-pingshenwu/) - [Creative Coding Taiwan 第一次社群聚：吳哲宇的生成式藝術宇宙](https://cheyuwu.com/zh/lab/2022/#lab-cct-meetup-1) · 同一條社群聚會系列 (策展主題) 2022-06-02官網 NFT 頁標示的發行日期。版數兩份紀錄不同，官網記一千版，CV 記四百版。fxhash 平台已停止營運。已公開 ### 靈魂魚 SoulFish 發行於 fxhash 的生成式作品。作品自述取莊周夢蝶的意象，寫靈魂魚生於虛無，由人的情感凝結而成，在數位的深處靜靜緩緩地游動，問的是我們如何理解不同存在形式裡的喜悅與意識。每一版在瀏覽器中即時運算，視覺各不相同。 - 靈魂系列 - fxhash ![靈魂魚 SoulFish 動態作品畫面](https://s3.ap-northeast-1.amazonaws.com/strapi-files.monolab.world/prd/large_soulfish_ca9e2ba6f6.gif) 來源與相關紀錄 - [前往原始頁面 ↗](https://cheyuwu.com/nft/soulfish) - [Che-Yu Wu 官方網站](https://cheyuwu.com/nft) - [靈魂海 SoulSea](https://cheyuwu.com/zh/lab/2022/#lab-soulsea) · 靈魂系列 (策展主題) 2022-06-09文章發布日期。已公開 ### 【老闆週六來聊聊】吳哲宇 Art Blocks Project Electriz 製作分享 談 Electriz 這件 Art Blocks 生成式 NFT 的製作過程。作品模擬雲霧室實驗中的粒子行為，粒子穿越帶電性質不同的空間時留下軌跡。技術重點包含用 p5.js 搭配 keccak 雜湊做固定隨機，確保每一版輸出穩定一致；把程式碼分段上鏈，每一段約花一顆以太幣；在 Art Blocks 的測試環境先驗證後再正式上線；以及用 Token Art Tools 預覽不同雜湊值的變化。文章也談 NFT 的成敗不只看作品好壞，創作者需要在 Discord 與社群媒體上經營個人品牌，考慮數位與實體體驗的結合，並在作品被看見之前持續與社群互動。 - Art Blocks - 製作紀錄 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/06/09/artblocks-electriz/) - [Creative Coding TW](https://creativecoding.in/2022/06/09/artblocks-electriz/) - [Project Electriz（Art Blocks #216）](https://cheyuwu.com/zh/lab/2022/#lab-electriz) · 文章拆解的作品 (來源關聯) 2022-06-16文章發布日期。已公開 ### 【互動網頁程式教學】活用 GUI Object 與繼承概念，完成 Canvas 物件導向的滑鼠拖曳互動 教在 HTML5 Canvas 上不靠外部函式庫做出互動式 GUI 元件。文章分三塊：先用 Vec2 類別簡化座標與位置管理，讓多物件的程式碼收斂；再建三層的 GUI 架構，分別是單一 GUI 物件、GUI 群組，以及負責繪製與事件偵測的 Scene 類別；最後實作兩個互動，滑鼠移到物件上變色的視覺回饋，以及用 mousedown、mousemove 與 mouseup 串起來的拖放。文章強調用函式多載與 inRange() 判斷滑鼠與物件的碰撞。 - Canvas - 物件導向 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/06/16/gui-object-canvas/) - [Creative Coding TW](https://creativecoding.in/2022/06/16/gui-object-canvas/) - [【Canvas 創作教學】動態敵人偵測雷達圖](https://cheyuwu.com/zh/lab/2022/#lab-ccin-radar) · 同一條 Canvas 教學線 (策展主題) - [外星圖像渲染語言？如何應用 Shader 跟 WebGL 達成絢麗視覺效果](https://cheyuwu.com/zh/lab/2022/#lab-ccin-shader-intro) · 同一條教學文發布線 (策展主題) 2022-07-07文章發布日期。已公開 ### 外星圖像渲染語言？如何應用 Shader 跟 WebGL 達成絢麗視覺效果 介紹 shader 與 WebGL 在網頁上做視覺效果的用法。文章把 shader 解釋成一組會在螢幕上每一個像素各跑一次的指令，靠 GPU 高速處理而不是全靠 CPU 運算。應用面談扭曲的 hover 效果、3D 模型渲染與位移貼圖，並列出 The Book of Shaders、Shadertoy 與 p5.js 等學習資源，附上雜訊與扭曲效果的程式範例。文章也舉 Outernets 與一個臺灣啤酒活動網站當作商業實作的例子，並指出要把 shader 用在正式環境，還得補上 JavaScript 模組與打包工具的知識。 - Shader - WebGL 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/07/07/shader-webgl-intro/) - [Creative Coding TW](https://creativecoding.in/2022/07/07/shader-webgl-intro/) - [【互動網頁程式教學】活用 GUI Object 與繼承概念，完成 Canvas 物件導向的滑鼠拖曳互動](https://cheyuwu.com/zh/lab/2022/#lab-ccin-gui-object) · 同一條教學文發布線 (策展主題) - [圓圓圈圈：利用迴圈呈現重覆的美](https://cheyuwu.com/zh/lab/2022/#lab-ccin-circles) · 同一條教學文發布線 (策展主題) 2022-07-28文章發布日期。已公開 ### 圓圓圈圈：利用迴圈呈現重覆的美 談如何用迴圈做出重複的視覺圖樣。文章先舉藝術與自然裡的重複，再教 p5.js 的 for 迴圈語法與基本應用、巢狀迴圈做格狀排列，以及在重複之中加入規則與變化。實作範例做一件以音樂為靈感的作品，把彩色球體排成四乘四的格子，創作靈感取自臺灣樂團 The Fur. 的〈Friday Love〉，示範如何把靜態的設計元素與動態生成的粒子結合。完整範例放在 OpenProcessing。 - 迴圈 - p5.js 來源與相關紀錄 - [前往原始頁面 ↗](https://creativecoding.in/2022/07/28/cc-ch5-circle/) - [Creative Coding TW](https://creativecoding.in/2022/07/28/cc-ch5-circle/) - [外星圖像渲染語言？如何應用 Shader 跟 WebGL 達成絢麗視覺效果](https://cheyuwu.com/zh/lab/2022/#lab-ccin-shader-intro) · 同一條教學文發布線 (策展主題) 2022-07僅記到月份，依藝術家自記。藝術家紀錄 ### FAB DAO BlindBox NFT（第一與第二階段） FAB DAO 的 BlindBox NFT，分第一與第二兩個階段發行。FAB DAO 全名 Formosa Art Bank DAO，是他與黃豆泥共同發起的公益型 NFT 自治組織，把區塊鏈募資接到非營利組織與新興創作者身上。 - 公益 NFT - DAO ![FAB DAO 百岳計畫主視覺](https://cheyuwu.com/static/img/Projectp.png) 來源與相關紀錄 - [前往原始頁面 ↗](https://project.fab.tw/) - [FAB DAO 計畫頁](https://project.fab.tw/) - [智榮基金會《施振榮伯樂識馬 吳哲宇國際舞台發光》](https://cheyuwu.com/zh/lab/2022/#lab-stans-foundation) · 報導提到的 FAB DAO 計畫 (策展主題) - [區塊勢 EP.150 賣授權是失策，純創作的 NFT 更搶手](https://cheyuwu.com/zh/lab/2022/#lab-blocktrend-ep150) · 節目談到的 FAB DAO (策展主題) 2022-07-30倉庫建立日期。公開原型 ### cheyu-genart-fairy-village 程式碼庫 公開於 GitHub 的生成式作品程式碼庫。倉庫包含 index.html 與 index_randomhash.html、index_tokenhashtool.html 兩個變體頁面，程式檔有 mySketch.js、Artblocks.js 與 seperatechunk.js，另有 package.json、featurefield.json、build 與 dist 目錄以及 canvas-light.jpeg。檔名中的 Artblocks 與 tokenhashtool 指向 Art Blocks 的上鏈與雜湊預覽流程。主分支累積三十一個 commit，About 欄位留空。 - 生成式藝術 - 開源 來源與相關紀錄 - [前往原始頁面 ↗](https://github.com/frank890417/cheyu-genart-fairy-village) - [GitHub](https://github.com/frank890417/cheyu-genart-fairy-village) - [AB_Project_CheYu 程式碼庫](https://cheyuwu.com/zh/lab/2022/#lab-ab-project-repo) · 同一條 Art Blocks 製作線 (策展主題)