GitHubのプルリクエストにスクリーンショットやアニメーションGIFを追加する方法

GitHubの開発者の間では、リポジトリのプルリクエストにスクリーンショットやアニメーションGIFを添付するのが一般的です。何行ものプレーンテキストを読ませるよりも、視覚的なコンテンツの方がはるかに注目を集めます。静的なスクリーンショットは、UIの変更点や画像をインラインで挿入したい場合に役立ちます。一方、GIFアニメーションは、処理の流れやマウスカーソルの動きを示すのに最適な方法です。

このチュートリアルでは、GitHubのプルリクエストにスクリーンショット画像やGIFアニメーションを追加する方法を、初心者向けに最初から順を追って解説します。GitHubを使ったことがない方でも、この手順に従えば簡単に始められます。

1. 新しいリポジトリとブランチを作成する

GitHubを初めて利用する場合は、まず公式サイトでアカウントを作成しましょう。アカウント作成後、画面右上の「+」ボタンをクリックして新しいリポジトリを作成します。その際、「Initialize this repository with a README（READMEでリポジトリを初期化する）」オプションにチェックを入れるのを忘れないでください。

次に、下図のようなドロップダウンメニューからリポジトリにブランチを追加します。ここでは、「Hola-World」リポジトリに「Guten-tag」というブランチを追加しています。

GitHubにおけるブランチの役割は、マスター（本番用）ブランチとは切り離して、新機能の開発やバグ修正を進められるようにすることです。これにより、メインのコードベースに影響を与えることなく、安全に作業を進められます。

2. スクリーンショットやアニメーションを作成する

スクリーンショットを追加するには、使いやすい画面キャプチャソフトが必要です。Windows 10なら、「Snip & Sketch（切り取り&スケッチ）」や「Snipping Tool（切り取りツール）」が最も手軽でおすすめのツールです。

GIFアニメーションを追加する場合は、画面録画ツールが必要です。おすすめは「Recordit」です。操作が非常にシンプルで、手軽に画面収録ができます。WindowsとmacOSの両方で直接ダウンロードして利用可能です。

インストール後は、録画ボタンを押すだけで数秒間の画面を録画できます。最近の録画データはシステムトレイのメニューから確認でき、ブラウザで開くこともできます。

なお、GitHubのプルリクエストでは動画ファイル（MP4など）を直接アップロードできないため、GIFファイルに変換する必要があります。実際、GitHubでサポートされているファイル形式はJPG、JPEG、GIF、PNG、DOCX、PPTX、PDF、TXT、XLSX、ZIPなど、かなり限られています。MP4からGIFへの変換は、Ezgifなどのオンラインツールを使えば簡単に行えます。

以下は、GitHubのプルリクエストに挿入するために作成したGIFファイルの例です。GitHub Desktopアプリを使って、リポジトリに新しいブランチを追加する一連の流れを示しています。

3. スクリーンショットやアニメーションをプルリクエストに追加する

先ほど作成したブランチに戻り、「Pull requests（プルリクエスト）」ページに移動します。ここでは、三点リーダー（…）のメニューからプルリクエストの情報を編集できます。

エディタモードになったら、「Attach files（ファイルを添付）」オプションからスクリーンショット画像やGIFアニメーションファイルを添付できます。GitHubのブランチリポジトリに初めてコミットする場合は「Commit（コミット）」を、すでにコメントがある場合は「Update comment（コメントを更新）」を選択します。

これで、作成したスクリーンショットとアニメーションがGitHubのブランチ、ひいてはリポジトリに正常に追加されました。

GitHubの魅力は、他の開発者とのコラボレーションにあります。提案した変更が気に入られれば、相手が自分のリポジトリに取り込む（マージする）こともあります。これは「Merge pull request（プルリクエストをマージ）」オプションを使って行われます。

アニメーションは、GitHubコミュニティの他の開発者の注目を集めるのに非常に効果的な手段です。このチュートリアルを完了すれば、GitHubのリポジトリやそのブランチにスクリーンショットやGIFアニメーションを追加する方法を習得できたはずです。GitHubに興味がない方は、GitHubの代替サービスのリストもぜひチェックしてみてください。