数MBの動画が、何十MBになる

MP4の動画をAPNGに変換してみたら、元は数MBだったのに何十MBにもなってしまった。設定を間違えたのかと焦りますが、これはよくあることです。MP4とAPNGでは、画像の保存のしかたがまるで違うからです。

動画にあまり詳しくない人向けに、なぜ容量が増えるのか、どうすれば軽くできるのかをまとめてみます。

見た目は同じ「動く画像」でも、中身は別物

MP4もAPNGも、画面の上では同じように動いて見えます。でも中の仕組みはかなり違います。

MP4は、動画を効率よく保存するために作られた形式です。一方のAPNGは「Animated PNG」の略で、PNG画像を何枚も続けて表示することで動かしています。大量のPNGをパラパラ漫画のようにめくっている、とイメージするとわかりやすいと思います。

MP4は「前の画面との違い」だけを覚える

動画には、コマが変わっても同じままの部分がたくさんあります。たとえばキャラクターが立ったまま手だけを振っている動画なら、背景も顔も服もほとんど変わらず、動いているのは手だけです。

MP4でよく使われる圧縮方式は、この性質をうまく利用しています。毎回画面をまるごと保存するのではなく、「前の画面と比べてここが変わった」という情報を中心に記録するので、コマ数が多くてもファイルを小さく抑えられます。

APNGは1枚ずつ画像として持っている

APNGはPNGがベースなので、それぞれのコマを画像として保存します。前のコマとの差分を使って容量を減らす仕組みもあるにはありますが、動画専用の圧縮方式ほど小さくはできません。

そのため、MP4では2MBだった動画が、APNGにすると20MB、30MBになるということも普通に起こります。

コマ数が多いほど重くなる

アニメーションは、静止画を高速で切り替えて動いているように見せています。1秒間に何枚の画像を表示するかを「フレームレート」といい、fpsという単位で表します。30fpsなら1秒に30枚、60fpsなら60枚です。

5秒のアニメーションを30fpsで作ると、30×5で150枚。短い素材でも、APNGはそれだけの画像を抱えることになります。当然、コマ数が増えればそのぶんファイルも大きくなります。

画像の大きさも効いてくる

同じ5秒のAPNGでも、640×360ピクセルと1920×1080ピクセルとでは、保存する情報の量がまったく違います。フルHDの1920×1080を30fpsで数秒動かすと、かなりのデータ量になります。

WebサイトやTRPGツールで使う素材なら、画面いっぱいに表示しないものも多いはずです。必要以上に大きく作っても容量が増えるだけなので、「本当にこの大きさが要るか」は一度考えておきたいところです。

中身によっても圧縮しやすさが違う

ファイルサイズは、映っている内容にも左右されます。単色の背景やシンプルな文字、動く部分が少ないアニメーションは、比較的小さくまとまります。

逆に、写真、グラデーション、ノイズ、炎や煙、細かい光の粒、画面全体が動く映像などは圧縮しにくく、容量がふくらみがちです。実写の動画をAPNGにすると、とんでもない大きさになることもあります。こういう映像を小さくするのはMP4の得意分野で、APNGはそもそもそのために作られた形式ではありません。

それでもAPNGを使うのは「透過」のため

ここまで読むと、全部MP4でいいのでは、と思うかもしれません。でもAPNGには、MP4にはない大きな強みがあります。背景を透明にできることです。

PNGは背景を透明にした画像を作れる形式なので、それをベースにしたAPNGも、透明な部分を残したまま動かせます。キャラクターのまわりだけ透明にする、文字だけを動かす、炎や光のエフェクトだけを表示する、TRPGのカットインとして画面に重ねる、といった使い方ができます。ココフォリアの演出素材にAPNGがよく使われるのも、この透過ができるからです。

GIFとの違い

動く画像といえば、GIFもおなじみです。GIFも画像を連続表示して動かす形式ですが、使える色が最大256色までと決まっています。そのため、グラデーションやイラスト、細かな色の変化があるものは画質が落ちやすく、半透明も表現できません。

APNGはPNGがベースなので、GIFよりずっと多くの色を使え、半透明も扱えます。そのかわりファイルは大きくなりがちです。ざっくり言えば、軽さを取るならGIF、画質や透過を取るならAPNG、という関係です。

APNGを軽くするには

容量が大きすぎるときは、まず画像の大きさを見直すのが一番効きます。1920×1080で作っていた素材を1280×720か、それより小さくするだけで、データ量はかなり減ります。

次に効くのがコマ数を減らすことです。30fpsを20fpsや15fpsにしても、内容によってはほとんど気にならないことがあります。ほかにも、アニメーションを短くする、要らないコマを削る、動く範囲を狭くする、細かすぎるノイズやエフェクトを控えめにする、といった方法もあります。

大事なのは、やみくもに画質を落とすことではなく、表示する場所に必要な品質はどのくらいかを考えることです。

MP4とAPNGは使いどころが違う

長い動画や実写、背景用の動画ならMP4のほうが向いています。一方、数秒くらいの短いアニメーション、背景を透明にしたい素材、画面の上に重ねる演出、TRPGのエフェクトやカットインなどにはAPNGが便利です。

APNGは、MP4の代わりになる動画形式というより、「動く透過画像」と考えたほうがしっくりきます。解像度が大きい、fpsが高い、時間が長い、画面全体が動く、写真や細かいエフェクトが多い。このあたりが重なるほど容量は増えるので、用途に合わせてMP4、GIF、APNGを使い分けると、画質と容量のバランスが取りやすくなります。

MP4 → APNG変換ツールのこと

ササドコロでは、MP4の動画をAPNGに変換できる無料ツールを公開しています。ココフォリアで使う動くカットインや演出素材など、手元にMP4はあるけれどAPNGへの変換方法がわからない、というときに使えます。

MP4ファイルを読み込んで、フレームレートや出力サイズを設定して変換するだけなので、ffmpegのような専用ソフトやコマンド操作は要りません。処理はブラウザの中で行うので、読み込んだ動画が外部のサーバーに送られることもありません。

できあがったAPNGが重すぎたときは、この記事で書いたように出力サイズやフレームレートを下げてみてください。まずはAPNGを作ってみたい、ココフォリア用の素材を手軽に変換したい、というときにどうぞ。