aguspranyoto/2d-animation-hyperframes

2Dアニメーション HyperFrames

このスキルを使用して、ユーザーが承認したナレーションスクリプトとタイミングソースからアニメーションビデオを作成します。通常の入力は vo.mp3 と script.txt（感情タグ付きナレーション）で、ビジュアルリファレンスは references/visual-style/overall/ にあります。

トリガーの例：

/2d-animation-hyperframes Create a 2D animated video using vo.mp3 and script.txt. Follow the visual references in references/visual-style/overall/.

ユーザーのスクリプトと音声が唯一の情報源です。ユーザーから明示的に依頼されない限り、新しいスクリプトの作成、ナレーションの書き直し、代替ボイスオーバーの生成にトークンを費やさないでください。感情タグは発話指示であり、話される言葉ではありません。そのまま保持し、読み上げたり、キャプションに含めたりしないでください。要求されたファイルが見つからないか、あいまいな場合は、その場所を尋ねてください。新しく作成したスクリプトで代用しないでください。

デフォルトの対象視聴者はインドネシアの幼児から小学生（TK～SD）です。視覚的なストーリーテリングは明確で温かみがあり、年齢に適したものにしてください。すべてのアニメーションは2Dにしてください。

入力、スクリプト形式、タイミング

リクエストに添付されたファイル、またはアクティブなプロジェクト内のファイルを見つけてください。指定されたパスがある場合はそれを使用します。ファイルがプロジェクトにない場合は、制作を開始する前にどこにあるか尋ねてください。ソースは references/multi-video.md で説明されているワークスペースレイアウトにあります。ナレーションとボイスオーバーは inputs/<slug>/ に、HyperFramesプロジェクトは videos/<slug>/ の下に生成され、共有ビジュアルリファレンスはワークスペースルート（references/visual-style/overall/）にあります。

script.txt 形式：角括弧内に感情タグのみを含む行（例 [excited]、[ curious ]、[playfully]）は、次のタグまでの後続のナレーションブロックの発話方法を設定します。空行は読みやすくするためのブロック区切りであり、ポーズを意味するものではありません。例：

[excited]
Adik-adik, pernah nggak sih kalian melihat jerapah?

[curious]
Wah, lehernya panjang sekali, ya!

タグのルール：

• タグはその後のナレーションブロック全体に適用されます。シーンのビート、キャラクターの表情、ペース、視覚的な強調を決定するために使用します。
• タグを読み上げたり、キャプションに含めたり、画面上に表示したりしないでください。画面上のテキストを生成する前にタグを取り除いてください。
• タグは書かれたとおりに正確に保持します。ボイスオーバーがElevenLabsで生成された場合、同じタグが発話指示であった可能性があります。正規化したり、新しいものを発明したりしないでください。
• 認識されないタグも依然として発話のヒントです。削除せずにそのまま渡してください。

タイミングソース（優先順位順）：

1. ユーザーが同じ音声の単語/セグメントタイムスタンプエクスポート（ElevenLabs JSON）も提供している場合は、それを使用します（オプションであり、必須ではありません）。
2. それ以外の場合は、vo.mp3 から単語レベルのタイミングを導出します。提供された音声を script.txt のテキストに合わせて文字起こし/アライメントします（例：ElevenLabs Scribeの単語タイムスタンプ、またはTTSが音声を生成したときに返されたタイムスタンプペイロード）。
3. vo.mp3 がない場合は、それを要求します。ユーザーが依頼しない限り、代わりのボイスオーバーを合成しないでください。

アニメーション化する前に：

1. すべてのスクリプトブロックが音声のスパンに対応し、タイミングソースが vo.mp3 の全長（初期オフセットやポーズを含む）をカバーしていることを確認します。
2. スクリプトテキストが提供された音声に対応していることを確認します。ナレーションを編集しないでください。テキスト、音声、タイミングが矛盾する場合は、不一致を説明し、修正されたファイルを要求します。
3. 感情タグブロック（およびタイムスタンプエクスポートが提供されている場合はセグメント境界）をストーリービートとシーン変更に使用します。単語タイムスタンプはキャプション、強調、小さな視覚的合図に使用します。すべての単語を個別のシーンにするのではなく、意味のあるフレーズにグループ化します。

2Dビジュアルスタイルの構築

すべてのシーンに対するデフォルトのスタイルキーワード：

2Dフラット、白い背景にフェードしたスケッチ線。主な被写体とテキストのみフルカラー。

シーンをデザインする前に、references/visual-style/overall/ 内の使用可能なすべての画像を一緒に検査します。それらをこのプロジェクトのビジュアルアイデンティティのための唯一の情報源として扱います。以下の内容を含む簡潔なスタイルガイドを抽出します：

• パレット、彩度、コントラスト、照明、グロー
• 形状の言語、線の太さ、テクスチャ、詳細密度
• キャラクターのプロポーション、表情、繰り返し現れるデザイン要素
• 構成と、フラットな2Dアートワークがどのように奥行きを表現するか
• タイポグラフィ、テキストアニメーション、ペース、トランジション、ビジュアルモチーフ

一貫したスタイルガイドをすべてのシーンと新しいアセットに適用します。リファレンスが矛盾する場合は、最も頻繁に使用されるか、最近承認された方向性に従います。矛盾が結果を実質的に変更する場合にのみ、質問します。結果は2Dに保ちます。奥行きにはレイヤー、パララックス、オーバーラップ、スケール、シャドウ、グラデーションを使用します。ユーザーが依頼しない限り、3Dモデルや3Dレンダリングルックにしないでください。

HyperFrames制作ワークフロー

1. アニメーションおよびレンダリングフレームワークとしてHyperFramesを使用します。ユーザーのアクティブなビデオプロジェクトフォルダで作業し、そのアセットとリファレンスを保持します。
2. 承認されたナレーション、感情タグブロック、単語タイミングに基づいてシーンを計画します。ナレーションは変更せず、視覚的なアクションとキャプションを音声タイムラインに合わせます。音楽と効果音は、ポーズや音声を妨げないレベルに配置します。
3. 実際の vo.mp3、script.txt、ビジュアルリファレンスを使用して短い2Dテストシーンを構築します。プレビューし、発話開始、ポーズ、トランジション、終了時のスタイルの一貫性、可読性、同期を確認します。
4. プレビューに基づいて対象を絞った修正を行い、承認されたビジュアル言語を全ビデオに拡張します。テストシーンが確認されるまで、完全なアニメーションを作成しないでください。
5. プロジェクトフォルダからHyperFramesプレビューを実行します（npx hyperframes preview）。ブラウザベースのHyperFrames Studioが開き、ファイルの変更がホットリロードされます。別のデスクトップStudioアプリは、このCLIワークフローではオプションです。
6. 承認されたプロジェクトを現在のHyperFrames CLIワークフローでMP4にレンダリングします。出力パスと制作上の制限事項を報告します。プレビューをレンダリングされた最終ビデオと主張しないでください。

インストール済みのHyperFrames作成手順がある場合はそれを使用します。セットアップや依存関係が不足している場合は、不足している正確な手順を説明します。ユーザーの許可なしにソフトウェアをインストールしたり、グローバル設定を変更したりしないでください。

新しいビデオの開始

手動でスキャフォールディングする代わりに、ワークスペースルートからHyperFramesプロジェクトを生成します。ビデオごとに1つのプロジェクトです。

python tools/new-video.py <slug>                    # スキャフォールディング + 文字起こし + ブロックマッピング
python tools/new-video.py <slug> --force            # 既存の videos/<slug> を再構築
python tools/new-video.py <slug> --no-transcribe    # スキャフォールディングのみ

これは inputs/<slug>/（vo.mp3 + script.txt）を読み取り、videos/<slug>/ に書き込み、タグ付きブロックごとに絶対時間とローカル開始時間/継続時間を1行ずつ出力します。完全なレイアウト、出力、および生成後の手順は references/multi-video.md にあります。

効果音

効果音はナレーションの下に配置し、決して上に重ねないでください。各視覚的なヒット（要素の出現、カット、オチ、開示）ごとに1つのアクセントを配置します。すべてのキャプションに配置する必要はありません。キュー間には無音を残します。

• デフォルトのルート：media-use スキル（Openverse、またはそのスキルの audio/assets/sfx/ にあるバンドルされた21ファイルライブラリ）を介してCC0/CC BYの効果音を取得します。ストック効果音が一致する場合は、決して生成しないでください。
• カスタムルート：Python（numpy + 標準ライブラリ wave、44.1 kHzモノラル16ビット、ピークノーマライズ0.7、シード付きノイズ）で一貫性のあるファミリーを合成します。ポップ、ボイン、ウィッシュ、チャイム、スタンプ、スパークルのレシピは references/sfx.md にあります。
• 各キューをルートコンポジション上のタイム付き <audio> として配線します。一意の id、絶対秒単位の data-start、ファイル長と同じ data-duration、0.22～0.38の data-volume、そして他の可聴クリップと重ならない data-track-index を持たせます。
• レンダリング前に、npm run check が0エラー、かつ clip_ends_past_root_duration や duplicate_audio_track の警告がないことを報告する必要があります。

範囲

このスキルは提供されたメディアからアニメーションを作成します。通常、ナレーションを作成または修正することはありません。ユーザーがストーリーボードやビジュアルプランのみを要求した場合は、同じ音声と script.txt に基づいて、スクリプトを作成せずにそれを提供します。ユーザーが明示的にスクリプト作成を依頼した場合は、その別のリクエストを処理し、新しいボイスオーバーを生成したり既存の音声を置き換えたりする前に承認を得ます。