「Gyazo」「GIPHY」というサイトを活用して動画をGIFに変換します。
GIPHYはめちゃくちゃ怪しい見た目をしていますが、ちゃんとしたサイトなのでご安心ください。
①Gyazoをダウンロードする
Gyazo
スクリーンショットや7秒程度の動画を簡単に撮影できるアプリケーションです。
READMEに載せたい動画を撮影し、右クリックで保存しておきます。
これでGyazoでの作業は完了です。
②GIPHYで会員登録をする。
GIPHY
右上のLog inをクリックします。
上のタブをSign Upに変え、「メールアドレス」「ユーザーネーム」「パスワード」「確認用パスワード」を」入力し、「ロボットではありません」にチェックを入れ、下のSign Upをクリックします。
すると4桁の入力画面が出るので、先ほど登録したメールアドレスに届く認証用コードを入力します。
これで会員登録は完了です。
③GIPHYで動画をGIFに変換する。
トップページに戻り、右上のCreateをクリックします。
左にあるGIFをクリックし、Gyazoで撮影した動画を選択します。
GIFの長さ(DURATION)と、GIFの開始位置(START TIME)を調整します。
※撮影した動画を全てGIFにしたい場合は、DURATIONを一番右までスクロールします。
（GyazoでMAX撮影したものであれば、Secondsはだいたい7.4秒くらいになります。）
設定が完了したらContinue to Decorateをクリックします。
装飾やアニメーションを設定できますが、何もせずにContinue to Uploadをクリックします。
次に公開情報を設定できます。
GIF動画をGIPHY上で一般公開したくない場合は、PublicをOFFにしておきます。
Upload to GIPHYをクリックし、GIF動画を作成します。
※作成が完了するまで少し時間がかかるため待ちましょう。
下記のような画像になれば成功です。
また、赤い鍵マークのバナーが出ていれば非公開の設定もできています。
※もし非公開になっていなければ、GIF動画内の右下に鉛筆マークがあるため、そこから非公開に変更できます。
完成したGIF動画を右クリックで保存しましょう。
これでGIPHYでの作業は完了です。
④Githubのissueを使ってURLを生成する
このままGIF動画をREADMEに貼ってもリンクしか表示されないため、Githubのissueを使ってURLを生成します。
まずはIssuesタブから、New issueをクリックします。
枠内の一番下に、
Attach files by dragging & dropping, selecting or pasting them.
という文字列があるためそこをクリックします。
ファイルの選択画面になるため、先ほどGIPHYで作成したGIF動画を選択します。
アップロードが完了すると下記のようなリンクが生成されます。
※[ ]内は、GIPHYでGIF動画を保存した際のファイル名が入ります。
あとはこのURLを丸ごとコピーしてREADME内に貼り付ければGIF動画が表示されるはずです。
以上で、READMEにGIF動画を載せる方法は終了です！お疲れ様でした。 ご指摘などあれば、ご教授いただけると幸いです。