ヘッダー道外のGIFファイル

ヘッダー動画

Picture

2019.11.172025.04.28

ヘッダー画像にGIF動画
その後の動画GIF作成のつぼ

ヘッダー画像にGIF動画

動画はインパクトが有りますが、ヘッダーは通常は静止画は指定出来ますが、動画が指定出来ません。
唯一の解決策がGIFアニメーションですが、通常の作成方法ですと、MP4動画に比べて数十倍になることがあり、現実的には使えません。

GIF動画を使うにしても、短時間の動画となると思います。
ここでは、公開されているFree動画から、何とかヘッダーGIFを作ってみました。

DLしたMP4動画から、目的のヘッダーGIFを作成する手順を忘れない様に手順にしてみました。

1. 動画の切り出し
2. MP4動画を再圧縮
3. 動画の特定の場所を切り出す
4. 切り出した動画から連続静止画を出力する
5. GIF動画にする前に、ループするので、何コマか巻き戻す画像を後ろに挿入

⇒これは無くてもOKですが、画像の繋がりをスムースにするため！

巻き戻しにする静止画は連続した番号にファイル名を振り直す
連続静止画からGIF動画を作成する
動画は1画面のサイズですが、ヘッダー画像用に表示部だけクリップします
GIF編集アプリでコマの時間を調整する

以上で何とか目的のGIF動画を作成してみました。最初の作品ですのでブラシアップが必要ですが・・・
なお、ここで使った上記の処理は殆どがffmpegコマンドで実行しました。

＜ご参考まで＞
ffmpegコマンドでは動画ファイルの圧縮は簡単です・・・（上記の手順とは順序が違っています）

動画の有るフォルダーに移動後・・
# ffmpeg -i "圧縮したいファイル.mp4" -crf 32 出力ファイル名.mp4
上記の内、-crf の後の数値を大きくすると圧縮率が上がります。
$ ffmpeg -ss 10 -t 4 -i image1.mp4 image1.gif
上記の例は、元のmp4ファイル、image1.mp4を、開始10秒目から4秒間を切り出して、image1.gifファイルとして出力しています。
$ ffmpeg -i image1.mp4 -vf crop=1280:180:0:300 image1-c.gif
上記は、image1.mp4動画ファイルから、トリミングした、image1-c.gif動画を得る方法。上下全幅で高さ300pxをカット！
$ ffmpeg -ss 0 -t 4.3 -i image1-c.gif image1-c1.gif
同じgifファイルで、0秒から、4.3秒間を抜き出した、別名で保存する方法！
$ ffmpeg -i imqge1-c1.gif -vf pad=0:780:0:300:black ooutput.gif
元画像が、1280wx180hのgifファイルに、上下300pxの、黒い余白を設けて、別名のgif動画に出力するコマンド例
$ ffmpeg -i image1.mp4 -vf scale=1280:-1 imqge1-ss.mp4
解像度が1980w1080hのビデオをｗ1280wの解像度に落とすコマンド例
$ ffmpeg -i image%04d.jpg out.gif
連番の画像から動画GIGを作る場合は上記の例が参考になります！

なお、GIF画像の各コマ時間を設定出来るアプリを使う必要がありますが、ここではWindows用のglamと言う名のフリーソフトを使いました。
ここで使用する静止画は、毎秒何枚の静止画を出すか指定していますので、デフォルトでは表示が早すぎます。又、ループする時に巻き戻しは、複数枚で1枚の画像を表示していますので、これらのコマの表示時間を変更しないと、不自然になります。