Edited at

Macでキャプチャして作ったGifアニメーションをQiita記事に貼り付ける方法

よくターミナルでの動きなどをGifにしてQiitaの記事などに貼付けられているのを見かけますが、自分もやりたかったためその手順をまとめました。備忘録的に書いてます。


Gifアニメーションを録る

GifGrabber というアプリがあるので、App storeから落とします。gifで検索すれば出てきます。(下に追記あり)

gifglaber.png

特に難しい操作はなく、アプリを起動すればキャプチャ領域を決める枠が出るので、それを録りたい部分に合わせて実行するだけです。実行し録画が完了したら、上のアイコンを開いて録った動画を開き、Save Asで保存すればOK。30秒しか録れないことに注意。

参考

MacでGifアニメーションをキャプチャする「GifGrabber」が使いやすくておすすめ!


2019/07/23 追記

GifGrabber はこの記事を書いた当時あったアプリなのですが、今見るとどうも見つからない様子。GifGrabber re-emerges as Giphy Captureを読むとGiphyという別アプリのファミリーになり吸収された?とのことで、もし他にアプリを探してる方は LICEcapなどを使用されると良いかと思います。


記事に貼付ける

GifファイルができたらそのままQiitaの編集画面へドラッグ&ドロップ!と思ったら、容量が大きくて圧縮されてしまい、下のように残念な感じになります。

findfile.gif

ドラッグする前に圧縮しましょう。Compressor.ioというサイトがあるので、そちらを使えば簡単にできます。

圧縮すると97%も削れました。赤枠で囲ってあるボタンからファイルをダウンロードしましょう。

Compressor.io - optimize and compress your images and photos 2015-12-11 12-37-06.png

あとは編集中の記事にドラッグ&ドロップするだけ。

findfile-compressor.gif

以上