anidoodle
完全由程式碼繪製的圖像、電影與互動作品。一個純函數繪製每一幀;另一個純函數編寫並合成每一個音訊樣本。同一份原始碼能在任何機器、任何尺寸、任何長度下重建相同的像素與相同的聲音。
引擎只是簡單的一半。作品會被丟棄,因為它沒有重點,因為主題只是自身的圖示,因為風格只是色盤調換,因為音樂沒有形式,或者因為創作者在審核片段時耗盡了耐心。此技能承載了能避免上述所有問題的工藝。
從提問開始,然後建構
閱讀 references/workflows/start-here.md 並執行其導入流程:一次一個問題,只問請求中未明確的部分,並先提出你的建議。他們在製作什麼、使用哪種風格(展示圖鑑頁面,https://github.com/alexgreensh/anidoodle/blob/main/skills/anidoodle/assets/styles.jpg;風格列表請見 references/styles/INDEX.md)、什麼尺寸(1x1、9x16、16x9、4x5 或任意 W x H)、多長(任意長度;永不設上限)、什麼聲音(無聲或某種音樂風格與情緒)、哪些角色。如果對方說「你決定」,就由你選擇並用一句話說明原因。在開始繪圖前,將答案寫成一份簡短的簡報。
你在製作什麼?
| 製作項目 | 請閱讀 |
|---|---|
| 靜止畫面:主視覺、重點插圖、封面、卡片、海報、一系列 | 下方的靜止畫面工作流,references/formats.md |
| 自行繪製的畫面(縮時、幕後製作) | references/workflows/drawing-process.md |
| 循環動畫、貼圖、動態標誌、環境頁首 | 下方的循環工作流,references/formats.md |
| 故事影片,任意長度 | 下方的電影工作流,references/workflows/long-film.md |
| 解說或資訊圖表 | references/workflows/explainer.md |
| 發表或產品影片(歡迎使用對方的螢幕截圖) | references/workflows/launch-video.md;建構在 references/workflows/launch-video-kit.md 之上 |
| 可回應 UI 的互動式網頁動畫 | references/workflows/interactive.md |
| 繪圖課程,或「我該怎麼畫這個?」 | references/workflows/teach-drawing.md |
| 在任何風格中保持完全一致的角色(從木刻到樂高積木) | references/workflows/character-consistency.md,references/anatomy.md |
| 從對方提供的圖片中比對風格 | references/workflows/adapt-a-style.md |
| 配樂或原聲帶 | references/music/README.md |
- 音樂:為影片創作你自己的配樂(
references/music/README.md);node tools/music.mjs check <score.ts#export>必須通過,才能讓人類聆聽。 - 音效:
references/music/sound-design.md。14 層、基於種子的音效,由影片幀觸發(filmSfx);配樂會自動降低音量,且每個音效提示必須在配樂 6 dB 範圍內。音效僅在真正的方向變化時使用,每部影片一個漸強音 + 一個衝擊音。 - 發表影片:
launchTemplate.ts從資料中渲染產品的發表影片:提示、為其繪製的圖板、為其創作的配樂、文字、安裝指令;節省 token 的習慣寫在references/working-method.md中。
七條法則
- 每件作品都要有意義。 靜止畫面:一個想法、一個焦點主體、一種光線。影片:一個轉變、一個回報、一個會回歸的象徵。→
references/storytelling.md - 標明寫實程度。 對於動物、物體與人物,都要說明解剖結構、視角以及你開啟的參考資料。→
references/realism-and-craft.md,references/anatomy.md - 風格是一種做標記的方式。 改變介質、邊緣和標記的順序,而不僅僅是色盤。→
references/styles.md - 先用一張靜止畫面證明外觀,然後從頭到尾建構。 在那之後,審查關卡的成本大過其價值。→
references/working-method.md - 合約是絕對的。 純函數
(frame, env)(對於互動作品則是輸入記錄),僅使用rng(seed),沒有時鐘,沒有ctx.filter。不產生或下載任何東西;對方帶來的圖片可以嵌入,並透過雜湊值固定。→references/determinism-and-contract.md - 音樂需要計劃,不要只用形容詞。 一種風格、每個段落的 mood、以資料形式記錄的音符,然後是測量。你無法親自聆聽,所以在上線前需要有人聆聽。→
references/music/ - 一人導演,一人建構,兩者都要寫下所有事情。 當會議品質下降時,重新設定;檔案就是記憶。→
references/working-method.md
工作流程
靜止畫面。 (1) 用一句話說明想法;指出焦點主體和光線。 (2) 為任何存在的物體開啟真實參考資料,並記錄下來。 (3) 選擇風格,並先閱讀其圖板的標題。 (4) 按照該介質的繪製順序進行繪圖。 (5) 使用 still.mjs 以完整尺寸渲染,對裁切區域(臉部、手部、腳部、關節;references/craft-bar.md)執行細節檢查,並以書面方式評論。 ✋ 一次核准。 (6) 從同一原始碼交付所需的所有尺寸與形狀,並標註 reproducible(可重現)。
循環動畫。 如同靜止畫面,再加上:每個動作在循環中是週期性的,主體永不停止,每秒都有東西在動。檢查接縫(最後一幀相對於第 0 幀)。✋ 一次核准,需在動態檔案上進行。
電影。 (1) 用三句話描述故事(設定、轉變、回報)以及象徵;對於較長的影片,需有主線加上每章節一句話。如果寫不出來,就停止。 (2) 時間網格:一個節拍長度為 60 x fps / bpm 幀,bpm 來自簡報中的配樂;一個提示表格包含每個幀號,並在載入時由檢查器執行。 (3) 為任何存在的物體開啟真實參考資料。 (4) 一張確認外觀的靜止畫面,選擇最難的一幀,以書面方式評論。✋ 核准。 (5) 一段 8 秒的音樂樣本。 ✋ 核准。 (6) 建構整部影片;機械檢查持續執行。 (7) 從渲染完成的檔案進行一次審查:每個節拍的聯絡表、每組剪輯的成對畫面、靜默幀的數據。一份排序後的修正清單,一次重建。 (8) ✋ 最終核准。 說明你驗證了什麼以及你無法驗證什麼。
最多三道核准閘門。核准是一種預算;在犯錯成本高的地方使用它。
工藝標準
測試:一位自豪的人類插畫家是否會交付這項作品,或者它只是機械式的形狀組合?完整的判斷標誌清單請見 references/craft-bar.md。最容易讓作品失敗的項目包括:用橢圓堆砌的主體、將一種風格直接換色成另一種、淡入而非真正繪製出來的事物、關節如橡膠般的人物、以及不同鏡頭間畫法不一致的角色。
任何會動的內容都不能有靜默幀:每秒都必須有明顯的變化。一部自行繪製的影片需宣告 kind: "drawing",並以更嚴格的標準評斷;完全靜止的畫面則為不合格。
引擎
engine/ 是可攜式的藝術核心與相關工具。engine/src/canvas-core 不了解 DOM 或任何後端。W、H、fps 和 durationFrames 來自影片的 meta。攝影機移動(平移、縮放、視差、震動)來自 engine/src/canvas-core/camera.ts:references/camera.md。render.mjs --blur N 使用動態模糊渲染(每幀在線性光線中平均 N 個子幀);預設路徑則不受影響。
node <skill>/engine/tools/scaffold.mjs ~/art --film intro --format 9x16 --duration 12 # 秒
cd ~/art && npm install && npx playwright-core install chromium
node tools/still.mjs intro --frame 0 --out out/look.png --scale 2 # 一張靜止畫面,附帶其雜湊值
node tools/render.mjs intro # MP4;--out x.gif|x.webm|x.apng
node tools/gate.mjs intro # 決定性、合約、靜默幀、瑕疵
node tools/emit.mjs intro --out out/intro.html # 一個自包含的離線播放器
| 工具 | 功能 |
|---|---|
scaffold.mjs | 建立包含靜止畫面和/或影片的專案;--duration、--format 或 --size、--fps、--bpm |
still.mjs / render.mjs | 雙次繪製幀並帶有雜湊值(--frames a,b,c --sheet 在一個瀏覽器中執行) / 以任何格式輸出作品(--from/--to、--poster-frame、--hashes) |
gate.mjs | 決定性、合約、靜默幀、瑕疵;--self-test 證明它能夠失敗 |
registry.mjs / gallery.mjs | 從圖板本身提取風格列表 / 圖鑑頁面 |
docs-check.mjs | 當任何文件的風格數量、長度或路徑與程式碼不符時失敗 |
verify-export.mjs | 對渲染完成的檔案進行品質檢查:幀數、時長、配樂;選擇性檢查第一幀、循環接縫、--delivery |
test.mjs (npm test) | engine/test/ 中的單元測試套件,無需瀏覽器 |
music.mjs | 渲染並測量配樂;check 對其進行門控(調性、主音量、防護、分軌、新穎度) |
sfx.mjs | 音效工具包:list、one、kit <dir>、test |
四個後端,一個藝術核心:playwright、html-player、remotion、hyperframes。
→ references/backends-and-adapters.md
實作範例
- 風格圖板在
engine/src/canvas-core/中:每種風格都有一張靜止畫面與一段繪製過程的影片,並在標題中附有配方,以及references/styles/<id>.md。 - MECHANICAL LEPIDOPTERA 在
example/中:一部 47 秒的配樂影片。執行scaffold.mjs ~/study --example。
研讀它們。但不要複製它們。 工藝標準無法透過繼承來滿足。
誠實的限制
你無法聽到配樂、觀看影片的動態,或使用互動作品。所有關於它們的主張都來自於測量或人類的回報;請說明是哪一種。綠色的勾號在重新執行之前都只是個主張。在信任一張靜止畫面之前,先用 --scale 2 渲染一幀:一個圖層如果透過錯誤的變形進行 blit,在 1x 下看起來正常,但在 2x 下就會出錯。