pisakhov/x-motion

X Motion

特定のメッセージを伝えるモーションを作りましょう。テイストは文脈に依存します。静かな技術デモと活気あふれる音楽IDでは異なる判断が必要です。優れたレンダリングエンジンがあっても、デザインの質は保証されません。作品の質は、アートディレクション、実行、観察、そして改訂を通じて獲得されます。

これは、LangChainの記事で議論されたデザインエージェントに触発された、オリジナルで移植可能なモーションデザインメソッドです。LangChainのコードやサービスに依存せず、提携関係を意味するものでもありません。

ワーキング契約

• ホストプロジェクトの指示とユーザーの実際のスコープに従ってください。このスキルは、公開、支出、モデルの呼び出し、資格情報の取得、またはライセンス未取得アセットの使用を許可するものではありません。
• ある瞬間において、1つのビジュアルテーゼと1つの支配的な焦点を使用します。複雑さはテーゼを補完するものであるべきで、偶然に競合してはなりません。
• タイポグラフィ、スペーシング、画像処理、モーション、サウンドを一つのシステムとしてデザインします。弱いアイデアに見かけ上の洗練を加えるための装飾をしてはいけません。
• 仕事と利用可能な環境に適したツールを選択します。特定のモデル、フレームワーク、レンダリングエンジンは必要ありません。
• 技術的な証拠と美的判断を分離します。テイストスコア、視聴者の反応、承認を捏造してはいけません。静止画のみを検査したにもかかわらず、動画を視聴したと主張してはいけません。
• アセットはローカルに保ち、その出典を明示します。依存関係を固定します。プロジェクトが意図的に要求しない限り、生成されたレンダリングをバージョン管理の対象外とします。

最小限の有用なプロセスを選択する

小さな編集: コピーの修正、タイミング調整、アセットの交換、または単独のイージング修正などは、新しいブリーフ、ストーリーボード、アニマティックを省略できます。承認された方向性を維持し、影響を受けるビートとその隣接部を検査し、再レンダリングし、関連するチェックを実行します。変更がメッセージ、階層、またはナラティブを変更する場合は、完全なプロセスにエスカレーションします。

新しい構成または大幅な再デザイン: 以下のステージに従います。アーティファクトはアサインに合わせてスケールします。6秒のタイトルにプロダクションバイブルは必要ありません。重要な意図が欠けている場合は、焦点を絞った質問をします。質問ができない場合は、保守的な仮定をラベル付けし、取り返しのつかない作業は避けます。

1. ブリーフ → ビジュアルテーゼ

オーディエンス、意図するテイクアウェイ、視聴コンテキスト、尺、アスペクト比、デリバラブル、必要なコピー/アセット、ブランド制約、アクセシビリティ要件、そしてサウンドが意味を伝えられるかを確立します。ハード要件と嗜好を分けてマークします。

以下の形式でテーゼを書きます:

[オーディエンス] に対して、[アイデア] を [特定の質感] で感じさせるために、[視覚的メカニズム] を用いて、彼らが [結果] を理解したり行動したりするようにする。

組織化メタファー、支配的な主題、タイポグラフィの役割、モーションロジックに名前を付けます。「プレミアム、シネマティック、クリーン」のようなリストは方向性ではありません。どの選択がそれらの言葉を具体的にするかを説明します。別の作品のアイデンティティを再現するのではなく、原理を特定するためにリファレンスを使用します。

ブリーフの解決、リファレンス分析、首尾一貫したビジュアル言語については、アートディレクションを読んでください。

2. ストーリーボード → 読みやすい議論

フレームを磨く前に、ビートを計画します。各ビートについて、以下を記録します:

時間範囲	視聴者が学ぶこと	焦点 / キーフレーム	トランジションとその理由	オーディオキュー
開始-終了	1つのメッセージ	主題と階層	何が変わるか、そしてその理由	イベントまたは意図的な無音

実際のコピーと現実的なアセット比率で代表的なフレームを描画またはレンダリングします。読み取りと認識に十分な時間を与え、習慣ですべてのビートを均等に分配しないでください。冒頭の約束、ビート間の因果関係、最終的なテイクアウェイを確認します。高価な制作の前に、必要に応じて人間と重要なコピーや方向性を検証します。

構成やテキストのタイミングを確定する前に、タイポグラフィを読んでください。

3. アニマティック → 時間を安価にテストする

大まかなタイミングのフレーム、ブロック、または低詳細のモーションを構築します。合法的で明確にラベル付けされている場合にのみ、スクラッチサウンドを使用します。スクラビングするだけでなく、意図した速度で全実行時間をテストします。

注意が情報のある場所に集まっているか、テキストが読めるか、エンディングに着地する余地があるかを確認します。ここで構造を修正します。方向性に関する不確実性を磨き上げるのではなく、表面化させます。

時間デザインと決定論的なシーン構築については、アニメーションとカメラを読んでください。サウンドが作品の一部である場合は、オーディオを読んでください。

4. プロダクション → 意図的な実行

承認されたビートを、最終的なタイポグラフィ、アセット、ライティングまたはグラフィック処理、モーションカーブ、トランジション、サウンドで洗練します。テーゼを維持します。追加する各エフェクトには役割が必要です: 明らかにする、接続する、強調する、方向付ける、解決する。これらのいずれも行わない場合は、削除するか、その表現的役割を正当化します。

オプションのHTMLレンダラー契約

X Motion HTMLレンダラーを使用する場合、各コンポジションは以下を公開します:

window.motion = { width: 1920, height: 1080, duration: 8, fps: 30, poster: 5.5 };
window.renderFrame = function (tSeconds) {
  // このタイムスタンプと固定シーンデータからすべてのアニメーションプロパティを設定します。
  // 順不同の呼び出しを含む、繰り返しの呼び出しは同じフレームを生成します。
};
window.renderAudio = async function ({ sampleRate }) {
  // オプション。OfflineAudioContextでスコアを構築し、そのAudioBufferを返します。
};

これらの数値は例示であり、デザインのデフォルトではありません。幅と高さはピクセル、duration、poster、tSeconds は秒、fps はフレームレートです。poster はオプションで、サムネイルとして使用されるフレームを指定します。ブリーフに合わせて調整してください。

• 提供されたタイムスタンプから直接状態を計算します。ウォールクロック時間、自律的なCSSアニメーション、累積的なシミュレーションステップ、ネットワークアセット、シードされていない乱数は使用しません。
• キャプチャ前にローカルアセットとフォントをロードしてデコードします。renderFrame が返った後に非同期フレーム変更を導入しないでください。ホストレンダラーの準備完了メカニズムを確認してください。
• ビート境界とアクティブインターバルを超えた動作を定義します。繰り返しタイムスタンプと後方シークをテストします。
• フレーム関数はビジュアルを定義し、オーディオ再生は定義しません。サウンドは renderAudio からのみ来ます: 1つまたは2つのチャンネル、オフラインレンダリング、毎回同一の呼び出し。HTMLメディア再生はキャプチャされません。

まず、このスキルディレクトリの実際の場所を解決します。インストールシンボリックリンクに従って、完全なX Motionクローンにアクセスします。リポジトリルートは、解決された skills/x-motion ディレクトリから見て ../.. であり、ユーザーの現在の作業ディレクトリからの相対パスではありません。これらのコマンドを実行する前にそのリポジトリルートに移動してください。以下のコンポジションパスは、そのルートからの相対パスです。

ストーリーボードPNGと manifest.json をエクスポートします（デフォルトではビデオなし）。--times 0.5,2,4.25 を追加してスチルを選択し、--audio を追加してラウドネス数値付きの sound.wav もエクスポートします:

node scripts/render.mjs path/to/scene.html --out renders/name-storyboard --audio

ストーリーボードPNG、全フレーム、poster.webp、film.mp4（renderAudio が存在する場合はスコアがAACとしてミックスされます）、manifest.json をエクスポートします:

node scripts/render.mjs path/to/scene.html --out renders/name-video --video

各リビジョンには新しい出力ディレクトリを使用します。成功を報告する前に、manifest.json と実際の出力を検査します。これはフレーム決定性チェック、オーディオ決定性チェック、統合ラウドネス、トゥルーピーク、クリップサンプルを記録します。ビデオエンコーディングにはffmpegが必要です。他のホストでは、決定論的なタイムスタンプセマンティクスを維持し、エクスポートコマンドを適応させてください。

5. 批評 → 改訂 → 納品

フィードバックが公開されたビデオIDを指定する場合、ギャラリーフィードバックを読んでください。正確なフィルムを解決し、そのアイデンティティとフィードバックを保持し、新しいリンクされたIDの下でリビジョンを公開します。すべてのクリップ固有の指示を普遍的なルールとしてではなく、スコープ化された教訓を引き継ぎます。

ソースだけでなく、レンダリングされたアーティファクトを検査します。構成についてはストーリーボードを閲覧し、リズムについてはビデオを再生します。オーディオが存在する場合はエクスポートされたオーディオを聴きます。再生または聴取が利用できない場合は、何が未レビューであるかを正確に述べます。

批評と納品を使用して、測定可能な失敗と主観的な懸念を分離します。最も影響の大きい問題から優先的に対処します。批評/改訂ループは、方向性ごとに3回のイテレーションに制限します。方向性が未解決のままの場合は、停止し、競合する懸念を説明し、人間に選択または明確化を依頼してから続行します。技術的な合格は美的承認ではありません。

アーティファクトの場所、ソースの場所、エクスポート仕様、検証証拠、既知の制限事項、未解決の承認質問を納品します。実際に観察したことを報告します。許可なく外部に公開しないでください。

リファレンスマップ

現在のステージに必要なリファレンスのみをロードします:

• アートディレクション: 意図、テイスト、リファレンス、ビジュアルテーゼ。
• アニメーションとカメラ: タイミング、ステージング、トランジション、決定論的レンダリング。
• タイポグラフィ: 階層、読みやすいキネティックタイプ、フォント処理。
• オーディオ: キュー、同期、無音、エクスポートチェック。
• 批評と納品: 証拠、限定された改訂、引き継ぎ。
• ギャラリーフィードバック: 不変ID、チャットフィードバック、keep/improve/discard、スコープ化された学習。