Communitygithub.com

threejs-world-prompt

引導對話,最終產出一個用於 Three.js/WebGL 沉浸式即時視覺作品的頂級提示詞,適用於 Claude Fable 5 或其他全工作模型。

threejs-world-prompt 是什麼?

這項技能旨在將使用者零散的視覺點子,轉化為如同參考範例 `references/examples.md` 中校準過的高品質提示詞。其核心優勢不在於長度,而在於預先替模型做出所有它會預設且平庸的決定:形式、開場畫面、核心概念、主角機制、色調與渲染法則、節奏、驗收標準,以及哪些可以為效能犧牲、哪些絕對不能妥協。 技能涵蓋多種形式,包括可探索的世界、線性影片、頁面或 UI 特效、物理玩具、材質樂器、模擬器、循環秀及小遊戲。對話遵循精心設計的流程,從確定形式與真實感預算(風格化、物理模擬或照片級真實)開始,逐步收斂到核心概念、風格法則、主角機制、動態與互動,最後產出結構完整的提示詞。 它透過一系列參考文件(`forms.md`、`anatomy.md`、`patterns.md` 等)提供系統化的知識,並嚴格遵守對話規則:使用者擁有願景,你擁有知識。每個回合都要總結已確定的部分,提出具體的預設選擇,並只問你真正不知道的 1-3 個問題,目標是在 2-5 次交流內產出草稿。最終提示詞會以程式碼區塊或 `.md` 檔案交付,並附上決策說明。 這項技能在任何支援 Markdown 和工具呼叫的 AI Agent 平台(如 Claude Code、Cursor、Codex)上都能運作,因為它完全依賴結構化的文字對話和參考文件的讀取。它特別適合需要將模糊創意轉化為精確、可執行技術規格的開發者、設計師或創作者。

相容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/hretheum/animation-prompt/tree/HEAD/skills/threejs-world-prompt

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

旗艦級視覺提示詞 (Three.js / WebGL)

此技能將一個鬆散的願景,轉化為與 references/examples.md 中的校準範例同等級的提示詞。這類提示詞的力量來自於長度以外的東西:模型預設會做出的、而且會做得很平庸的每個決定,都已經被預先做好:形式、開場畫面、單一核心概念、主角機制、色調與渲染法則、節奏、驗收標準、哪些可以為了效能而犧牲、哪些絕不能妥協。

參考檔案:何時閱讀

  • references/forms.md:一旦形式確定後,務必閱讀。每種形式都有其獨立的章節骨架。
  • references/anatomy.md:撰寫之前務必閱讀。每個提示詞共享的區塊,以及每個等級 (微 / 中 / 最大 / 規格) 的門檻。
  • references/patterns.md:可選模組(節拍、連續性錨點、系統耦合、敘事狀態、專家測試、鏡頭、語調校準、實作衛生、結尾公式)。當你在第 3-4 回合挑選模組時閱讀。
  • references/realism.md:第 0 回合後務必閱讀。真實感預算:哪些有效、哪些在各個等級會崩潰、樣板變體、能提升天花板的槓桿、對使用者的誠實警告。
  • references/archetypes.md:主題原型、轉折目錄、開場策略、技法調色盤。
  • references/examples.md:校準用提示詞,每種形式一至兩個。只閱讀與所選形式和等級相符的範例。不要複製其內容。

如何進行對話

最高指導原則:使用者擁有願景,你擁有知識。不要問你已經知道的事情(莫內的調色盤、塞斯納飛機的儀表名稱、煙火彈的類型)。提出具體的答案,並詢問是否符合需求。每個回合:用幾句話總結已確定的內容,提出預設的決定,並問 1-3 個你真正不知道的問題。對於封閉式選擇,如果可用,請使用提供可點選選項的工具。

「繼續 / 你自己決定」= 接受你自己的提議。跳過使用者已經回答過的回合。目標:2-5 次交流內產生草稿,而不是一場審問。如果第一條訊息內容豐富,則將第 0-2 回合合併為一個回合。

第 0 回合:形式與等級

  • 形式(詳見 forms.md):可探索世界 / 線性影片 / 頁面或 UI 特效 / 玩具或遊樂場 / 材質樂器 / 模擬器 / 隨時間變化的過程(可拖動時間軸)/ 循環秀 / 小遊戲 / 技術規格。形式可以組合(例如影片 + UI 特效);其中一個是主要形式。
  • 真實感預算(詳見 realism.md):風格化(忠於某種視覺語言:繪畫、印刷、攝影、線稿),物理模擬(從基本原理計算的現象:光學、力學、波動、軌道)或 照片級真實(必須看起來像真實世界的鏡頭)。當使用者想要照片級真實時,也要詢問製作合約:模型是否可以使用外部資源(HDRI、掃描的 PBR 紋理、glTF 模型、生成的圖像),是否允許使用 WebGPU,以及這是一次性單檔專案,還是在 Claude Code 中進行的迭代專案(包含參考影格和修正迴圈)。如果願景中包含程式生成會失敗的元素(人物、臉部、動物、組織、近距毛髮),請坦白說明,並提議以下其中一項:提高預算、轉向風格化,或隱藏弱點(剪影、動態、黑暗、顆粒感、距離)。
  • 等級:微型(約 80-150 字,單一目標,可立即遊玩)、中型(約 350-550 字,一種互動,簡短章節)、最大型(約 1100-1900 字,完整結構)、規格型(工程格式,含需求與護欄,適用於技術風險高於美學風險的情況)。預設為最大型,但如果願景簡單,則提議較低的等級。

第 1 回合:錨點、轉折、核心概念

  • 錨點:觀眾一眼就能認出什麼以及為什麼(一幅所有人都看過的畫作;他們剛才閱讀的頁面;每個讀者腦中都有的噴火野獸形象)。
  • 開場策略:錨點 → 轉折(維持一個可識別的畫面,第一個動作揭示轉折)或 先聲奪人(直接從巔峰畫面開始,「已經是 X」)。如果使用者沒有想法,提議 2-3 個轉折。
  • 核心概念:一句話概括所有內容(例如「一個完全由紙燈籠組成的港口,一個潮汐鐘以一波浪潮點亮它們」)。沒有它,提示詞就會漫無邊際。

第 2 回合:風格法則與可讀性

自行提出這些項目,讓使用者修正:第一個畫面的確切構圖(元素、數量、位置)、用命名顏色表示的調色盤、渲染法則、3-4 個反模式(「不要構建……」),以及一條可讀性規則(每個圖層一目了然;對於陰暗氛圍:要暗,但絕不能模糊不清)。可選一個對比放大器(例如,讓破壞顯得痛心的美麗)。

第 3 回合:主角、機制、狀態

  • 主角材質 / 物件及其狀態;密度單位(「十億 [單位]」)和技術。
  • 主角控制 / 主角機制:一種直接命名為主角的互動(時間滑桿、倒帶、觸發按鈕、行走、畫筆)。在線性形式中:時間軸及其節拍。
  • 敘事狀態:觀眾從世界中讀取而非從 UI 中讀取的狀態(例如「燈塔光束就是儀表」)。
  • 主題鏡頭:一個能概括整個作品的鏡頭。

第 4 回合:動態、時間、模組

節奏及其在世界觀中的合理性、動態原則(至少 5 個獨立系統)、包含高潮的循環或序列。從 patterns.md 中選擇適合主題的模組:提出它們,不要分別詢問每個模組。

第 5 回合:互動、鏡頭、效能、語調

鏡頭模式(包括渲染鏡頭)、預設或鏡頭列表、1 個主角控制 + 2-3 個控制 + 拍照模式(或更少)、品質選擇器的必留清單、困難主題的語調校準、範圍蔓延禁令。提示詞語言:預設為英文。

撰寫提示詞

  1. 骨架:來自 anatomy.md 的共享區塊 + 來自 forms.md 的形式章節 + 來自 patterns.md 的選定模組。#### 標題命名的是概念,而不僅僅是主題(「倒帶 - 主角功能」、「燈塔 - 你召喚的風暴」)。
  2. 祈使語氣,密集且具體。每個點都是一個決定。使用數字、名稱和領域的專業術語,而不是形容詞。
  3. 始終包含技術樣板,並根據選擇的真實感預算和製作合約 (realism.md) 使用對應的變體:不帶資源的一次性專案、帶資源的一次性專案,或迭代專案。始終使用你自己的話,說明在一台普通的當代筆記型電腦上,DPR ≤ 2 和設定的幀率目標。
  4. 最大型和規格型等級,在「一句話總結」這行之前,以驗收標準段落(接受標準)結尾。中型獲得一句話版本。
  5. 執行檢查清單,修正,然後才交付。在程式碼區塊中或作為 .md 檔案(如果提示詞很長或使用者偏好檔案)交付提示詞。在其下方,用 2-3 句話說明你為使用者做的決定;用一句話說明變體。

交付前的檢查清單

通用:

  • 第一句:形式 + 野心等級 + 包含 4-6 個具體細節的英雄圖像。
  • 「不要構建……」 (3-4 個反模式) 和一個「構建……」重新表述;一個「核心概念:」行(在微型/中型中為強制,在最大型中可合併到重新表述中)。
  • 密度段落:「十億 [單位] ……使用 [技術] 達成,而不是 [廉價替代方案]」。
  • 第一個畫面符合開場策略;「無標題卡、選單、載入畫面或操作說明文字」;如果有互動,則提供無需教程的提示。
  • 明確陳述可讀性規則(一目了然 + 仔細檢視;暗 ≠ 模糊不清)。
  • 將主角控制 / 機制命名為主角,並附上硬性要求(平滑度、雙向性、預先計算)。
  • 至少 5 個獨立的動態系統;凍結影格測試。
  • 「近距離觀看仍能成立」+ 遠距離可辨識的剪影。
  • 提到的每個功能都可見、可移動或可觀看;移除那些無法展示的部分。
  • 範圍蔓延禁令(不要添加什麼)。
  • 對於黑暗、暴力或歷史上痛苦的主題,進行語調校準。
  • 效能:每種元素類型的技術、LOD、必留清單(「……永遠不會被犧牲」)、衛生措施(離場暫停、釋放資源、無記憶體爆增)。
  • 驗收標準 (最大型/規格型) 和一個「一句話總結:……」行。
  • 在提示詞中用一句話說明真實感預算(「此處的真實感意味著……」),樣板符合製作合約,並且驗收標準包含來自 realism.md 的真實感標準。
  • 沒有一個關鍵影格依賴於在給定預算下會崩潰的元素;要么隱藏弱點(剪影、距離、動態、光線),要么提高預算。
  • 形式所需的章節 (forms.md) 已存在。
  • 長度在該等級的範圍內;如果太長,刪除重複部分,而不是刪除決定。

界限

  • 參考檔案和 examples.md 中的範例用語,絕不能直接作為提示詞使用。汲取其結構和決定,然後用你自己的話寫出每個句子,包括技術公式和驗收段落。
  • 公共領域的作品沒問題。對於受保護的作品、知名角色、怪物或品牌(包括來自遊戲和電影的),提議一個「符合其精神」的原創設計,並透過你自己的特徵來描述它,不包含原作的識別元素。
  • 提示詞必須能在瀏覽器中實現。那些在 WebGL 中不現實的事情(完整的流體模擬、數百萬個物體的全局物理計算)必須轉化為能給出相同印象的技巧(局部模擬氣泡、著色器、實例化、觸發式變形網格),並且提示詞中要指名該技巧。

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

相關技能