Communitygithub.com

alexgreensh/anidoodle

コードで描かれた静止画、描画タイムラプス、映画、解説動画、インタラクティブなWebアニメーションを31のスタイルで作成し、楽曲も作曲します。参照スタイルに合わせ、キャラクターの一貫性を保ち、描画を教えます。決定論的で、生成アセットはありません。

anidoodle とは?

anidoodleは、すべてのフレームとオーディオサンプルを純粋関数で生成する、完全に決定論的なコードベースのアートエンジンです。同じソースコードから、どのマシンでも、どのサイズでも、どの長さでも、まったく同じピクセルとサウンドを再現できます。31種類のスタイル、楽曲作曲、サウンドエフェクト、キャラクターの一貫性維持、参照スタイルへの適応、インタラクティブアニメーション、描画レッスンなど、多彩な機能を提供します。このスキルは、コンセプトの確立からスタイル選択、音楽計画、最終承認に至るまで、作品に意味とクラフトマンシップをもたらすワークフローを実装しています。Claude CodeやCursorなどのAIエージェントと連携し、ユーザーのリクエストに基づいて対話的に作品を構築します。エンジンはPlaywright、HTML Player、Remotion、Hyperframesの4つのバックエンドをサポートし、スキャフォールディングツール、レンダリング、ゲートチェック、楽曲検証など、一連のコマンドラインツールを備えています。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/alexgreensh/anidoodle/tree/HEAD/skills/anidoodle

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

anidoodle は何をしますか?

完全にコードで描かれた絵画、映画、インタラクティブ作品。1つの純粋関数がすべてのフレームを描画し、別の関数がすべてのオーディオサンプルを合成・生成します。同じソースから、どのマシンでも、どのサイズでも、どの長さでも、同じピクセルとサウンドが再構築されます。

エンジンは簡単な部分です。作品が意味を持たなかった、主題がそれ自体のアイコンにすぎなかった、スタイルが単なるパレットの置き換えだった、音楽に形式がなかった、あるいは制作者が断片を承認するのに忍耐を費やしたために、作業が捨てられていました。このスキルは、それらの問題を防ぐ技術を提供します。

まず質問してから構築する

references/workflows/start-here.mdを読み、そのインテークを実行してください。一度に1つの質問、リクエストで未確定の部分のみ、あなたの推奨を最初に伝えてください。何を作成するのか、どのスタイルで(ギャラリーシート 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に反応するインタラクティブなWebアニメーション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> が PASS する必要があり、その後で人間が聴きます。
  • サウンドエフェクト:references/music/sound-design.md。14のレイヤー化されたシード付きエフェクトが、映画のフレーム(filmSfx)によってキューされます。スコアはダッキングされ、すべてのキューはスコアから6 dB以内でなければなりません。エフェクトは実際の方向転換のときのみ、各映画につき1つのライザーと1つのインパクトです。
  • ローンチフィルム:launchTemplate.ts は、プロダクトのローンチをデータ(プロンプト、描画されたプレート、書かれたスコア、言葉、インストール行)からレンダリングします。トークンを節約する習慣は references/working-method.md にあります。

7つの法則

  1. すべての作品には意味がある。 静止画:1つのアイデア、1つの焦点となる被写体、1つの光。映画:1つの変容、1つの見返り、1つだけ返ってくるトークン。→ references/storytelling.md
  2. リアリズムを明示せよ。 動物、物体、人物を問わず、解剖学、視点、開いた参考資料を明記せよ。→ references/realism-and-craft.md、references/anatomy.md
  3. スタイルとはマークの付け方である。 パレットを超えて、メディア、エッジ、マークの順序を変更せよ。→ references/styles.md
  4. まず1枚の静止画でルックを証明し、その後エンドツーエンドで構築せよ。 その後は、ゲートは節約する以上にコストがかかる。→ references/working-method.md
  5. 契約は絶対である。 (frame, env)(インタラクティブ作品の場合は入力ログ)内でのみ純粋、rng(seed) のみ、時計は使用不可、ctx.filter は使用不可。生成またはダウンロードされたものはなし。ユーザーが持参した画像は埋め込み、ハッシュで固定してもよい。→ references/determinism-and-contract.md
  6. 音楽には計画を立て、形容詞で指示してはならない。 スタイル、セクションごとのムード、データとしての音符、そして測定。あなたはそれを聴くことができないので、人間1人が出荷前に聴く。→ references/music/
  7. 一人は指示し、一人は構築し、両方がすべてを書き留める。 セッションが劣化したらリセットする。ファイルが記憶である。→ references/working-method.md

ワークフロー

静止画。 (1) アイデアを一文で述べる。焦点となる被写体と光を明示する。 (2) 実在するものすべてについて実際の参考文献を開き、それを記録する。 (3) スタイルを選び、そのプレートのヘッダーを最初に読む。 (4) その媒体の順序で描画する。 (5) still.mjs でフルサイズでレンダリングし、クロップ(顔、手、足、関節; references/craft-bar.md)でディテールパスを実行し、書面で批評する。✋ 1回の承認。 (6) 同じソースから要求されたすべてのサイズと形状を納品し、reproducible と印刷されたことを伝える。

ループ。 静止画と同じだが、さらに:すべての動きがループ上で周期的であり、被写体が停止せず、毎秒何かが動く。シーム(最終フレームとフレーム0)をチェックする。✋ 1回の承認、動画ファイルに対して。

映画。 (1) 3文でストーリーを(設定、変容、見返り)とトークン。長い映画の場合は、スパインと各チャプターの1行。それが書けなければ、中止する。 (2) グリッド:ビートは 60 x fps / bpm フレーム。bpmはブリーフのスコアから取得。1つのキュー表にすべてのフレーム番号を保持し、ロード時にチェッカーが実行される。 (3) 実在するものすべてに実際の参考文献。 (4) 1枚のルック用静止画、最も難しいフレーム、書面で批評。✋ 承認。 (5) 1つの8秒間の音楽サンプル。 ✋ 承認。 (6) 映画全体を構築。機械的チェックが継続的に実行される。 (7) レンダリングされたファイルを一度レビュー:ビートごとのコンタクトシート、カットのペア、無音のフレーム数。1つの優先順位付き修正リスト、1つの再構築。 (8) ✋ 最終承認。 何を検証したか、何ができないかを伝える。

最大3つの承認ゲート。承認は予算である。間違えるとコストが高いところに使え。

クラフト基準

テスト:誇り高き人間のイラストレーターがこれを出荷するだろうか、それとも機械的な形状の組み立てにすぎないか? 兆候の完全な表は 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 はモーションブラーでレンダリングします(1フレームあたり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ハッシュ付きで2回描画されたフレーム(--frames a,b,c --sheet で1ブラウザ内)/ 任意のフォーマットの作品(--from/--to、--poster-frame、--hashes)
gate.mjs決定論、契約、無音部分、アーティファクト; --self-test で失敗できることを証明
registry.mjs / gallery.mjsプレート自体からのスタイルリスト / ギャラリーシート
docs-check.mjsドキュメントのスタイル数、長さ、パスがコードと一致しない場合に失敗
verify-export.mjsレンダリングされたファイルのQA:フレーム、長さ、スコア; オプションで最初のフレーム、ループシーム、--delivery
test.mjs(npm test)engine/test/ のユニットスイート、ブラウザ不要
music.mjsスコアをレンダリングしてメーター表示; check でゲート(キー、マスター、ガード、ステム、新規性)
sfx.mjsサウンドエフェクトキット:list、one、kit <dir>、test

4つのバックエンド、1つのアートコア: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 で1フレームをレンダリングしてください。間違ったトランスフォームでブリットされたレイヤーは、1倍では正しく見えても2倍で壊れます。

関連スキル