ユーザーの変更を保持する
ユーザーは会話の外部でコードを編集することがあります。
その間に驚くような変更が検出された場合は、上書きせず、意図的なものとみなすか確認を求めてください。
動画の作成
ユーザーが新しい動画やコンポジションを作成・構築するよう依頼した場合は、Remotionプロジェクトが既に存在するかどうかに関わらず、新しいRemotion動画を作成を読み込んでください。
新規プロジェクトのセットアップ
現在Remotionプロジェクトが存在しない場合は、新しいRemotionプロジェクトを作成を読み込んでください。
Reactマークアップのベストプラクティス
RemotionのReactマークアップを記述する場合は、Remotionマークアップのベストプラクティスを読み込んでください。
地図
静的マップ、アニメーションルートとマーカー、地理解説、Mapbox、MapLibre、MapTiler、GeoJSON、または3D地理フライオーバーについては、Remotion Mapsを読み込んでください。
マルチメディア
ブラウザでのマルチメディアタスク(動画のトリミング、クロップ、メタデータ取得など)を実現するには、Remotion Multimediaを読み込んでください。
インタラクティブ性の向上
Remotionのマークアップを適切に構造化することで、ユーザーがスタジオでインタラクティブに変更を加え、コードに書き戻すことができます。該当する場合:インタラクティブ性のベストプラクティス
プレビューを開く
ユーザーが動画を「作成」する、「作る」などと依頼した場合、明示的に要求されない限りデフォルトでレンダリングは行わないでください。代わりにインタラクティブプレビューを表示することを目指します。 プロジェクトが実行可能になったらすぐにStudioを起動し、ブラウザでプレビューを開いてください。作業中は開いたままにし、ユーザーが進捗を確認し方向性を決められるようにします。
Cursorを使用している場合
--no-open なしでStudioを実行し、ブラウザを自動的に開かせてください:
npx remotion studio
アプリ内ブラウザを持つ別のエージェントクライアントを使用している場合
上記のコマンドを使用してStudioにブラウザを開かせるか、以下を実行してください:
npx remotion studio --no-open
これにより長時間実行プロセスが開始され、プレビューのサーバーURLが表示されます。
サーバーが既に起動している場合は、そのURLが表示されます。
--no-open を使用する場合は、表示された正確なURLをアプリ内ブラウザで開き、Studioが読み込まれることを確認してください。コンポジションが存在する場合は、その動画プレビューが読み込まれることも確認してください。アプリ内ブラウザで開けない場合は、--no-open なしでStudioを実行してください。
特定のコンポジションにアクセスするには、/[composition-id] に移動します。例:http://localhost:3000/MapAnimation
:::note StudioはWebMCPツールをサポートしています。 :::
アプリ内ブラウザがない場合
これによりStudioがブラウザで開くか、既に開いている場合はフォーカスが戻ります。
npx remotion studio
その他のオプション
プロジェクトをRemotion Studioで起動する、ローカルの正確なURLを開く、またはStudio CLIフラグを設定するには、Remotion Studioを読み込んでください。
動画をレンダリングする
ユーザーが明示的に「動画をレンダリングして」「エクスポート」「MP4をください」などと要求した場合のみレンダリングを行ってください。
プレビューにも直感的なレンダリングインターフェースがあるため、コマンドラインよりもそちらを使用することを検討してください。
npx remotion render
詳細なオプションについては、Renderingを参照してください。
単純な npx remotion render を超えた高度なレンダリングについては、Rendering Best Practicesを参照してください。
キャプション
キャプションを扱う場合は、Remotion Captionsを読み込んでください。
SaaS、自動化、アプリケーションの作成
Remotion SaaSスキルを使用して、Remotionを利用したSaaSアプリ(<Player>、Lambda上でのレンダリング、Vercel、Cloudflare、Express.js経由、クライアントサイドレンダリング、適切なSaaSテンプレートの検索など)に関する知識を得てください。
Remotion APIとドキュメントの参照
最新のRemotionドキュメントを検索・閲覧するには、Remotion Docsを読み込んでください。
アップグレード
Remotion、関連パッケージ、互換性のあるMediabunnyパッケージ、インストール済みのRemotion Agentスキルをアップグレードするには、Remotion Upgradeを読み込んでください。