Shrimer06/remotion-video-superpowers

Remotion Video Superpowers

このスキルを使用して、Remotionビデオ制作を規格→計画→実行→検証の規律あるワークフローで進めてください。自明でないビデオでは、アニメーションに直接飛びつかないでください。

ワークフロー

1. 実装前にビデオスペックを作成または更新する。

   • references/writing-video-specs.mdを読む。
   • スペックはプロジェクト内のdocs/video/specs/YYYY-MM-DD-project-name.mdに保存する（実用的な場合）。
   • 目標、非目標、視聴者、ビジュアルの方向性、アセット、ナレーション要件、制約、受入基準を記録する。

2. プロダクションプランを作成または更新する。

   • references/writing-video-plans.mdを読む。
   • プランはプロジェクト内のdocs/video/plans/YYYY-MM-DD-project-name.mdに保存する（実用的な場合）。
   • チェックボックスタスクを使用する。各タスクには、ファイル、手順、検証、停止条件を記載する。

3. アニメーション実装前にアセット調達を完了する。

   • references/asset-sourcing.mdを読む。
   • プロダクトアセット、ブランドアセット、UIリファレンス、スクリーンショット、3Dモデル、マップ/地理空間リソース、サービス用トークン/環境変数名、オーディオリファレンス、ライセンス、帰属、ローカルパス、フォールバックを収集して記録する。
   • 必要なアセットがローカルで利用可能になるか、フォールバックが明示的に記録されるまで、シーンアニメーションを開始しない。

4. プランをタスクごとに実行する。

   • Remotionコードを編集する前にreferences/remotion-scene-execution.mdを読む。
   • ビデオにWeb UI、プロダクトインターフェース、ダッシュボード、フロントエンドスタイルのモーション、Three.js、Anime.js、または複雑なアニメーション振り付けが含まれる場合はreferences/frontend-animation-system.mdを読む。
   • ビデオにマップ、ルート、都市、地形、建物、ランドマーク、デジタルツイン、機器、宇宙船、実世界の3Dオブジェクト、またはMapbox/Cesium ionなどのトークンベースのサービスが必要な場合はreferences/3d-map-and-model-resources.mdを読む。
   • useCurrentFrame()とinterpolate()を使用して、シーク安全なアニメーションを実現する。
   • CSSトランジションや非決定論的なランタイムアニメーションは避ける。
   • シーンテキストは短く保ち、説明はナレーションに移す。
   • 最終レンダリング前に、シーンの開始、ピーク、トランジション付近で静止画をレンダリングする。

5. ナレーションを第一級のタイムラインソースとして扱う。

   • ElevenLabs v3スクリプトを作成する前にreferences/elevenlabs-v3-scripting.mdを読む。
   • オーディオのインポート、同期、マルチプレックス前にreferences/audio-sync-and-muxing.mdを読む。
   • このスキルのscripts/inspect-audio.shで実際のオーディオ長を確認する。
   • オーディオをカットするよりも、シーンタイミングを最終ナレーションに合わせて伸ばすことを優先する。

6. 納品前に最終QAを実行する。

   • references/qa-checkpoints.mdを読む。
   • 利用可能な場合は、プロジェクトのlint/typecheckを実行する。
   • このスキルのscripts/render-checkpoints.shまたは明示的なnpx remotion stillコマンドを使用して、チェックポイント静止画をレンダリングする。
   • 最終MP4をレンダリングする。
   • オーディオの信頼性が重要な場合は、このスキルのscripts/mux-voiceover.shを使用してナレーションをマルチプレックスする。
   • ffprobe/ffmpegで再生時間、オーディオストリーム、音量を確認する。

スーパーパワールール

• スペックを真実の源として扱う。実装がスペックと矛盾する場合は、スペックを更新するか、停止して質問する。
• プランを実行可能なものとして扱う。検証をパスするまでタスクを完了とマークしない。
• 最終ビデオ品質に影響する検証不良（lintエラー、読めないテキスト、シーン重複、オーディオ欠落、再生時間不一致、重要なビジュアルが空白など）が発生した場合は停止する。
• 修正の際は、影響を受けるシーンとフレーム範囲を特定し、修正前後の静止画をレンダリングしてから、必要なコードのみをパッチする。
• ユーザー提供のメディアは保持する。意図的にコピーまたは参照すること。ソースダウンロードを上書きしない。
• ユーザーが明示的に画面ツアーを希望しない限り、プロモーションの主要なビジュアル言語としてスクリーンショットを使用しない。プロダクトのアイデアをモーションメタファーに変換し、スクリーンショットは証拠、トランジション、または簡潔なプロダクト証明として使用する。

参照ルーティング

• ビデオを設計する必要がある場合：writing-video-specs.mdを読む。
• 実装を計画する必要がある場合：writing-video-plans.mdを読む。
• プロダクトアセット、モデルアセット、スクリーンショット、トークン、ライセンス、リファレンスを収集する必要がある場合：asset-sourcing.mdを読む。
• Remotionシーンやトランジションをコーディングする必要がある場合：remotion-scene-execution.mdを読む。
• リッチなフロントエンドスタイルのアニメーションをデザインする必要がある場合：frontend-animation-system.mdを読む。
• マップ、3D都市/地形、ルート、外部3Dモデルが必要な場合：3d-map-and-model-resources.mdを読む。
• ナレーションスクリプト、特にElevenLabs v3が必要な場合：elevenlabs-v3-scripting.mdを読む。
• MP3/WAVオーディオの位置合わせや「音が出ない」問題の修正が必要な場合：audio-sync-and-muxing.mdを読む。
• 最終品質を検査する必要がある場合：qa-checkpoints.mdを読む。

プロジェクトディレクトリからバンドルされたスクリプトを実行する場合、同等のプロジェクトローカルスクリプトが存在しない限り、このスキルのscripts/ディレクトリへの絶対パスを使用する。