ものづくりのブログ

うちのネコを題材にしたものづくりができたらいいなと思っていろいろ奮闘してます。

mac の画面を録画して GIFアニメを作る方法

ブログを書いていると、説明資料としてGIFアニメが欲しくなるときがあります。
自分の場合は、はてなブログに GIF の説明資料をアップロードするときに必要になります。
今回は、作業端末が mac で GIFアニメを作る方法をここにメモしたいと思います。

GIF アニメ作成手順

動画撮影

以下の手順で動画撮影を行います。

1.「Shift + Command + 5」を押します。
2.「選択部分を収録」を押し、枠をドラッグ&ドロップし、収録範囲を決めます。
3.「収録」ボタンをクリックすると録画が開始されます。
4. 画面上部 or「Touch Bar」の左に停止ボタンがあるので押すと録画が終了します。

mov ファイルが作成されます。
(今回は chart.mov というファイル名に変更しています)

GIFアニメに変換

以下のサイトで mov ファイルを gif に変換します。
convertio.co

フォーマット指定

MOV -> GIF を選択します。
f:id:a1026302:20220119135829p:plain

mov ファイルアップロード&変換

chart.mov をアップロードし変換ボタンをクリックします。
f:id:a1026302:20220119135916p:plain

gif ファイルダウンロード

変換が完了したら gif ファイルをダウンロードします。
f:id:a1026302:20220119140017p:plain

はてなブログにアップロード

gif ファイルをはてなブログにアップロードします。

実際にアップロードしたもの

チャートの表示をGIFアニメにしたものを表示させてみました。
f:id:a1026302:20220119140705g:plain