remotion-studio について
remotion-studio は、動画の作成・編集時に Remotion Studio を起動し、プレビューを表示し続けるようエージェントに案内するスキルです。Cursor や他のエージェントクライアントで Remotion を使うワークフローを対象とします。
主な機能
- 01Remotion Studio の起動
- 02ブラウザーでの自動プレビュー
- 03アプリ内ブラウザーに対応
- 04ログレベルとポートの設定
- 05新しいインスタンスの強制起動
活用シーン
- 01コンポジション作成前に Studio を確認
- 02動画作業中にプレビューを確認
- 03アプリ内ブラウザーで Studio を開く
- 04別の Studio インスタンスを起動
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/インストール後、Claude Code で/remotion-studioを入力して読み込まれたか確認します。
同梱ファイルagents/openai.yamlassets/remotion-icon.svg
詳細
動画を作成または編集するときは、プロジェクトが実行可能になったら、コンポジションを組み立てる前に Studio を起動し、プレビューを開いてください。作業中は開いたままにして、ユーザーが変更を確認して指示できるようにしてください。
Cursor では、ブラウザーが自動的に開くように --no-open を付けずに Studio を実行します。
npx remotion studio
ほかのエージェントクライアントでも、上記のコマンドを使って Studio にブラウザーを自動的に開かせることができます。アプリ内ブラウザーがあり、それを使用する場合は、次を実行します。
npx remotion studio --no-open
Studio がすでに開いている場合は、URL が出力され、コマンドは終了します。 それ以外の場合は、長時間実行されるプロセスが起動し、URL が出力されます。
--no-open を使用する場合は、出力された正確な URL をアプリ内ブラウザーで開き、Studio が読み込まれることを確認してください。コンポジションができたら、その動画プレビューが読み込まれることを確認してください。アプリ内ブラウザーで URL を開けない場合は、--no-open を使用しないでください。
便利なフラグ
| 引数 | 用途 |
|---|---|
--log=<level> | error、warn、info（デフォルト）、または verbose のログレベルを設定します。 |
--port=<number> | Studio サーバーのポートを指定します。指定しない場合、Remotion が空いているポートを探します。 |
--force-new | 同じプロジェクトとポートですでに Studio インスタンスが実行中でも、別のインスタンスを起動します。 |