ffmpegを利用して複数枚の画像からwebpのアニメーションを作る(windows)

かもしか

2025-04-28

複数の画像をパラパラ漫画のようにしてアニメーションを作りたかった。

ということで、「gif アニメ webアプリ」で検索をかけた後に

「あ、そういえば、webpとかwebmとかいうものもアニメーションできるだっけ？そっちを使ってみよう」となったのでやってみる

調べてみて引っかかったこの記事を読んでみた。

保存版: Web画像フォーマットを「正しく」扱う（4）Webのアニメーション（翻訳）

アホなのでよくわからないけど・・・

GIFは昔からあるから色々なところで対応はされているけど、すごーーーく古いから効率が悪かったりめっちゃ画質が悪化すると見たいな話？

手順

もちろんアホなのでAIちゃんにすべてを聞きます。そのうえでちょこちょこ引っかかったのでうまくいった手順をメモっておく

手順1

フォルダに変換したい画像をまとめる

手順2

フォルダをpowershellで開く。

といれてEnterキーを押して

powershellと入れてEnterキーを押す

(cmdじゃなくてpowershellって直接エクスプローラーの上部に入れてもできるって聞いたんだけど・・・なんかできなかった・・・)

手順3

Get-ChildItem -Filter *.JPG | Sort-Object Name | ForEach-Object {
    "file '$($_.Name)'"
} | Set-Content -Encoding ASCII filelist.txt

Get-ChildItem -Filter *.JPG | Sort-Object Name | ForEach-Object {
    "file '$($_.Name)'"
    "duration 0.5"
} | Set-Content -Encoding ASCII filelist.txt

どっちかのコマンドを実行する。すると「filelist.txt」という画像のファイルのパスかな？がまとめられたファイルができる

-Filterで指定されている箇所は適宜変えるといい感じかな？

下の方は「duration」っていうのが指定されていて、多分、画像と画像を切り替えるまでの秒数を指定するっぽい？(ffmpegのframerateっていうオプションを利用した際に、なんか画像がとびとびになってしまって・・・その代替策を聞いたらこれを教えてもらえた)

手順4

ffmpeg -f concat -safe 0 -i filelist.txt -vcodec libwebp -loop 0 -quality 75 output.webp

このコマンドでやっとwebpのアニメーションを作ってくれる・・・長かった・・・

＼やったね／

アニメーション画像の容量に注意かも・・・