Remotionで動画を作る

Remotionとは

Reactというコードの書き方で、動画のシーンや動きを組み立てる仕組みです。動画編集ソフトを操作するのではなく、動画を作るプログラムを書く感覚に近く、同じ構成のまま数字や文言だけ差し替えれば、同じフォーマットの動画を何本でも作り直せます。コードは自分で書く必要はありません。プログラミングは怖くないで触れている通り、AIコーディングエージェントに日本語で伝えれば、コードはAIが書いてくれます。

前提

AIコーディングエージェント（Claude Code等）が使える環境と、Node.jsが必要です。ターミナル・VSCode拡張機能・アプリ、どの入り方でも構いません。実際にコマンドを打つのはAIなので、自分でターミナルを操作する必要はありません。まだ導入していない場合はVSCodeの導入方法またはCLIをインストールするを参考にしてください。

セットアップ

プロジェクトを作る

1. ターミナルを開き、npx create-video@latest を実行します
2. テンプレートを聞かれます。最初は「Hello World」か「Blank」を選べば十分です
3. 作成が終わったら、できたプロジェクトフォルダに移動し、npm i を実行して必要なパッケージを揃えます

プレビューを起動する

1. プロジェクトフォルダで npm run dev を実行します
2. ブラウザでRemotion Studio（プレビュー画面）が開きます
3. コードを直すと、リアルタイムで映像に反映されます。この段階ではまだコードを触らず、画面が開くことだけ確認してください

使い方

① AIに映像を作らせる

1. プロジェクトフォルダをVSCodeやClaude Codeで開きます
2. 作りたい動画の構成を日本語で伝えます

3. Remotion Studioの画面で確認しながら、気になる箇所は追加で指示を出して直していきます

② 書き出す

以下のどちらかでmp4ファイルに書き出せます。

• ターミナルから：npx remotion render <コンポジションID> <出力ファイル名>
• Remotion Studioの画面から：「Render」ボタン

発展：ナレーション・テロップまで作り込む

台本に合わせた音声（VOICEVOX）やテロップとの合成まで含めた、実際の制作フローは 私の事例 にまとめています。