用官方 algorithmic-art 寫「可重現」的 p5.js 生成藝術

生成藝術最惱人的是『跑出一張好看的，卻再也回不去』。這個官方技能用 seeded randomness 鎖住可重現性——同一個種子永遠長出同一張畫，再給你流場、粒子、諧波干涉等技法與互動參數，把亂數變成可探索的設計空間。

[ 登入後可看完整內容 ]

## 這是什麼？解決什麼痛點 生成藝術（用程式跑亂數長出圖案）最大的痛點有兩個：① 跑出一張漂亮的卻『再也重現不出來』，因為亂數沒被鎖住；② 變成『無止境亂調參數』而沒有設計脈絡。Anthropic 官方的 algorithmic-art 技能用兩個招數解這兩件事——先逼你寫一段『演算法哲學』建立設計意圖，再用 Art Blocks 式的 seeded randomness 把每張畫面綁到一個種子上，達成完全可重現。 ## 為什麼值得用這個來源 這是 Anthropic 官方 `anthropics/skills` repo 的第一方技能，附帶可直接套用的 `templates/viewer.html`（內含固定的側欄結構：Seed → Parameters → Actions、品牌色與字型 Poppins/Lora、種子導覽按鈕）與 `templates/generator_template.js`（最佳實務參考，而非『樣式選單』）。官方特別強調 template 是『字面上的地基』而非靈感來源：複製它的 HTML 結構，只替換 p5.js 演算法與參數控制。它也明確要求『創作原創作品、不複製既有藝術家』來規避版權問題。 ## 怎麼用（要點） 1. 階段一先寫『演算法哲學』（4-6 段）：描述這套系統的規則、張力與它想呈現的感受，而不是只描述外觀。這一步決定作品有沒有靈魂。 2. 階段二把哲學變成單檔可互動 HTML：p5.js inline 嵌入、無外部相依。 3. 可重現性是硬規則：`randomSeed(seed); noiseSeed(seed);` 放在 setup 開頭，同種子永遠長出同一張畫。 4. 參數從『系統本身的可調性質』設計——數量、尺度、機率、比例、角度、閾值——而非塞一堆 preset。 5. 內建種子導覽（上一個/下一個/隨機/跳到指定種子）＋ Regenerate / Reset，讓人在同一個檔案裡就能探索整個設計空間。 ## 常見技法 Perlin noise 驅動的流場（flow field）、帶向量力的粒子系統、諧波干涉圖樣、遞迴分支結構、向量場視覺化。 ## 何時用 - 你想做能上鏈或能系統化收藏的『可重現』生成藝術（每個種子一件作品）。 - 你要把一個視覺概念變成『可調參數、可互動探索』的作品，而非一張死圖。 - 你想學流場 / 粒子系統等經典生成技法的乾淨範本起手式。 📎 來源：anthropics/skills（作者 Anthropic，Apache-2.0 授權）— 本篇為繁中改寫整理，內容經改寫，原始內容見上方連結。