🎼

FFmpeg on Dockerによりアプリトレンド共有会でアニメGIFを見せるのが楽になりました!

に公開

ネイティブアプリ開発チームの定例MTGでは、最近のトレンドを共有する時間があります。トレンドというと敷居が高そうですが、各自が何か目についたものをゆるく共有する時間になっていて、自分ひとりでは気づかないものが寄せられるので、いつも楽しみにしています。

先日、とあるアプリを操作していて、そのアニメーション動作を共有したいなと思ったので動画を撮りました。iPhoneで撮った動画ファイルは、そのままGoogleドキュメントに貼ろうとしてもドキュメント上では見られません。なので、手間ですがGIF形式に変換してから貼ってやる必要があります(WebP形式もダメみたいですね)。

私はアニメGIFへの変換に動画変換ツールのFFmpegをDockerから使っています。このやり方がすごい気に入っているので、今日はその紹介をします。

https://www.ffmpeg.org/

なぜDocker?

開発者が常用しているmacOSでもFFmpegは使えるのでそのまま使えばいいじゃんという感じですが、FFmpegさんって結構依存関係が多いですよね。FFmpegの利用頻度が多ければ気にならないかもですが、滅多に使わないのでそのために依存が多いものを入れるのがなんとなく嫌という結構個人的な気持ちが大きいです。

業務ではDockerを使っているので、Dockerから使えればこうした点を気にせずすみますから、個人の環境も含めてこのやり方が気に入っているのです。

基本の動画変換

カレントディレクトリにinput.movという動画を置いて以下のコマンドでoutput.gifというファイルが出力できます。フレーム数を調整したければfpsを、サイズを調整したければscaleの値を変えます。

docker run --rm -v "$(pwd):/workspace" linuxserver/ffmpeg \
    -i /workspace/input.mov \
    -filter_complex "[0:v]fps=30,scale=320:-1:flags=lanczos,palettegen[p]; \
                     [0:v]fps=30,scale=320:-1:flags=lanczos[v]; \
                     [v][p]paletteuse" \
    -loop 0 \
    -y /workspace/output.gif

こんな感じの動画ができるわけですね。

スロー再生

UIのアニメーションを見せたいとなると、スロー再生したくなります。というか、先日まさにこれがやりたくなりました。setptsフィルタで再生速度を変えられます。0.5倍速にしたい場合はsetpts=2*PTSとします。なるべく細かい動きを見たいので、60fpsにしました。

docker run --rm -v "$(pwd):/workspace" linuxserver/ffmpeg \
    -i /workspace/input.mov \
    -filter_complex "[0:v]fps=60,scale=320:-1:flags=lanczos,setpts=2*PTS,palettegen[p]; \
                     [0:v]fps=60,scale=320:-1:flags=lanczos,setpts=2*PTS[v]; \
                     [v][p]paletteuse" \
    -loop 0 \
    -y /workspace/output-slow.gif

さっきの動画が、こんな風になりました。

WebP形式にもできます

docker run --rm -v "$(pwd):/workspace" linuxserver/ffmpeg \
    -i /workspace/input.mov \
    -vf "fps=30,scale=320:-1" \
    -c:v libwebp -quality 80 -compression_level 6 \
    /workspace/output.webp

まとめ

FFmpegはオプションがややこしくて、一度作ったオプションの構成を秘伝のタレのように大事にコピペしながら使っていました。

しかし今だとAIを使えば自然言語で指示をしたらオプションを全部作ってくれるのですごい楽になりました。今回のスロー再生のやつも、元のコマンドを「スロー再生できるようにして」って言っただけです。

使いこなすのが簡単になってきた印象なので、他にも同じようにお悩みの方がいたらぜひ試してみてほしいです!

ARMテックブログ

Discussion