はじめまして。カヤック技術部の杉山です。 主にクライアントワークでサービスを開発しています。
今回は、とある動画生成サイトに関して書きます。
動画生成サイトのサービス内容
ユーザーの撮影した写真と、サイト内でいくつかの選択肢を選ぶと、オリジナルの動画が生成できるサービスです。 画像にはロゴなどの合成が出来、映像作家によるアニメーションと、ミュージシャンによるBGMがつきます。
今回は、サーバーアプリケーションの実装に関して解説してみます。
利用技術
- Ruby on Rails
- AWS
- FFmpeg
- ImageMagick
主な処理
- クライアント側から画像を複数枚アップロードし、サーバーへ保存
- 動画、画像、BGMを合成
- 動画生成のチューニング
それぞれの内容
クライアント側から画像を複数枚、サーバーへ保存
画像をサーバーへアップロードする前に、ロゴやテキストの合成をフロント側で行っています。
動画、画像、BGMを合成
Amazon SQSを使い、Webサーバーとは分かれた、Workerサーバーでリクエストを受け取り、FFmpegを利用することで、動画を生成しています。
動画を構成する素材として、 背景になる動画、ユーザーの画像、画像に対するフィルター処理、上に重ねる背景透過の動画、BGM があります。 これらを合成して1つの動画を生成するのですが、ブラウザで再生するため最終的にmp4(H.264+aac)にエンコードする必要があります。
動画生成のチューニング
ユーザーは写真をアップロードした後に、動画が出来上がるまでWebサイト上で待機しているため、動画生成時間は少しでも短くする必要があります。 動画処理はどれも時間がかかりますが、部分的に処理を行う、短い動画に対して処理を行う、最後に連結する、というのが高速化のポイントです。
今回行っている流れとしては、
- 動画にoverlayする前に、画像としてImageMagickなどで加工する(フィルター処理)
- FFmpeg で背景動画、画像、透過動画 を短い動画の状態でoverlay合成
- FFmpeg での処理時は、mp4への変換に再エンコードが不要で、連結が高速な、tsファイルとして出力する
- tsファイルをまとめて concat し、さらに aac 音声と結合する
さらに、
- 事前に、素材となる動画・画像のクオリティー・動画の長さ・フレーム数・動画の分割を試行錯誤する
- 素材の動画は、シンプルなエンコードの方がデコードが高速ではあるが、ファイルサイズが増える
- 加工するファイルサイズがおおきいと、ディスクのIOがボトルネックになり、処理が遅くなる
- 事前にtsにする、透過が使いたい場合は、avi(png)にする
これらを考慮していい感じのところを探りました。
さいごに
以上、中身はこんな処理になっていました。
生成時間はサーバー費用に直結するので、動画のクオリティー、演出方法、さらにはユーザー体験や企画にも影響する、なかなか骨の折れる仕事ですね。
こんな仕事が面白そうだと思った人はこちらから! 杉山のブログを読んだと書いてもらえると、筆が進みます。