English
本稿は、AIを活用した3件の業務改善事例を紹介するシリーズの第3回である。
第1回では、ボットによる異常なトラフィックで停止したECサイトの復旧を取り上げた。第2回では、WordPressで構築したB2B発注サイトを、Next.jsとSupabaseを使った新しいシステムへ全面的に移行した事例を紹介した。
第3回となる今回は、日常的に利用しているClaudeの使用量を、ブラウザ上ですぐに確認できるChrome拡張機能の開発から、Chrome ウェブストアでの公開までを取り上げる。
前2回がECサイトや業務システムを対象とした事例であるのに対し、今回は日々の小さな不便を解消する、より身近な取り組みである。AI活用をどこから始めればよいのかを考えるうえでも、分かりやすい事例といえる。
開発のきっかけは、日々の小さな不便
2026年春、プログラミング経験のなかった筆者の従兄弟が、わずか1週間でECサイトを二つ構築し、アプリストアへの公開まで進めていることを知った。AIを使った開発が、すでに一部の専門家だけのものではなく、実用的な段階に入っていることを強く実感した出来事だった。
これをきっかけに、筆者もClaudeを本格的に使い始めた。最初はProプランから始めたが、これまで自分の中に蓄積していたアイデアが想定以上のスピードで形になっていくことに手応えを感じ、短期間でMaxプランへ移行した。通常であれば慎重に検討する上位プランへの課金を早い段階で決断したのも、それだけ実務での可能性を感じたからである。
ただし、月額100ドルを支払う以上、利用できる枠はできるだけ有効に使いたい。Claudeには5時間単位と週単位の利用上限があるため、上限を意識しながら作業を進めているうちに、1日に何度も利用状況を確認するようになった。
Web上で使用量を確認するには、その都度プロフィールから使用量の画面を開く必要がある。一つひとつは数秒で終わる操作だが、毎日何度も繰り返していると、小さいながらも無視できない不便になる。
そこで、この日常的な不便を解消するために、Claudeの使用量をブラウザ上ですぐに確認できるChrome拡張機能を開発することにした。
実装の前に、AIと要件をすり合わせる
この拡張機能で実現したいことは、大きく分けて次の三つである。
- Chromeのツールバーに置いたアイコンから、現在の使用量を確認できること
- アイコンをクリックすると、日ごとの使用量やモデル別の内訳をグラフで確認できること
- ゲーミフィケーションの要素を取り入れ、既存の同種拡張機能との差別化を図ること
ただし、これらの要件をClaude Codeに渡し、いきなり実装を依頼したわけではない。
前回のB2B発注サイト再構築と同様に、何を、どこまで、どのように表示するのかについて、自分の考えとAIの理解が一致したと感じられるまで対話を重ねた。その中で最も検討に時間をかけたのが、三つ目のゲーミフィケーションである。
調査してみると、Claudeの使用量を表示するChrome拡張機能は、すでに複数公開されていた。それらを利用する選択肢もあったが、筆者自身がChrome拡張機能を開発した経験がなかったため、今回は企画から実装、公開までの一連の工程を経験してみることにした。
しかし、既存の拡張機能と同じように使用量を表示するだけでは、独自性は生まれにくい。そこで、毎日継続して利用しているか、利用枠をどの程度効率よく使えているかといったデータをもとに、スコア、ストリーク、達成状況などの要素を加えることにした。
将来的には、利用者の同意を前提として、個人を特定できない形にしたデータを蓄積することも検討している。これが実現すれば、利用傾向をランキングとして表示したり、地域ごとの利用パターンを比較したりできる可能性がある。
例えば、ある地域では深夜の利用が多い一方、別の地域では午後の利用が中心になるといった違いである。こうしたデータが蓄積されれば、Claudeが地域や時間帯によってどのように使われているのかも分析できるかもしれない。
このようにClaudeとの対話を重ねながらアイデアを整理し、最終的にはClaude Codeへ渡すMarkdown形式の仕様書を作成してもらった。自分の考えとAIの理解を十分にすり合わせたうえで、実装をClaude Codeに任せた。
ツールバーとダッシュボードで使用量を可視化
完成した拡張機能では、Chrome右上のツールバーに現在の使用量がバッジとして表示される。アイコンをクリックすると、現在の利用状況、上限までの残り、リセット時刻などをすぐに確認できる。
ダッシュボードでは、日ごとの使用量やモデル別の内訳に加え、スコアやストリークなどのゲーミフィケーション要素も表示される。
現時点では十分なデータが蓄積されていないため、一部のスコアはまだ表示されていないが、設計段階で想定していた機能は一通り実装できた。匿名化したデータをサーバーに蓄積する機能については、実際の利用状況を確認したうえで、将来的に追加する方針である。
結果として、これまで何度も画面を移動して確認していた使用量を、クリック一つで確認できるようになった。一見すると小さな改善だが、毎日繰り返す操作だからこそ、実務上の効果は大きい。
初めての公開手続きもAIと進める
Chrome拡張機能を開発したのは今回が初めてであり、Chrome ウェブストアで公開するのも初めての経験だった。せっかく実装まで完了したので、自分だけで利用して終わらせるのではなく、公開までの工程も一通り経験することにした。
公開するためには、開発者登録、掲載ページに必要な画像や説明文の準備、プライバシー関連項目の記載、審査への提出など、さまざまな手続きが必要になる。初めて取り組む場合には判断に迷う項目も多いため、ここでもClaudeに質問しながら一つずつ進めた。
特に役立ったのは、分からない画面が表示されたとき、そのスクリーンショットをClaudeに渡す方法である。Claudeは画面の内容を確認し、「この項目には何を入力すればよいか」「次にどのボタンを押せばよいか」を、実際の表示に沿って案内してくれた。
今回改めて感じたのは、AIの役割はコードの生成だけにとどまらないということである。開発の前段階にある要件整理から、完成後の公開手続きまで、一連の工程を支援できる。特に、経験のない分野の作業を一人で進める場合、こうした伴走型の支援は大きな助けになる。
アプリや業務ツールを公開する専用サイトを構築
今回の拡張機能に限らず、これまでAIと一緒に作ってきたアプリや業務ツールを、まとめて公開できる場所も以前から用意したいと考えていた。そこで、ツールの紹介と配布を目的とした専用サイト「Magnote Apps」を、Claudeと一緒に構築した。
まずは、今回開発したChrome拡張機能を掲載している。今後は、ECサイトと会計ソフトを連携するツールや、Slackへの通知を自動化するツールなど、自社業務のために開発してきたものを順次公開する予定である。
これらのツールは、いずれも自社で感じた「この作業は面倒だ」という課題から生まれている。同じような課題を抱える企業や個人にとっても役立つ可能性があり、Magnote Appsはその可能性を検証するための場でもある。
AI活用は「目の前の不便」から始まる
3件の取り組みを振り返ると、ボットアクセスへの対応、B2B発注サイトの再構築、Claude使用量の可視化のいずれも、自社業務の中で感じていた具体的な不便から始まっている。
最初から全社的なAI活用戦略を策定し、それに沿って進めたわけではない。目の前にある「この作業は面倒だ」「もっと効率よくできないか」という課題を特定し、AIに任せられる部分を任せる。その積み重ねが、今回紹介した3件の取り組みにつながった。
ただし、すべてをAIに任せればよいわけではない。何を作るのか、どのように使うのか、どこまでAIに任せるのかという判断は、人間が担う必要がある。
「ツールは使うものであって、ツールに使われてはならない。」
AI活用というと、全社的な導入戦略や大規模なシステム構築に目が向きがちである。しかし、実際の成果は、現場が日々感じている小さな不便を一つずつ解消することからも生まれる。
企業がAI活用の第一歩を考える際には、まず身近な業務を見直し、「何度も繰り返している面倒な作業はないか」と問いかけることが、有効な出発点になるのではないだろうか。
藤本真也｜Silicon Valley Japan Lab Founder / Chief Strategist
米国在住25年以上。エンジニアと経営者の経験をもとに、シリコンバレーの技術動向と、日本企業への実務的な示唆を発信している。