2026年3月4日 / 最終更新日 : 2026年3月4日 fujifuji コラム[PR]

コードを書かずにAIでプロ級の動画を自動生成する方法【Remotion × React】

Remotion とは、Webエンジニアが使うReactという技術を使って動画を作るツールです。「でも、プログラミングは分からない…」という方でも大丈夫。今はAIがコードを書いてくれる時代です。あなたはAIに指示を出すだけで、動画制作のほぼすべての工程を自動化できます。

この記事では、コーディングの知識ゼロの方向けに、どのAIサービスを使って、どんな指示（プロンプト）を出せばいいのかを具体的に解説します。

テックジム東京本校では、「AI駆動開発コース」にて本記事のスキルを学ぶことができます。

目次

はじめに：「動画を量産したい」を、AIが解決する

「YouTube やSNS用の動画を毎日出したいけど、編集に時間がかかりすぎる」
「商品紹介動画を100本作りたいけど、手作業では無理」
「プログラミングは分からないけど、AIで動画を自動化できると聞いた」

こういった悩みに応えるのが、Remotion × AI という組み合わせです。

Remotion とは、Webエンジニアが使うReactという技術を使って動画を作るツールです。「でも、プログラミングは分からない…」という方でも大丈夫。今はAIがコードを書いてくれる時代です。あなたはAIに指示を出すだけで、動画制作のほぼすべての工程を自動化できます。

この記事では、コーディングの知識ゼロの方向けに、どのAIサービスを使って、どんな指示（プロンプト）を出せばいいのかを具体的に解説します。

そもそも Remotion って何？ 3分で理解する

「プログラムで作る動画」という考え方

普通の動画編集ソフト（Premiere Pro、CapCutなど）は、タイムラインを手で操作して動画を作ります。一方、Remotionは文章（コード）で「この動画はこういう構成にする」と書いておくと、自動で動画を生成してくれるツールです。

イメージとしては…

「3秒後にタイトルがフェードインして、5秒間表示、その後スライドアウト。BGMは〇〇.mp3。背景は黒。」

というレシピ（コード）を書くと、その通りの動画が自動で出来上がる、という感じです。

Remotionの何がすごいのか

普通の動画編集 Remotion
毎回手で編集する 一度作ればボタン1つで何度でも生成
テンプレートの修正が面倒 データを変えるだけで別の動画に
100本作るには100倍の時間 100本でも1本でも作業時間はほぼ同じ
バージョン管理が難しい 変更履歴を管理できる

つまり、「同じ構成で内容だけ変えた動画をたくさん作りたい」ケースで圧倒的な力を発揮するツールです。

全体の流れ：AIを使った動画自動化のパイプライン

コードを書かなくても、以下の流れで動画を自動生成できます。

① テーマや内容を決める（あなたの仕事）
        ↓
② AIで動画の台本（構成）を作る
        ↓
③ AIでRemotionのコードを生成する
        ↓
④ AIで音声ナレーションを作る
        ↓
⑤ AIで字幕データを作る
        ↓
⑥ 動画をレンダリング（書き出し）する

各ステップで使うAIサービスと具体的なプロンプトを、順番に解説していきます。

Step ①：AIで動画の台本（構成）を作る

使うAIサービス：Claude または ChatGPT

まず動画の設計図となる「台本」を作ります。ここはプロンプト（指示文）を書くだけなので、一番とっつきやすいステップです。

おすすめサービス：

使うプロンプト（コピー＆ペーストしてください）

あなたはプロの動画ディレクターです。
以下の条件で、SNS用の縦型ショート動画（60秒）の台本をJSON形式で作成してください。

【動画のテーマ】
（ここに自分のテーマを入力 例：「2025年のAIトレンド3選」）

【条件】
- シーン数：5〜8シーン
- 各シーンの尺：3〜10秒
- 視聴者が最後まで見たくなるような構成にする
- 冒頭3秒でフック（興味を引く言葉）を入れる

【出力形式】
{
  "title": "動画タイトル",
  "total_duration": 60,
  "scenes": [
    {
      "id": 1,
      "duration_seconds": 5,
      "narration": "ナレーションのテキスト",
      "visual_description": "画面に表示する内容の説明",
      "text_overlay": "画面に重ねるテキスト（ある場合）"
    }
  ]
}

ポイント： 【動画のテーマ】 の部分だけ自分の内容に書き換えてください。あとはそのままコピー＆ペーストでOKです。

Step ②：AIでRemotionのコードを生成する

使うAIサービス：Claude（強く推奨）

ここが「コーディング不要」の核心部分です。Step①で作った台本をそのままClaude（またはChatGPT）に渡して、「Remotionのコードに変換して」と頼むだけです。

なぜClaudeがおすすめか？ 長いコードの生成精度が高く、エラーも少ないためです。

使うプロンプト

あなたはRemotionのエキスパートエンジニアです。
以下のJSON台本データをもとに、Remotionで動画を生成するためのReactコンポーネントを作成してください。

【台本データ】
（Step①で生成したJSONをここに貼り付ける）

【要件】
- TypeScriptで記述する
- 各シーンはSequenceコンポーネントで区切る
- テキストはフェードインアニメーションを付ける
- 背景色は黒（#0a0a0a）
- フォントはNoto Sans JP（日本語対応）
- テキストカラーは白
- 画面サイズは縦型（1080×1920）
- narrationテキストは画面下部に字幕として表示する
- text_overlayは画面中央に大きく表示する
- シンプルで見やすいデザインにする

生成するファイル：
1. MyVideo.tsx（メインコンポーネント）
2. Root.tsx（コンポジション登録）
の2ファイルをそれぞれ出力してください。

ポイント： デザインの好みに合わせて「背景色」「フォント」「テキストカラー」などは自由に変更してください。

コードをどこに貼ればいいの？

AIが生成したコードを使うには、Remotionのプロジェクトフォルダの決まった場所に貼り付けるだけです。以下のプロンプトでAIにその手順も聞けます。

Remotionをまだインストールしていない初心者です。
Macで（またはWindowsで）Remotionをインストールして、
上記のコードを配置するまでの手順を、
ターミナルコマンドを含めてステップバイステップで教えてください。
コマンドを実行するたびに「次はこれをしてください」と案内してください。

Step ③：AIで音声ナレーションを作る

使うAIサービス：ElevenLabs または VOICEVOX

台本のナレーションテキストを、自然な音声に変換します。

おすすめサービス：

サービス 特徴 日本語対応 料金
ElevenLabs 音質が非常に高い・声の種類が豊富 ◎ 無料枠あり
VOICEVOX 無料・日本語特化 ◎ 完全無料
にじボイス 日本語AIボイス特化 ◎ 無料枠あり
OpenAI TTS APIで自動化しやすい ○ 従量課金

ElevenLabsの使い方（ブラウザで完結）

ElevenLabsはブラウザだけで使えるので、コーディング不要です。

  1. ElevenLabs にアクセスしてアカウント登録
  2. 「Speech Synthesis」を選択
  3. テキストボックスにナレーション文を貼り付ける
  4. 声（Voice）を選択する
  5. 「Generate」ボタンを押すと音声が生成される
  6. MP3でダウンロードして保存

複数シーンのナレーションをまとめて処理したい場合は、以下のプロンプトをAIに渡してください。

以下のナレーションテキストリストを、ElevenLabs APIを使って
各シーンごとに個別のMP3ファイルとして生成するNode.jsスクリプトを書いてください。
ファイル名は「scene_01.mp3」「scene_02.mp3」のように連番にしてください。

【ナレーションリスト】
（Step①で生成したJSONのnarrationテキストをここに貼る）

ElevenLabs APIキー：YOUR_API_KEY
使用するVoice ID：（使いたい声のIDをここに入れる）

Step ④：AIで字幕データを自動生成する

使うAIサービス：Veed.io または Whisper Web

音声ファイルを自動でテキスト化し、タイムスタンプ付きの字幕データ（SRT形式）を生成します。

ブラウザで使えるツール：

サービス 特徴 料金
Veed.io 日本語字幕対応・使いやすいUI 無料枠あり
Whisper Web 完全無料・ブラウザのみ 無料
Clop 日本製・日本語に強い 無料枠あり

ブラウザツールで字幕を生成したら、SRTファイルとしてダウンロードします。

字幕をRemotionに組み込む際のプロンプト

以下のSRTファイルの内容をRemotionコンポーネントに組み込みたいです。
字幕は画面下部に白いテキスト・黒い背景で表示してください。

【SRTファイルの内容】
（ダウンロードしたSRTファイルの中身をここに貼る）

【既存のコンポーネント】
（Step②で生成したMyVideo.tsxの内容をここに貼る）

上記のSRTデータをパースして、対応するフレームに字幕が表示されるように
MyVideo.tsxを修正したバージョンを出力してください。

Step ⑤：動画をレンダリング（書き出し）する

コマンドもAIに聞けばOK

コードが完成したら、あとはレンダリングするだけです。ターミナルのコマンド操作が不安な方は、そのままAIに聞きましょう。

Remotionで完成したコンポジション「MyVideo」をMP4でレンダリングするコマンドを教えてください。
出力ファイル名は「output.mp4」にしたいです。
エラーが出た場合の対処法も合わせて教えてください。

エラーが出たときのプロンプト

作業中にエラーが出たときも、AIにそのまま貼り付けるだけで解決策を教えてくれます。

Remotionでレンダリング中に以下のエラーが出ました。
初心者なのでわかりやすく解決策を教えてください。

【エラーメッセージ】
（ターミナルに出たエラーをここにコピー＆ペースト）

【現在のファイル構成】
（どんなファイルがあるか教える）

よくある質問：AI × Remotion でつまずきやすいポイント

Q. パソコンが苦手でも本当にできますか？
A. ターミナル（黒い画面）を少し使う必要があります。ただし、操作手順はすべてAIに聞けば教えてくれます。「この次は何をすればいいですか？」と対話しながら進めるのがコツです。

Q. どのAIサービスが一番おすすめですか？
A. コード生成は Claude、音声生成は ElevenLabs、字幕生成は Veed.io の組み合わせが、初心者には一番使いやすいです。

Q. 無料で全部できますか？
A. 各サービスに無料枠があります。月数本程度の動画なら無料枠内に収まることが多いです。大量生成したい場合は有料プランの検討が必要です。

Q. 生成された動画は商用利用できますか？
A. Remotion自体は商用利用に企業ライセンスが必要です。また、使用する音声・フォント・画像素材のライセンスも個別に確認が必要です。

Q. うまくいかないときはどうすればいいですか？
A. 「うまくいかない状況」をそのままClaudeやChatGPTに説明してください。スクリーンショットやエラー文をそのまま貼り付けると、具体的な対処法を教えてもらえます。

実際にどんな動画が作れる？ユースケース例

SNSショート動画の自動化

毎日投稿するTikTokやInstagram Reels用の縦型動画を自動生成。テーマだけ変えてテンプレートから量産できます。

商品紹介・ECサイト動画

商品名・価格・特徴のリストをAIに渡すだけで、商品ごとの紹介動画を一括生成。100商品でも数時間で完成します。

ニュース解説動画

その日のニュースや業界トレンドをAIに要約させ、スライド形式の解説動画として自動配信するパイプラインを構築できます。

教育・研修動画

社内マニュアルやブログ記事をAIが読み込み、ナレーション付きのスライド動画に変換。研修コンテンツを効率よく量産できます。

パーソナライズ動画

顧客の名前や購入履歴を差し込んだ「一人ひとり向け動画」を自動で生成・送付。マーケティング施策に活用できます。

まとめ：今日からできる最初の一歩

Remotion × AI を使えば、コーディングの知識がなくてもAIへの指示（プロンプト）だけで動画制作を自動化できます。

最初の一歩として、まずこれだけやってみてください。

  1. Claudeを開く（無料アカウントでOK）
  2. この記事のStep①のプロンプトに自分のテーマを入れて送信する
  3. 台本が生成されたら、Step②のプロンプトで続けてコードを生成してもらう

「動画が量産できる仕組み」を一度作ってしまえば、あとはテーマを変えるだけ。動画制作の時間を9割削減することも夢ではありません。

まずは気軽に試してみましょう。

使用AIサービス一覧まとめ

用途 サービス名 無料枠 リンク
台本・コード生成 Claude あり https://claude.ai
台本・コード生成 ChatGPT あり https://chat.openai.com
音声ナレーション ElevenLabs あり（月1万文字） https://elevenlabs.io
音声ナレーション VOICEVOX 完全無料 https://voicevox.hiroshiba.jp
字幕生成 Veed.io あり https://www.veed.io
字幕生成 Whisper Web 完全無料 https://huggingface.co/spaces/Xenova/whisper-web
動画フレームワーク Remotion 個人無料 https://www.remotion.dev

    ■らくらくPython塾 – 読むだけでマスター

    共通テスト「情報I」対策解説講座

    共通テスト「情報I」対策解説講座｜2026年度試験に挑戦

    実践で学ぶPython速習講座

    実践で学ぶPython速習講座「初心者を3時間で卒業せよ!!」【テックジム東京本校】

    ■テックジム東京本校「AI駆動開発コース」

    格安のプログラミングスクールといえば「テックジム」。
    講義動画なし、教科書なし。「進捗管理とコーチング」で効率学習。
    対面型でより早くスキル獲得、月額2万円のプログラミングスクールです。

    テックジム東京本校では、「AI駆動開発コース」にて本記事のスキルを学ぶことができます。。

    テックジム東京本校｜「情報」科目受験生歓迎

    プログラミング学習に関するお役立ちコンテンツ

    カテゴリー
    コラム[PR]
    コラム[PR]

    前の記事

    企業法務を安く依頼できるおすすめ法律事務所10選｜費用相場と選び方も解説
    2026年3月2日
    コラム[PR]

    次の記事

    SaaSの死は本当か？AIエージェントが引き起こす ソフトウェアビジネスの大転換New!!
    2026年3月5日