演算法哲學是可透過程式碼表達的運算美學運動。輸出 .md 檔案(哲學)、.html 檔案(互動式檢視器)和 .js 檔案(生成式演算法)。
此過程分為兩個步驟:
- 演算法哲學創作 (.md 檔案)
- 透過建立 p5.js 生成式藝術來表達 (.html + .js 檔案)
首先,執行此任務:
演算法哲學創作
首先,建立一個將透過以下方式解讀的「演算法哲學」(非靜態圖像或模板):
- 運算過程、湧現行為、數學之美
- 基於種子的隨機性、雜訊場域、有機系統
- 粒子、流場、場域、力
- 參數化變異與受控混沌
關鍵理解
- 收到的內容:使用者提供的一些細微輸入或指示,將其作為基礎,但不應限制創作自由。
- 創造的內容:一個演算法哲學/生成式美學運動。
- 下一步:同一個版本接收到哲學後,以程式碼將其表達出來——建立 p5.js 草圖,其中 90% 是演算法生成,10% 是必要參數。
考慮此方法:
- 為一場生成式藝術運動撰寫宣言
- 下一階段涉及撰寫賦予其生命的演算法
哲學必須強調:演算法表達。湧現行為。運算之美。基於種子的變異。
如何產生演算法哲學
為運動命名(1-2 個詞):例如「有機湍流」/「量子諧和」/「湧現靜止」
闡述哲學(4-6 段——簡潔但完整):
為了捕捉演算法的本質,請表達此哲學如何透過以下方式體現:
- 運算過程和數學關係?
- 雜訊函數與隨機模式?
- 粒子行為與場域動力學?
- 時間演化與系統狀態?
- 參數化變異與湧現複雜性?
關鍵指導方針:
- 避免冗餘:每個演算法層面應只提及一次。除非增加新的深度,否則避免重複雜訊理論、粒子動力學或數學原理的概念。
- 反覆強調工藝:哲學必須多次強調,最終的演算法看起來應像經過無數小時的開發、精心打磨,並出自其領域頂尖專家之手。此框架至關重要——重複使用「精心打造的演算法」、「深度運算專業知識的結晶」、「費盡心力的最佳化」、「大師級的實作」等短語。
- 保留創作空間:對演算法方向要具體,但足夠簡潔,以便下一個 Claude 有空間以極高的工藝水準進行解讀性的實作選擇。
哲學必須引導下一個版本以演算法方式表達想法,而非透過靜態圖像。美存在於過程之中,而非最終的幀畫面。
哲學範例
「有機湍流」 哲學:受自然法則約束的混沌,秩序從混亂中湧現。 演算法表達:由多層 Perlin 雜訊驅動的流場。數千個粒子遵循向量力,其軌跡累積成有機密度圖。多個雜訊八度音階創造了湍流區域與平靜區域。顏色從速度和密度中湧現——快速粒子燃燒得明亮,慢速粒子則淡入陰影。演算法運行直到達到平衡——一個精心調校的平衡,每個參數都經過了由運算美學大師進行的無數次迭代打磨。
「量子諧和」 哲學:表現出波狀干涉模式的離散實體。 演算法表達:粒子在網格上初始化,每個粒子攜帶一個隨時間透過正弦波演變的相位值。當粒子靠近時,它們的相位會互相干涉——建設性干涉產生明亮節點,破壞性干涉則產生空洞。簡單的簡諧運動生成複雜的湧現曼陀羅圖案。這是經過費心盡力的頻率校準的結果,其中每個比率都經過精心挑選,以產出共鳴之美。
「遞歸低語」 哲學:跨尺度的自相似性,有限空間中的無限深度。 演算法表達:遞歸細分的分支結構。每個分支略有隨機化,但受黃金比例約束。L-system 或遞歸細分生成既數學又有機的樹狀形態。微妙的雜訊擾動打破了完美的對稱性。線條粗細隨每個遞歸層級遞減。每個分支角度都是深度數學探索的產物。
「場域動力學」 哲學:透過其對物質的影響而可見的不可見力場。 演算法表達:由數學函數或雜訊構建的向量場。粒子在邊緣生成,沿著場線流動,並在達到平衡或邊界時消亡。多個場域可以吸引、排斥或旋轉粒子。視覺化只顯示軌跡——像是看不見的力量留下的幽靈般證據。一場透過力平衡精心編排的運算之舞。
「隨機結晶」 哲學:隨機過程結晶成有序結構。 演算法表達:隨機化圓形填充或 Voronoi 鑲嵌。從隨機點開始,讓它們透過弛豫演算法演化。細胞相互推開直到達到平衡。根據細胞大小、鄰居數量或與中心的距離來決定顏色。湧現出的有機鑲嵌感覺既隨機又不可避免。每個種子都產生獨特的結晶之美——大師級生成式演算法的標誌。
這些是精簡範例。實際的演算法哲學應為 4-6 個實質段落。
基本原則
- 演算法哲學:建立一個將透過程式碼表達的運算世界觀
- 過程重於產出:始終強調美從演算法的執行中湧現——每次運行都是獨一無二的
- 參數化表達:想法透過數學關係、力、行為來溝通——而非靜態構圖
- 藝術自由:下一個 Claude 以演算法方式解讀此哲學——提供創意實作空間
- 純粹生成式藝術:這是關於創造活的演算法,而非帶有隨機性的靜態圖像
- 專家工藝:反覆強調最終演算法必須感覺是精心打造、經過無數次迭代打磨、由處在運算美學領域頂尖地位的專家所創造的深度專業知識的結晶
演算法哲學應有 4-6 段長度。 用詩意的運算哲學填滿它,將預期的願景結合起來。避免重複相同觀點。將此演算法哲學輸出為 .md 檔案。
推導概念種子
關鍵步驟:在實作演算法之前,找出原始請求中細微的概念線索。
基本原則: 概念是嵌入演算法本身的一個微妙、小眾的參考——不總是字面上的,總是高深莫測的。熟悉該主題的人應該能直觀地感受到它,而其他人則僅僅體驗到大師級的生成式構圖。演算法哲學提供了運算語言。推導出的概念則提供了靈魂——安靜的概念性 DNA,無形地編織進參數、行為和湧現模式中。
這非常重要:參考必須如此精煉,以至於它能增加作品的深度而不張揚自己。想像一個爵士音樂家透過演算法和諧來引用另一首歌——只有懂的人才會捕捉到,但每個人都能欣賞其生成之美。
P5.JS 實作
在哲學和概念框架建立之後,透過程式碼表達它。在繼續之前暫停以整理思緒。僅使用下方建立的演算法哲學和指示。
⚠️ 步驟 0:先閱讀模板 ⚠️
關鍵:在撰寫任何 HTML 之前:
- 使用「讀取」工具讀取
templates/viewer.html - 研究其確切結構、樣式和 Anthropic 品牌形象
- 將該檔案作為文字起點——而不僅僅是靈感來源
- 保留所有固定區段完全如圖所示(頁首、側邊欄結構、Anthropic 顏色/字型、種子控制、操作按鈕)
- 僅替換檔案註解中標記為可變的區段(演算法、參數、參數的 UI 控制項)
避免:
- ❌ 從頭建立 HTML
- ❌ 發明自訂樣式或配色方案
- ❌ 使用系統字型或深色主題
- ❌ 更改側邊欄結構
遵循這些做法:
- ✅ 複製模板的確切 HTML 結構
- ✅ 保留 Anthropic 品牌形象(Poppins/Lora 字型、淺色、漸層背景)
- ✅ 維持側邊欄版面(種子 → 參數 → 顏色? → 操作)
- ✅ 僅替換 p5.js 演算法和參數控制項
模板是基礎。在此之上建構,而不是重建。
為了建立有生命、會呼吸的畫廊級運算藝術,請以演算法哲學為基礎。
技術要求
基於種子的隨機性(Art Blocks 模式):
// 始終使用種子以保證可重現性
let seed = 12345; // 或來自使用者輸入的雜湊值
randomSeed(seed);
noiseSeed(seed);
參數結構——遵循哲學:
為了建立自然從演算法哲學中湧現的參數,請考慮:「這個系統的哪些特質是可以調整的?」
let params = {
seed: 12345, // 始終包含種子以保證可重現性
// 顏色
// 新增控制您演算法的參數:
// - 數量(多少?)
// - 規模(多大?多快?)
// - 機率(多可能?)
// - 比率(什麼比例?)
// - 角度(什麼方向?)
// - 閾值(行為何時改變?)
};
為了設計有效的參數,專注於系統需要可調校的屬性,而不是思考「圖案類型」。
核心演算法——表達哲學:
關鍵:演算法哲學應決定要建構什麼。
為了透過程式碼表達哲學,避免思考「我應該使用哪種圖案?」而是思考「如何透過程式碼表達這個哲學?」
如果哲學是關於有機湧現,考慮使用:
- 隨時間累積或成長的元素
- 受自然規則約束的隨機過程
- 反饋迴路和互動
如果哲學是關於數學之美,考慮使用:
- 幾何關係和比率
- 三角函數和諧波
- 產生意外模式的精確計算
如果哲學是關於受控混沌,考慮使用:
- 嚴格邊界內的隨機變異
- 分岔和相變
- 從混亂中湧現的秩序
演算法源自於哲學,而非來自一個選項選單。
為了引導實作,讓概念本質為創意和原創的選擇提供資訊。建構能表達此特定請求願景的東西。
畫布設定:標準 p5.js 結構:
function setup() {
createCanvas(1200, 1200);
// 初始化您的系統
}
function draw() {
// 您的生成式演算法
// 可以是靜態的(noLoop)或動畫的
}
工藝要求
關鍵:為了達到精通,建立的演算法要讓人感覺像是經過一位大師級生成式藝術家無數次迭代而湧現的。仔細調校每個參數。確保每個模式都有目的地湧現。這不是隨機雜訊——這是透過深度專業知識打磨過的受控混沌。
- 平衡:複雜性但不含視覺雜訊,有序但不僵化
- 色彩和諧:經過深思熟慮的調色板,而非隨機的 RGB 值
- 構圖:即使在隨機性中,也要維持視覺層次和流動
- 效能:流暢執行,若為動畫則針對即時進行最佳化
- 可重現性:相同的種子始終產生完全相同的輸出
輸出格式
輸出:
- 演算法哲學——作為解釋生成式美學的 markdown 或文字
- 單一 HTML 工件——從
templates/viewer.html建構的自包含互動式生成式藝術(請參閱步驟 0 和下一節)
HTML 工件包含所有內容:p5.js(來自 CDN)、演算法、參數控制項和 UI——全部在一個檔案中,可立即在 claude.ai 工件或任何瀏覽器中運作。從模板檔案開始,而不是從頭開始。
建立互動式工件
提醒:templates/viewer.html 應已被讀取(見步驟 0)。使用該檔案作為起點。
為了允許探索生成式藝術,建立一個單一、自包含的 HTML 工件。確保此工件能立即在 claude.ai 或任何瀏覽器中運作——無需任何設定。將所有內容內嵌。
關鍵:固定 vs 可變部分
templates/viewer.html 檔案是基礎。它包含了所需的确切結構和樣式。
固定部分(始終完全按圖中包含):
- 版面結構(頁首、側邊欄、主畫布區域)
- Anthropic 品牌形象(UI 顏色、字型、漸層)
- 側邊欄中的種子區段:
- 種子顯示
- 上一個/下一個按鈕
- 隨機按鈕
- 跳轉到種子輸入 + 執行按鈕
- 側邊欄中的操作區段:
- 重新產生按鈕
- 重置按鈕
可變部分(為每個藝術品自訂):
- 整個 p5.js 演算法(setup/draw/類別)
- 參數物件(定義藝術所需的內容)
- 側邊欄中的參數區段:
- 參數控制項的數量
- 參數名稱
- 滑桿的最小值/最大值/步長值
- 控制項類型(滑桿、輸入框等)
- 顏色區段(可選):
- 有些藝術需要顏色選擇器
- 有些藝術可能使用固定顏色
- 有些藝術可能是單色的(無需顏色控制項)
- 根據藝術的需求來決定
每個藝術品都應有獨特的參數和演算法! 固定部分提供了 c
…
[已截斷以利翻譯]