【6/3 10:59まで】マウスコンピューターが最大7万円OFFセール実施中!

Premiere Pro/After EffectsでWebMを直接書き出す方法!「WebM for Adobe」の使い方

Premiere Pro/After EffectsでWebMを直接書き出す方法!「WebM for Adobe」の使い方

Adobe Premiere (旧Premiere Pro)やAfter EffectsでWebMを書き出したいのに、標準機能では対応しておらず困っていませんか?

Webサイト掲載用の動画では、できるだけファイルサイズを小さくしたい場面が多くあります。そういう場合、MP4よりWebMの方が扱いやすいケースも少なくありません。

しかしAdobe製品は標準状態だとWebMを書き出せないため、

  • 一度MP4を書き出す
  • 別ソフトでWebMへ変換する
  • 修正のたびに再変換する

…という面倒な作業が発生しがちです。

そこで便利なのが、無料プラグイン「WebM for Adobe」。

これを導入するだけで、Premiere ProやAdobe Media Encoderから直接WebMを書き出せるようになります。

この記事では、インストール方法から実際の書き出し手順、After Effectsで使う際の注意点までまとめて解説します。

この記事でわかること
  • Premiere ProでWebMを書き出す方法
  • After EffectsでWebMを書き出す方法
  • 無料プラグイン「WebM for Adobe」の導入方法
  • MP4よりどれくらい軽量化できるのか
  • 書き出せない時の対処法
目次

Adobe製品でWebMを書き出すには無料プラグインが必要

Adobe Premiere ProやAfter EffectsからWebMを書き出すなら、「WebM for Adobe」という無料プラグインの導入がおすすめ。

このプラグインを追加すると、

  • Premiere Pro
  • Adobe Media Encoder

からWebM形式で書き出せるようになります。

なお、After Effectsからは直接WebMを書き出せないため、Media Encoder経由で出力します。

プラグイン自体は無料で利用でき、Adobe Exchangeから簡単に導入可能です。

WebM for Adobeとは?

「WebM for Adobe」は、Adobe製品にWebM書き出し機能を追加できる無料プラグインです。

このプラグインを追加すると、以下のソフトから直接WebM形式で書き出せるようになります。

  • Adobe Premiere Pro
  • Adobe Media Encoder

なお、After Effectsからは直接WebMを書き出せないため、Media Encoder経由で出力します。

入手先

Adobe Exchangeから入手できます。

https://exchange.adobe.com/apps/cc/11631/webm

WebMが使われる理由

WebMは、主に「VP8」「VP9」といった圧縮効率の高い動画コーデックが使われており、MP4よりファイルサイズを小さくできるため、以下のメリットがあります。

  • Webページ表示速度改善
  • 背景動画の軽量化
  • 通信量削減

GIFアニメーションの代替としても使えるため、近年Web制作分野ではかなり活用されています。

インストール手順

以下のAdobe ExchangeのURLにアクセスします。

https://exchange.adobe.com/apps/cc/11631/webm

右上の「無料ボタンをクリックします」

以下の表示がでたら「Creative Cloud Desktop App を開く」ボタンをクリックします。

「WebM」プラグインをインストールという画面が表示されるので「OK」ボタンをクリックします。

「プラグインをインストール中」と表示されるので完了まで待ちましょう。

「インストール済み」と表示されたらインストールは完了です。

Premiere ProでWebMを書き出す方法

Adobe Premiere上部にある書き出しタブをクリックします。

形式のプルダウンメニューをクリックして「WebM」を選択します。

■形式の選択

形式のプルダウンメニュをクリックしてメニューから「WebM」を選択します。

■VIDEO TAB設定

VIDEO TABを展開して、Image Settingsセクションの「フレームサイズを」最適なサイズに変更します。

WebMはWeb掲載向け動画として使われることが多いため、必要以上に高解像度へしないのがポイントです。

GIF代替動画、小さめの埋め込み動画、ループ動画などでは、640×360程度まで解像度を落とすだけでも、ファイルサイズをかなり軽量化できます。

もちろん用途によっては1280×720や1920×1080が必要なケースもありますが、Webページ内で小さく表示する動画なら、解像度を下げたて出力するのがおすすめです。

最低限必要な設定はここまで。

その他はデフォルトのままでよいですが、必要に応じて以下の設定を行います。

  • Codec(コーデック)の選択:通常はVP9のままでOK
  • Quality(品質)の調節:下げるとファイルサイズ減、上げるとファイルサイズ増

品質は下げすぎると画質が劣化するため、下げすぎに注意してください。

■AUDIO TAB設定

Web掲載用動画では、音声を使わないケースも多くあります。

その場合は、「Audio」タブをOFFにすることで、ファイルサイズをさらに軽量化できます。

■ファイル名と保存先の設定

ファイル名と保存場所を設定します。

■書き込み

右下の「書き出し」ボタンをクリックして動画を書き出しを開始します。

Media Encoder経由で書き出すことも可能です。

書き出しが完了するまで待ちましょう。

ちなみに、予測ファイルサイズについてですが、静止画に近い動画や、単色背景・シンプルなアニメーションのような映像は圧縮しやすく、予測サイズも比較的近くなりやすいです。

一方で、グローやノイズ、粒子系エフェクトなど、細かい情報量が多い映像ではファイルサイズが大きくなりやすく、予測サイズと実際の出力サイズが大きくズレる場合があります。

そのため、予測サイズはあくまで目安程度に考えておくのがおすすめです。

After EffectsでWebMを書き出す方法(Media Encoderを使用)

書き出したいコンポジションが選択されている状態でメインメニューの「コンポジション」⇒「Adobe Media Encoderキューに追加」をクリックします。

キューの中にレンダリング情報が作られるので、H.264の部分をクリックします。

書き出し設定画面が表示されます。

■形式の選択

右側書き出し設定の中の「形式」プルダウンメニューをクリックしてメニューから「WebM」を選択します。

■フレームサイズの設定

ビデオタブ内にある「Image Settings」セクションでフレームサイズを設定します。

基本はこれだけでいいですが、必要に応じて以下の設定を調節します。

  • Codec(コーデック)の選択(通常はVP9のままでOK)
  • Quality(下げるとファイルサイズ減、上げるとファイルサイズ増)

■不必要なチェックを外す

オーディオが必要ない場合は、オーディオを書き出しのチェックははずしておきましょう。

キャプションの書き出しは、After Effectsの場合関係ないのでどっちでもいいです。

出力名のファイル名をクリックして、保存するファイル名と保存場所を設定します。

設定が終わったら、画面右下の「OK」ボタンをクリックします。

■書き出し

画面右上にある「再生ボタン」をクリックして書き出しを開始します。

ステータスが完了と表示されれば書き出しは完了です。

WebMを使うとどれくらい軽くなる?

実際に、WebMにしたらMP4よりどれだけ軽くなるのか試してみました。

形式サイズ
MP4(H.264)622KB
WebM(VP9)137KB

約1/5程度までファイルサイズを削減できました。

ここまで軽くなると、Webサイトへの掲載時に読み込み速度へ与える影響も小さくなり、ページ表示のストレスを抑えやすくなります。

特に、背景動画やループアニメーションのように常時再生される素材では、通信量の削減にもつながるため、Web全体の表示パフォーマンス改善に直結します。

どれくらい軽くなるかは動画の内容によって変わりますが、Webサイトの表示速度や通信量を少しでも改善したい場合は、WebMを活用するメリットは十分にあります。

まとめ:WebM書き出しはプラグイン導入で一気に効率化できる

Premiere ProやAfter Effectsでは標準機能だけではWebMを書き出せないため、通常は変換作業が必要になります。

「WebM for Adobe」を導入すれば、Adobe PremiereやMedia Encoder内から直接WebMを書き出せるようになり、作業をシンプルにできます。

Webサイト用の動画やGIF代替素材では、軽量化のメリットが非常に大きいので、WebM動画を作りたい方はこのプラグインを活用してみてください。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

どの動画編集ソフトが今お得?
今月のセール情報をまとめてチェック!

▼▼▼動画編集ソフトはセールで買うのがお得▼▼▼

この記事を書いた人

Youtubeで動画編集のやり方を教えている「あつし」です。
当サイトでは、動画編集ソフトの使い方や、お役立ち情報、3DCG、VFX等動画編集や映像制作全般についての情報を発信していきます。
また、姉妹サイトの「TRY VEGAS PRO」では、動画編集ソフト「VEGAS Pro」に特化した情報や使い方を配信しています。
姉妹サイトともどもよろしくお願いします。

コメント

コメントする

目次