Gif圧縮の容量・サイズ指定/ffmpeg・imagemagick

macで録画、mp4の変換、ffmpegでgif生成の方法をまとめておきます。

Gif圧縮の容量・サイズ指定

今はKapという便利なアプリがあるためそちらを使うことが多いです。それでも対応できない状況のみコマンドラインを検討します。

kapはmp4のインポートも可能です。kapはGUIのソフトで簡単な上、サイズ指定やフレームレートの指定が簡単なのです。

Gif圧縮の容量・サイズ指定の検証結果

最適なエンコードを選ぶ以外に容量を削減する方法はフレームレートかサイズかになるでしょう。

サイズ	フレームレート	容量
1920×1080	30	5.7MB
1920×1080	15	4.7MB
1280×720	30	3.5MB
1280×720	15	2.9MB

先にmp4側で圧縮をかけるとかえってサイズが肥大化してしまう場合があるようです(?)。オリジナルのmp4を圧縮する方がよさそうです。

ソフトウェアはkapをチョイスしてサイズとフレームレートを指定するだけでOKです。詳しくはこちらの記事をみてください。

サイズを減らすもう一つの方法はGiFを分割することです。ただ、状況的に可能な場合と不可能な場合があるでしょう。screentogifやkapでmp4を読み込んで2つの動画に分割するだけです。

フレームレートとサイズの最適解は？

ものによって、違うけど、PCで見てもらう資料(ソフトウェアの操作方法などを想定)の場合は画面が大きい方がよさそうです。1280×720がよさそうです。その代わりフレームレートは15ぐらいまで落としてしまいます。

• 1080p（HD）: 1920×1080
• 720p（HD）: 1280×720
• 480p（SD）: 854×480

480pになると少し小さい気もしますが、ブログの横幅がこのぐらいなのでギリ許容してもよいのかも。

フレームレートの違い

フレームレートはこちらの動画参考になります。

FPSの違い
上から、
60
30
15
速さがわかるGIFですぜ pic.twitter.com/3JmOBSlT0g

— りゅーじん (@FursonAxRyuziN) May 2, 2020

リンちゃんの傘くるくる
フレームレートを15で傘が止まって見えたので、25で再作成#マビノギ英雄伝#GIF pic.twitter.com/1uuKf98kNO

— ゆりっへ*✩ (@yurippe_momo) November 22, 2017

リンちゃんの傘くるくるをずっと見ていたい人用GIF
フレームレートを15にしたら、傘が回ってないように見えてちょっと残念#マビノギ英雄伝#GIF pic.twitter.com/PxpR5td0FS

— ゆりっへ*✩ (@yurippe_momo) November 22, 2017

コミカルなアニメならフレームレート10でもよさそうです。

GIFアニメの原画制作工程って案外見た事ないですよね🤔
わたしの場合はこんな感じw目チカチカしちゃいますけどw

制作時間3時間19分

2、3秒作るのにも30枚程度は描かないといけない。
フレームレート10設定。
簡単に作ってる様に見えますけどそれなりに手間は掛かります。
そういう世界です。 pic.twitter.com/vSlAHmoeAV

— 緑豆子@マイペースに推し事中 (@payayuu0507) November 19, 2021

GIFテスト03
約4.0秒
FPS 15[F/s]
大きさ(横縦) 1280×720[pixel]
深度8[bit]（カラーリミット_256）
サイズ12.483[MB] pic.twitter.com/yKtjOViQmT

— mototo=toto (@note0928) December 8, 2023

ffmpegのことを知りたい人はこのまま読み進めてください。

movからmp4に変換する方法比較(拡張子を変更)

movからmp4に変換する方法はたくさんありますね。

拡張子の直変え、iMovie、QuickTime、VLCメディアプレーヤー、HandBrake、iMyMac、DaVinci Resolve(ダヴィンチリゾルブ)、オンラインのコンバーター、fffpegなど様々な選択肢があります。

この中で使いたくないのはオンラインのコンバーターです。アップロードしたりダウンロードしたりがありますし、セキュリティ的な点からも大丈夫かもですがなるべく避けたいところです。

直に拡張子を変更する方法は使っていいのか?

1番簡単な方法ですが、直にfinderにあるファイルの拡張子を名前変更するだけの方法が裏技的に紹介されています。簡単ですが、なぜそんなことをしていいのか理由が気になります!?ぐぐったところ

MP4は、実際には古いMOV形式のサブセットです。

https://www.imymac.jp/video-converter/how-to-convert-mov-to-mp4-on-mac.html

あまり深追いはしていませんが、サブセットということが発覚しました。とりあえず問題がでなければこの方法でもよいかもしれません。実際にテストするときはこの方法を使っています。

コンテナの理解、MovとMp4の違い

しかし、本番のデータに使うのはダメじゃないですかね。日本語情報がないので英語圏で軽く調査ところ

Can I rename MOV to MP4?

In some scenarios, you can make a change by renaming the file. For instance, because of the fact that MP4 is a subset of QuickTime, you can change the MOV file just by renaming and changing the extension from MOV to MP4. Sometimes, changing the file extension manually by changing the text is enough. However, this does not always work. It depends on the settings of the file format. To ensure capability, it is a good idea to use conversion software. This can ensure that the file works properly and that no data is lost in the transfer.

https://www.movavi.com/learning-portal/mov-vs-mp4.html

やっぱりソフトウェアを使った方がよさそうです。😅

Macに動画編集ソフトDaVinci Resolveが入っているため、それで変換しています(iMovieは初心者向けなので却下)。

参考になれば幸いです。ここから別の話です。

【ffmpegの使い方】gif生成

コマンドラインを使わない方法

そのあと、picgif lite(未検証だけどたぶんffmpegじゃない?)、コマンドラインでffmpegで変換となります。

仮想環境のParallels DesktopがあればScreenToGifを使ってもよいです。ただし、ScreenToGifはmovがインポートできません。macのもののため拡張子はmov一択のため、mp4に変換したい場合はコンバーターをかまさないといけません。

MOV MP4 変換 - ビデオファイルをオンラインで変換する

www.aconvert.com

MAC録画 > コンバーター > ScreenToGifの順番ですね。

ScreenToGifの使い方はこちらです。

ScreenToGifのffmpegでmp4出力/mp4 to gif

ebookbrain.net

それはめんどくさいという人はコマンドラインからの操作が楽です。個人的に採用しているのはコマンドラインです。

ffmpegの使い方(ffmpegでgifが汚いを避けるためpngパレットを使う!)

ffmpegをMACにインストール

ターミナルを起動し、インストール。

$ brew install ffmpeg

バージョン確認。

$ ffmpeg -version

ffmpegでgifの作り方

変換。

$ ffmpeg -i input.mp4 output.gif

$ ffmpeg -i test.mov -vf scale=1280:-1 -r 10 test.gif

ffmpegのgifが汚い、改善のコツはパレットの生成

その場合、pngのパレットを先に生成します。1kbのパレットができます。

$ ffmpeg -i input.mov -vf palettegen palette.png

そのパレット情報を元に変換すればOKです。

$ ffmpeg -i input.mov -i palette.png -filter_complex paletteuse output.gif

まとめるとこうなります。filter_complex内にフレームレートとリサイズはいれてあげればOKです。

$ ffmpeg -i input.mov -i palette.png -filter_complex "fps=60,scale=1280:-1,paletteuse" output.gif

imagemagickの使い方

もうひとつffmpegとあわせて使えるimagemagickがあります。imagemagickをあわせて利用した方ができることが多いかもしれませんん。MacでもWindowsでも利用できます。

imagemagickをMACにインストール

ターミナルを起動し、インストール。

$ brew install imagemagick

バージョン確認。

$ convert -version
Version: ImageMagick 7.X

ffmpegとimagemagickでmp4からgifに変換する方法

ファイルがある場所に移動します。

ffmpeg -i sample.mp4 -an -r 8 %04d.png
magick convert *.png output.gif

ffmpegでpngの連番に変換してimagemagickでgifに変換します。フリーツールを使うと、gifが汚いなどのトラブルが起きやすいですが、この方法は綺麗に変換できるでしょう。

前後のフレームを削る

pngにした時点でirfanviewで確認して前後のフレームを削ってもいいかもしれません。

IrfanView - Official Homepage - One of the Most Popular Viewers Worldwide

www.irfanview.net

他の方法としては動画の時点で前後のフレームを削ってもいいかもしれません。ただ、再保存のときにコーディックやクオリティなどの確認が必要になりますよね。

前後のフレームを削っても作業には何ら影響はありません。

ffmpegとImageMagickで縦横比を保持したまま長編でリサイズ

サイズが大きいためリサイズの工程を挟んであげます。

ffmpeg -i sample.mp4 -an -r 8 %04d.png
magick convert *.png -thumbnail 300x resize_%04d.png
magick convert resize_*.png output.gif

エラー：”convert”は内部コマンドまたは外部コマンド、操作可能なプログラムまたはバッチファイルとして認識されていません

バージョン7からコンバートの方法が変わったようです。

convert *.png test.gif

7以降は以下のとおり。

magick convert *.png test.gif

動画編集ソフトのおすすめはDaVinci Resolve

最近、おすすめの動画編集ソフトはDaVinci Resolveです。ダヴィンチってレオナルド・ダ・ヴィンチかた取ったんですかね。

詳しくはこちらの記事をみてください。

【評判】Udemyのプログラミングおすすめ/フロントエンド/バックエンドエンジニア(Javascript他)

ebookbrain.net

ご参考になれば幸いです。