Communitygithub.com

code-film: コードから生成するモーションフィルム

すべてのフレームがタイムスタンプの純粋関数としてレンダリングされるモーションフィルム。フレームチェック、決定論的検証、エンコードを自動化します。

code-film: コードから生成するモーションフィルム とは?

code-film スキルは、ソースコードから完全に決定論的なモーションフィルムを生成するための高度なツールです。各フレームはタイムスタンプ `t` の純粋関数としてレンダリングされるため、同じコードから常に同じ映像が得られます。このスキルは、製品ローンチクリップ、ショーリール、キネティックタイポグラフィ、アニメーションチャート、ループするブランドアニメーションなど、ユーザー自身の素材から短編フィルムを作成する際に使用します。対応プラットフォームは Claude Code などの AI エージェント環境を想定しており、`window.__seek(t)` というコントラクトに従った Web ページをビルドし、`ui:render --profile film` でフレームキャプチャ、決定論的検証、フラッシュ閾値チェック、フォーマット確認、そして ffmpeg によるエンコードを自動実行します。このスキールの核心は、映像の「証拠」を残すことです。接触シート (contact sheet) で視覚的品質を確認し、SHA-256 ダイジェストでファイルの完全性を保証します。生成 AI ビデオプロバイダ(Veo, Kling, Sora)とは異なり、すべてのフレームがコードで制御されるため、高い再現性とチェック可能性を実現します。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/event4u-app/agent-config/tree/HEAD/src/skills/code-film

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

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

ドキュメント

code-film

すべてのフレームがタイムスタンプの純粋関数であるモーションフィルム:ページは window.__seek(t) を公開し、ui:render --profile film が各フレームにシークし、キャプチャし、シーケンスが決定論的であることを証明し、フォトセンシティビティ閾値と宣言されたフォーマットに対してチェックし、ffmpeg でエンコードします。 有料のビデオプロバイダもライブ再生も不要です。フィルムモーションの値は references/film-motion.md にあり、ページコントラクトは film-page にあります。

使用するタイミング

  • ユーザーが自身の素材から短編モーションフィルム(製品ローンチクリップ、ショーリール、キネティックタイポグラフィ、アニメーションチャート、プロセス説明、ループするブランドアニメーション)を依頼した場合。
  • フィルムが毎回同じようにレンダリングされる必要がある場合、ビートまたは宣言されたテンポに合わせる必要がある場合、または指定されたサイズの MP4 として納品する必要がある場合。

使用してはいけないタイミング

  • 生成ビデオプロバイダ(Veo, Kling, Sora)のプロンプト → motion-choreographer を使用。
  • UI 内のアニメーション(ホバー、スクロールリビール、ページ遷移) → fe-design の「モーション」節を参照。
  • 既存の映像のカットや字幕追加 → /video クラスタを使用。
  • 単一の静的またはループする SVG アセット → svg-authoring を使用。

手順

  1. 入力. レシピに変数としてリストされているもののみを尋ねる:目的、フォーマットとピクセルサイズ、パレット(16進数)、1つのタイプフェイス、オーディオ(なし、提供されたファイル、または宣言されたテンポ)、エンドカード。「とにかく作って」と言われた場合は、使用したデフォルト値を明記する。

  2. 方向性. コーパスから1つのレシピを選び、すべてのショットが仕える1つのコンセプトを明記する:

    node <skills-root>/corpus-grounding/scripts/ground.mjs search \
      --manifest <skills-root>/code-film/data/manifest.json "<簡単な指示>"
    
  3. 禁止事項. 簡単な指示に対するテル(--domain tell)を取得し、各禁止事項とその代替案を計画に書き込む。

  4. グリッド. 提供されたトラックからテンポと小節数を取得(allin1.sh がインストールされている場合;それ以外の場合は宣言されたテンポを使用し、宣言されたものであることを報告)。その後、時間付きの順序付きショットリストを作成する。すべてのテキストはその読み上げ時間(秒速3ワード)保持する。

  5. 解説のみ — 主張. 画面上のすべての図、名前、日付とその出典をリストアップする。またはユーザーのものであると明記する。一切発明しない。

  6. ビルド. シークコントラクトに従ったページを作成する:window.__seek(t)、window.__videoMeta、壁時計なし、シード付き乱数、ローカルフォント。レンダラーは --domain renderer から選択する。プレーンな HTML がデフォルトであり、ライセンスが必要なレンダラーは、ライセンス質問に回答した後にのみ提案する。

  7. 接触シート. 一度レンダリングし、contact.png を読み込み、乱雑さ、重なり、ビートずれを修正する。最大3パス。

  8. レンダリング.

    agent-config ui:render film/index.html --profile film --out film/out.mp4 [--audio track.wav]
    

    終了コード 0 は正常、2 は所見あり(決定論、フラッシュ、デッドタイム、フォーマット、ネットワーク)、1 は未評価、3 はブラウザドライバなし。

  9. レポート. マニフェストを引用する:シーク形式、各チェックの結果(ran または skipped: <理由>)、所見、verification。マニフェストがそれを示し、そのファイルダイジェストが納品するファイルと一致する場合にのみ verified と記載する。

ステータス — 各単語の意味

  • verified — すべての該当チェックがこのマシンで実行され、エンコードされたファイルのダイジェストが記録されたものと一致する。フィルムが良いかどうかについては何も語らない。
  • static-only — フレームはキャプチャされハッシュ化されたが、ffmpeg を必要とするチェック(フラッシュ閾値、エンコード、フォーマット)は実行されなかった。不足しているツールを名前で指定する。
  • unassessed — 何も確認されなかった:ブラウザドライバなし、シークフォームなし、または宣言された長さなし。インストール方法または不足している宣言を名前で指定する。

出力形式

  1. フィルムのパスとマニフェストからの SHA-256。
  2. チェックテーブル(ran / skipped: …)とすべての所見。
  3. 接触シートのパス。
  4. 解説の場合、出典付きの主張リスト。

注意点

  • Math.random または Date.now を使用するページは逆方向パスで異なるレンダリング結果になる;マニフェストは最初に不一致が発生したフレームを名前で指定する。t からシードする。
  • フラッシュ閾値は安全閾値である:ストロボは失敗し、どのフラグもそれを下げない。
  • フィルムプロファイルはネットワークをオフにしてページのスクリプトを実行する。CDN からフェッチされたフォントや画像は読み込まれない — ページの隣に配置する。
  • 決定論はマシンごとに証明される;フォントと GPU はマシン間で異なる。
  • タイムラインフレームワーク上に構築されたページは window.__timelines(一時停止、シーク可能なエントリ)を通じて認識される;埋め込まれた映像は t − data-start で保持される。映像はオールイントラ(-g 1)でエンコードする。そうしないとシークがキーフレーム間に入ってしまう。

禁止事項

  • 外部ギャラリーからプロンプトテキストを計画やレシピにペーストしない — コーパスから新たに書くこと。
  • レンダラーを尋ねずにバンドルまたはインストールしない — 検出してルーティングすること。
  • コードだけを見てフィルムが完成したと判断しない — フレームが決定する。
  • フィルムが良い、ブランドに合っている、「AI らしくない」と主張しない — 測定されたものを報告すること。

関連項目

Individual skills in this repo

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

関連スキル