はじめに
チーム開発において、コミットメッセージやPull Request（PR）のやり取りを「テキストのみ」で行っていると、少しもったいないかもしれません。
- 「これは何のための変更か？」
- 「この指摘はどの程度重要なのか？」
これらが直感的に伝わりづらく、レビュアー・レビューイ双方の認知負荷が上がってしまうためです。
そこで活躍するのが 「Gitmoji」 や 「バッジ」 です。
これらを添えるだけでパッと見ただけで意図が伝わり、開発のコミュニケーションが非常に円滑になります！
この記事では、Macユーザーに人気のランチャーアプリ 「Raycast」 を活用して、手間をかけずにサクッと視覚的なアイコン・バッジを挿入する方法をご紹介します。
対象読者
- Macを使用しているエンジニア
- 日常的にGitでコミットやPR作成、レビューを行っている方
- テキストコミュニケーションを視覚的に分かりやすくしたいが、入力の手間は省きたい方
本記事ではMac環境のショートカットを前提に解説していますが、待望のWindows版Raycastもリリースされています！Windowsユーザーの方は、適宜ご自身の環境に合わせてキーを読み替えてお試しください！
この記事を読むメリット
- コミットログやPR一覧の視認性が向上する
- レビューコメントの重要度が明確になり、チーム内のやり取りがスムーズになる
- 毎回ブラウザで画像や絵文字を探す手間が省け、本来の開発作業に集中できる
以下記事のRaycast機能もおすすめなのでぜひみて読んでみてください！
前提条件
- OS: macOS
- ツール: Raycast がインストールされていること
1. GitmojiをコミットやPRタイトルにサッと添える
Gitmoji（🐛 や ✨ など）をコミットメッセージやPRのタイトルの先頭につけると、「バグ修正」なのか「新機能」なのかが一覧画面でひと目で分かるようになります。
Raycastの拡張機能（Extensions）を使えば、ターミナルやエディタを開いたまま、キーボード操作だけで瞬時にGitmojiを入力できます。
設定手順
- Raycastを起動（デフォルトは
⌥(Option) + Space）し、Storeと入力してEnterを押します。 - 検索窓で
Gitmojiと検索し、公式アイコンのものをInstall Extensionします。 - インストール後、Raycastの検索窓で
Gitmojiと入力して起動します。
💡 便利な使い方（Aliasの設定）
Raycastの設定（⌘ + ,）から、Extensions > Gitmoji を選び、Alias（エイリアス） を設定しておくとさらに便利です。
例えば Alias に gm と設定しておけば、ターミナルでのコミット作業が以下のようにスムーズになります。
- ターミナルで
git commit -m "まで入力 -
⌥ + SpaceでRaycastを開く -
gmと打ってEnterを押す -
bugと検索してEnterを押すと 🐛 がペーストされる
チートシート不要で直感的！
「バグだからbug」「新規追加だからadd」のように英単語で検索できるため、Gitmojiのルールをすべて暗記していなくても直感的に使いこなすことができます。
もっと早くgitmojiを打ちたい人はraycastのHotkeyやSnippetsを活用してください！
2. Raycastの「Snippets」でレビュー用バッジを展開する
こちらはPRをレビューする側のアプローチです。
そもそも「バッジ」とは、GitHubのREADMEなどでよく見る、以下のような視覚的なラベル画像のことを指します。
レビューコメントの冒頭にこのような鮮やかなバッジが添えられていると、その指摘が「絶対に直してほしい」のか「ただの提案」なのかがパッと見で直感的に伝わります。
本記事では、Shields.io を使い、Raycastの「Snippets（スニペット）」機能にこのバッジを展開するためのMarkdownを登録していきます。
設定手順
- Raycastを起動し、
Create Snippetと入力してEnterを押します - 以下の設定例を参考に、よく使うバッジを登録していきます
📝 おすすめのバッジ設定例（コピペで使えます）
Keyword を入力するだけで、Markdownが瞬時に展開されるように設定します。
① LGTM（承認・素晴らしい！）
-
Name:
review Badge: LGTM -
Keyword:
!lgtm -
Snippet:
② MUST（要修正・ブロック）
-
Name:
review Badge: Must -
Keyword:
!must -
Snippet:
③ NITPICK（細かい指摘・任意）
-
Name:
review Badge: Nitpick -
Keyword:
!nit -
Snippet:
④ ASK（質問・確認）
-
Name:
review Badge: Ask -
Keyword:
!ask -
Snippet:
使い方のコツとカスタマイズ
GitHubのレビューコメント欄などで !lgtm と打ち込むだけで、自動的にMarkdownが展開され、鮮やかなバッジが表示されます。キーワード（Keyword）は自分が打ちやすいもの（例：;lgtm や ,,lgtm など）に自由にカスタマイズしてみてください。
また、Snippetに登録するURLの各パーツを書き換えることで、自分好みのバッジを無限に作れます。
-
文言と色:
review-ask-ff69b4の部分を変更します-
review：左側のラベル -
ask：右側のメッセージ -
ff69b4：色（blueやredなどの名前、または00bfffのようなカラーコード）
-
-
スタイル（形状）:
?style=flat-squareの部分を変更します-
flat-square: 本記事で使用。角が四角いフラットなデザイン -
flat: 角が少し丸い標準的なデザイン -
for-the-badge: 文字がすべて大文字になり、より大きく強調されたデザイン
-
チームのルールや自分の好みに合わせて、最適なバッジを育ててみてください！
PRレビュー以外でも大活躍！
今回は「PRレビュー用」として紹介しましたが、Shields.ioのバッジやRaycastのSnippets機能は、アイデア次第でどこでも応用可能です！
READMEの装飾:
使用している技術スタック（ReactやAWSなど）のバッジを !react 等で一発展開する。
Issueの作成:
バグ報告や機能要望の定型文・ラベルをスニペット化しておく。
日報・ドキュメント:
NotionやQiitaなどのツールで、見出し用のアイコンやフォーマットをサクッと呼び出す。
自分だけの便利スニペットをどんどん育ててみてください！
まとめ
Raycastの拡張機能と標準機能を組み合わせることで、開発中のコミュニケーションの視認性を劇的に上げることができます。
- Gitmoji Extension：コミットやPRタイトルに絵文字を添えて、変更の意図を明確に
-
Snippets：
!lgtmなどのキーワードからMarkdownバッジを展開し、レビューの重要度を分かりやすく
テキストだけの無機質なやり取りに視覚的な工夫を少し取り入れるだけで、チーム全体の開発効率向上に繋がります。
設定は数分で終わるので、ぜひ今日のコミット・レビューから試してみてください！
最後までお読みいただきありがとうございました！✨