GIFの説明動画のスピード作成方法〜Mac〜

こういうGIFの説明動画は作りたいけど、いちいちエディターを開いて編集なんてやっている暇がない、、という方へ

スピード解決できる方法をご紹介（Mac）

（※このGIF動画のFigma プラグインの紹介についてはこちら）

用意するもの

# ターミナル（コマンドライン）
　- Homebrew
　- ffmpeg

# 動画
　- Quicktime

1. 動画を撮る

まずは動画を撮ります

Macならステータスバーの検索かアプリ一覧からQuick Timeを起動

ファイルから新規画面収録を選択

録画範囲が選択できるので録画したい場所を指定して録画ボタンを押す

停止はヘッダーのステータスバーの止めるボタンから停止できます

2. いらない部分をカット

そのままQuick Time上で編集していきます

動画の前後の長さを変更したい場合はトリム

途中のグダッているところやカットしたい場所がある場合は、その場所に再生バーを合わせた状態でクリップを分割をしていくと、動画が切れるのでいらないところを削除し編集します。

ちょうど良い長さになったら完了にしファイルを保存。

次はGif化していきます。

3. Homebrewのインストール（ターミナル）

※Homebrewが入っている人はこのステップは飛ばしてください。

まずターミナル（コマンドライン）を起動します。

HomebrewのHPへ行きコードをコピーしてそのままターミナルに貼り付け実行し、Homebrewをインストールします。

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

※Homebrewとはターミナル上でいろんなソフトを使うためのインストーラーのようなもの（ざっくり）

　Macでインストールできない方は、M1搭載以降アクセスの互換性を整える必要があるそうで、ターミナルの情報から「Rosettaを使う」にチェックを入れ、ターミナルを再起動してみてください。

インストールが完了したら  brew -v を入れ実行してバージョン情報が出てくれば正常にインストールされています

4. ffmpegのインストール（ターミナル）

Homebrewが入ったら次はffmpegをインストールします

ターミナルに引き続き下記を入力し実行

brew install ffmpeg

完了したらようやくGif化にすすみます。

ここまでは初期設定なので、次回以降は次のステップからスタートできます。

5. movをGif化する

下記の通りターミナルで実行します。

変換したい動画は ffmpeg -i の後にドラッグ&ドロップで入れるとパスが自動で入力されます。

同じところに書き出したいときは movファイルと同じパス.gif の拡張子に変更して実行してください。

ffmpeg -i 【変換したい動画.mov】 【変換後のファイル名.gif】

Gif画像だと画質が荒いですが、Apngを使えばあらさが軽減されます。
Apngの書き出しは下記サイトから引用させていただきました。

ffmpeg -i in.mp4 out.apng
（入力した動画をそのままAPNGアニメに）

拡張子に.apngを使えば自動的にフォーマット判別。
apngの拡張子を使わない場合は明示的に -f apng 指定。
ffmpeg -i in.mp4 -f apng out.png

脳内メモ＋＋

6. FFmpeg よく使うコマンド説明

-i：入力ファイルのパス (複数指定可)
-r：フレームレートを指定値に変換。指定しない場合は入力ファイルの値のままになる（-r 24）
-s：指定サイズで書き出す（-s 640x480）
-vf：縦横比を保ったまま指定サイズで書き出す（-vf scale=320:-1）

個人的な設定はこちらにしました

ffmpeg -i 【変換したい動画.mov】 -r 24 -vf scale=400:-1 【返還後のファイル.gif】

movファイルを、フレームレート24、横幅400px：縦幅アスペクト比に依存して書き出す

Apngの書き出しは下記の通り

ffmpeg -i 【変換したい動画.mov】 -r 24 -vf scale=400:-1 -f apng【返還後のファイル.png】

7. 倍速で書き出す

ffmpeg -i  【変換したい動画.mov】 -vf setpts=PTS/2.0 -af atempo=2.0  【返還後のファイル.gif】

setpts=PTS/2.0 -af atempo=2.0　の数字のところを変更すると速度も変わります。
こちらは2倍速の設定。
数字のところを0.5にすれば、倍の長さになるし、5.0にすれば、5倍速で再生されます。

FFmpeg上でサイズやフレームレートを変更できるうえに、変換速度も早いのでもし動画編集ソフトやPSを使った書き出しに嫌気が差している方がいれば使ってみてください。

こちらの記事は株式会社Brewusでの活動を元に記載しています。