remotion-render について
remotion-renderは、Remotionのコンポジションを動画や静止画としてレンダリングするスキルです。Remotion付属ブラウザーの利用に加え、指定フレームの出力や透過動画の生成について案内します。
主な機能
- 01コンポジションの動画レンダリング
- 02静止画のレンダリング
- 03指定フレームの画像出力
- 04透過動画のレンダリング案内
活用シーン
- 01完成したRemotionコンポジションのレンダリング
- 02コンポジションから静止画を作成
- 03確認用に指定フレームを出力
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ remotion-dev/ remotion --skill remotion-renderインストール後、Claude Code で/remotion-renderを入力して読み込まれたか確認します。
同梱ファイルtransparent-videos.mdagents/openai.yaml
詳細
一般的なレンダリング戦略
<HtmlInCanvas> を使用するコンポジションも含め、レンダリングには Remotion にバンドルされているブラウザーを使用してください。必要なブラウザー API と Remotion のブラウザー向け修正が含まれています。必要に応じて、Remotion にダウンロードまたは更新させてください。ユーザーが別のブラウザーを明示的に要求しない限り、録画用ブラウザーを再利用したり、--browser-executable、browserExecutable、chromeMode を設定したりしないでください。
動画をレンダリングするには、次のようにします。
npx remotion render
オプションの一覧については、https://www.remotion.dev/docs/cli/render.md をご覧ください。
静止画をレンダリングするには、次のようにします。
npx remotion still
オプションの一覧については、https://www.remotion.dev/docs/cli/still.md をご覧ください。
1 回の呼び出しで複数のフレームを画像としてレンダリングするには、render --frames を使用します。
npx remotion render [composition-id] out/frames --frames=0,30,90 --image-format=png
その他のオプションについては、https://www.remotion.dev/docs/cli/render.md#--frames をご覧ください。
透過動画
透明度を保った動画のレンダリングについては、透過動画をご覧ください。