D҉҉A҉҉N҉҉C҉҉I҉҉N҉҉G҉҉C҉҉O҉҉L҉҉O҉҉R҉҉M҉҉A҉҉Z҉҉E҉҉

TY_☆゚
·
·
IPFS
用 p5js 的噪聲寫互動式的動動色彩迷宮!! DANCINGCOLORMAZE

作品連結

openprocessing.org/s...

如何和作品互動?

滑鼠互動!!

滑鼠讓粒子靠近時會改變顏色或軌跡,你可以想像成「呼吸」,也有一點點隨機閃爍的效果(不只是滑鼠移動><!!)。雖然程式沒有直接用滑鼠的邏輯而是間接,但你也可以隨著游標的移動,感受到畫面中心裡粒子的不同組合~

起因&作品簡介

上一堂課老師給了一個很棒的範例,用噪聲去控制元素的方向和顏色,簡單但很有趣!我想進一步延伸這個想法,做出一個更有視覺吸引力的互動作品,於是有了 DANCINGCOLORMAZE 這個創作。

這是一個由色彩、箭頭和規律組成的互動迷宮,每次刷新時都會生成一個獨特的視覺圖案。這些箭頭的方向和色彩隨著時間變化,整體畫面像是在跳舞般律動,而色彩的變化則增添了迷幻感。透過簡單的操作,觀察者可以感受到視覺上的流動感,彷彿進入了一個隨機生成的迷宮世界。

很可惜這邊沒辦法貼上動態圖片,推薦大家自行去和作品互動!!

簡單講幾個程式內容

整個作品是利用程式來控制畫面上的色彩和方向變化:

  1. 格子布局:畫面被分成了 40x20 的格子,每個格子中央放置一個箭頭。

  2. 噪聲生成:用噪聲函數產生的值決定每個箭頭的旋轉角度和顏色,讓箭頭的排列看起來既有規律又帶點隨機性。

  3. 色彩控制:每個箭頭的顏色根據噪聲值映射到 360 色相,產生不斷流動的色彩變化。

  4. 動態效果:程式會隨著時間(frameCount)改變噪聲值,讓整個畫面不斷律動。

心得&小記

這個作品最讓我滿足的是,從一段簡單的程式碼延伸出一個充滿藝術感的互動體驗。看著那些箭頭像有生命一樣旋轉、跳舞,真的會讓人覺得程式也能創造出溫暖的感覺!希望有機會能把這個作品進一步擴展,比如讓它變成一個網頁版,或者加入更多互動元素。

CC BY-NC-ND 4.0 授权

喜欢我的作品吗?别忘了给予支持与赞赏,让我知道在创作的路上有你陪伴,一起延续这份热忱!