PCの操作画面はGIF動画ではなくmp4動画にしていこう

3DCGでは手順をPCのスクリーンキャプチャ動画で説明したほうが便利なことも多い。かつてはGIF動画が使われていたが今の時代はmp4が主流だ。今回はScreenToGifという無料ソフトとmp4動画出力のおすすめ設定方法のご紹介。

更新履歴
2024/01/02 パラメータについて追記。
2023/12/18 基本パラメータのオススメ初期値を0.9から0.2Mbpsに変更。
2023/12/07 公開。

(約 4,900文字の記事です。)

目次

GIFは特殊用途のみ

かつてはブログなどに埋め込む動画にはGIF動画が多かった。だが時代は令和。動画と言えばYouTube。そう、メディアとしてGIFは時代遅れとなり、mp4が主流になっている。

ただし以下のようにGIFを使わざるを得ないシーンも極わずかにある。もしそうでなければmp4に移行した方がいい。

mp4が使えるならGIFは使わないほうがいい

ではGIFはオワコンかといわれるとそうでもない。具体的な活用例は、

  1. サーバ側でmp4動画の埋め込みを認めていない場合
  2. 動画アイコンや動画ブログカード、アイキャッチ動画を作りたいとき

この2点くらいだろう。

例えばはてなブログやnoteなどのメーカー製サービスではmp4動画を「すぐに見られる形」で埋め込ませてくれない。あるいはmp4をアップロードすらさせてくれない場合もある。他にも例えばBlender Marketもmp4は使えず、クリエーターはしょうがなくGIF動画を使っている。

GIF動画の弱点

  1. 画像サイズが400px四方以上といった広い範囲(高解像度)の動画では数秒であってもファイル容量が意外と大きくなる
  2. グラデーションのある表現だとファイル容量がMB単位でどんどん膨らむ(例え十数秒の短時間動画であっても)
  3. そんなにファイルサイズが大きいのに、色がガタついたチープな表現(RBG256階調)
  4. フレームレートも低くてカックカクの紙芝居。マウスの動きを目で追いづらい
  5. Twitter XではPCでフルスクリーンで閲覧できない😭

なのでPC操作を動画で見せるメディアとしてはあまりにもファイルサイズが巨大になる上に、はっきり言って見づらい。マウスの動きが見づらくて目が疲れる。場合によっては10MBを超えるGIFファイルの割に表現力がショボすぎる。これは迷惑な話だ。

なのでもしご自身が利用しているサービスでmp4ファイルをアップロードできて、かつ動画プレーヤー形式で埋め込めるならばmp4に切り替えた方がいい。

特にTwitter Xに向かないGIF動画

なおTwitter XにGIF動画をアップロードしてもサーバ側でmp4に強制変換されるという現実。そしてGIF動画はTwitter XのPC視聴ではフルスクリーンで見ることができない😭

これはPC操作の説明動画としては致命的。

というわけで概要説明もほどほどにして実際の操作に入っていこう。

ScreenToGifという無料ツールでmp4にする

名前の通り、この無料ソフトはもともとはGIF動画を作るためのツールだ。だが今はmp4ファイルも出力できる😍今回はこのツールでスクリーンを撮影し、GIF動画ではなくてmp4にする際のパラメータについて解説する。

大和 司

なおこのソフトの使い方については解説しません。各自で調べてみて下さい。今回はmp4出力のための設定だけご紹介します。

このソフトを入れただけでは実はmp4を出力できない。だが以下のようにワンクリックでmp4出力ができるようになる。

(事前準備)ffmpegのインストール

歯車アイコンのオプションをクリックし、外部ツール>FFmpegボタンをクリックすると自動でffmpegという無料エンコーダーがインストールされるはずだ。(この実装はおそらく大人の事情ってやつだろう。)

なおffmpegは2023年の11月にVer.6が公開されたので最新版を使えばいいだろう。

あとは念のためScreenToGif本体を終了&再起動させよう。

いざ録画!の前に。

動画撮影のフレームレートは20fpsで十分

別に20fpsでも24fpsでも30fpsでもいいのだが、PCのソフトの使い方を解説では20fpsでもカクツキをほぼ感じない。フレームレートが高いほど無駄にファイルサイズが大きくなるだけだ。まずは20fpsを基準とし、各自の判断で10~30 fpsに変更して撮影を開始してもいいだろう。

加えて影響が出るのはScreenToGifの編集作業だ。「横にずらっと並ぶフレームの総数」が変わる(当たり前w)編集作業が少し早くなるし、録画時のPCストレージの一時ファイルも小さくなる。今回はまずは20fpsで話を進める。

大和 司

あとは20fps設定を録画開始前にセットして、実際に録画。必要ならScreenToGifで編集したり、マウスクリック時に色付けてしたり(初期設定では自動的に適用される)、キーボード操作を字幕化したり、色々編集しよう。

mp4エンコード設定

ここからがmp4動画出力の工程だ。まずは初期設定をしてテンプレを保存する作業の解説。

初期設定

ffmpegが正しくインストールされていればmp4を選択できる。

  1. Mp4を選び
  2. Defaultを選び
  3. リセットアイコンをクリックし、Yesで初期化する

次に初期値からカスタムしていく。

初期値の変更

  1. Codecはデフォルトのx264であることを確認
  2. PresetはVery Slowに変更
  3. Passを2に変更
  4. Bitrateに0.90 0.20(Mbps)を指定(実は数十秒以上の場合にファイルサイズが大きくなりすぎたので基本のビットレート値を小さめに変更)
理由はこんな感じ。

色々試した結果の結論です。

  1. x264はCPUエンコーディング。mp4といえばnVIDIAグラボのNVEnc(ハードウェアエンコード)が爆速で有名だが数十秒かつFull HD未満の動画ではむしろいいところがない。予想よりも大きなファイルサイズ&動画のアラが目立つ。全くNVEncのメリットがない。なので最終的にシンプルなCPUエンコードが一番綺麗だった。
  2. ファイル容量は小さいほどいい。また数十秒の動画なのでFastと比べてもせいぜい5~10秒しか待ち時間が増えない(2 passであっても)。高画質かつなるべく小さなファイルサイズのためにVery Slow。
  3. 2 passは一発出力の1 passよりも画質とファイルサイズの面で優れている。
  4. Bitrateの値については次を読んで下さい。

この設定ができたらプリセットを保存しよう。

+ボタンを押して名前を付けて保存する。(フロッピーアイコンは既存プリセットの上書き保存ボタンだ。間違わないように!)

プリセット名前は後から変えられない。変えたければ新規でプリセットを作って保存することになる。(図は過去の記事のままですが気にしないで。)

ここではV Slowとしてみた。下のDescriptionはメモ欄。空欄でもOKだ。

保存できたら動作確認

無事にプリセットを保存できたら、試しに他のプリセットをクリックし、再びV Slow をクリックしてみて、上記の設定に値が正しく切り替わるか確認して欲しい。

プリセットが正常だった場合、パラメータ値を変更できないようにロックする。

ここで画像のようにオートセーブをチェックOFFすること。(ここをONにするとプリセット値を変更したときに自動で上書き保存される。)

Bitrateは0.2 Mbpsを基準に±0.05で

さて、この0.2Mbps、絶妙な値だ。そして実はこのビットレートの値を0.05刻みで増減させることで以下の調整が簡単にできる。

  1. できた動画の画質が悪いと感じたら、ビットレート値を大きくしてやり直す
  2. 動画のファイル容量が大きすぎると感じたら、値を小さくしてやり直す

これだけ。とてもシンプルな運用。というのも「撮影面積が広いか狭いか」「撮影時間が長いか短いか」で色々と状況が変わる。そのときでも上記の二択の調整方法はとても分かりやすい😍

ビットレートの話

ビットレートは1秒あたりのデータ量だ。YouTubeの場合、4~9 Mbpsと言われている。だがPC操作の動画に4Mbpsも要らない半分以下の2Mbpsまでで十分だろう。それどころかもっと絞って良いことが分かった!0.2Mbpsでも十分綺麗に見える場合も割と多かった。あとは画質とファイルサイズと尺の長さに依存する。

PC操作の動画では0.1~0.2 Mbpsの範囲内で0.05刻みで調整するといいだろう。

面倒臭ければ0.2 ± 0.1で、さほどハズレはない。

ただし以下の画像のようなグラデーション表現を動画にすると0.2Mbpsではノイズが多くて見るに堪えない場合もある。そういうときには0.2Mbps以上にして「画質とファイルサイズ」を何パターンか試して決めればいい。

大和 司

上記の場合、もちろん0.8, 0.7Mpbsも試したがさすがにどんどん画質が悪くなる。特に人体モデリングの滑らかなグラデーション表現がひどくなったので、0.8よりも1つ上の0.9を採用😊

あとは各自でお好みのビットレートを探ってみて欲しい。(動画の尺や撮影画面の大きさにも依存するので)

今回とは逆に平面的な動画なら0.1Mbpsを基準としてもいいかもしれない。ビットレートが低くても破綻した動画に見えにくいので。ファイルサイズを抑えたいときには画質が破綻するまでここを小さくすればいい。

これは0.15Mbpsでファイルサイズ350KB。十分だ。

なのでファイルサイズを優先するならばビットレート 0.1Mbpsからスタートして、画質にどうしても不満があるなら0.05ずつ大きくすればいいかもしれない。初回で画質がそこそこで0.2Mbpsでもファイルサイズが十分だと判断したら、そこでいきなりエンコードのテストは終了となるので時短できるかも知れない。

そこまでファイルサイズを気にしないなら0.3Mbpsくらいを基準にしてもいいかも🤔

録画開始時とは異なるfpsにしたい

基本的には撮影を開始する前に(というか一度セットした初期値を変えずに)お好みのfpsであることをチラ見で確認して、以後はずっとそのfps値で触らないで運用するのがいいだろう。そうすれば可変フレームレートで可変ビットレート(VBR)な、表現に最も適した「シーンごとに最適な情報量」が割り当てられたVBRなmp4ファイルができあがる

例えば撮影時は30fpsだったがmp4は20fpsにしたい場合など、どうしてもfpsを変更してmp4にしたい場合の対処方法はこちら。

これ以上の細かいパラメータについては解説しません。各自で調べたり試行錯誤して下さい。

おわりに

この設定で今後は快適にPC操作をmp4化できるはずだ。最初に説明したように、GIF動画でなければならない環境にある場合を除いてmp4のほうが「ファイルが小さくて画質が良くてカクツキも少なくて見やすい」ので、もうGIF動画を採用する理由がない。

なのでこれを見た人は理由がない限り、mp4動画にシフトしたほうがいいと思う。

あと、GIF動画のほうがmp4よりもファイルが小さい?mp4ファイル出力時に毎回「上書きする?」確認が鬱陶しい?撮影時とは異なるfpsのmp4ファイルを作りたい場合など、更に追加的な内容はこちら。

今回の創作活動は約3時間30分(累積 約3,643時間)
(937回目のブログ更新)

ご支援のお願い

筆者はAmazonアソシエイト・プログラムに参加しています。(Amazon様の商品を宣伝することで紹介料をAmazon様から頂けるという大変ありがたい仕組みのこと。)
以下の商品名や画像アイコンをクリックしてからAmazon様で何かお買物をして頂ければそのご購入総額の1~2%が私に寄付されます。クリック後に別の商品のご購入でもOKです!誰が何を買ったかは私に通知されませんのでご安心下さい😊

また当サイトは楽天アフィリエイト、バリューコマース Yahoo!ショッピング アフィリエイト、および第三者配信の広告サービス(Googleアドセンス)を利用しています。

著:金泉太一
¥2,653 (2023/12/07 23:51時点 | Amazon調べ)

【他の関連記事を絞り込む場合】
下の カテゴリ名 タグ名 をクリックして下さい

目次