ゲーム進行ダッシュボードを作った
2026 5 3Tag : Chrome Extension , Claude , サイドプロジェクト , ゲーム
複数のゲームを掛け持ちしていると、それぞれの進行状況を忘れることが多い。どこまでクリアしたっけ、このアイテムはどうやって入手するんだっけ、といったことが。それを一目で確認できるツールがあればいいと思って、自分で作ってみた。
最初のアイデア
最初はシンプルに考えた。ウェブページを一つ作って、左側にiframeで攻略サイトを表示し、右側にメモやブックマークのメニューを置く方式で。最初からClaudeと一緒に作っていて、とりあえず動くところまでは作った。
ただ実際に使ってみると、思った通りにならなかった。iframeで表示できないサイトが想像以上に多かった。攻略サイトやWikiはほとんどiframeの埋め込みをブロックしていた。
改善しながら方向が変わった
うまくいかない部分をClaudeに改めて説明しながら、自分が本当に欲しいものを整理して伝えた。iframeの中でサイトを見たいわけじゃなくて、ゲームの攻略サイトを見ながら同時に自分のメモやブックマークを横に置いておきたい、と。
そうしたら、ChromeのサイドパネルのAPIを使った拡張機能として作れば実現できると分かった。ブラウザの右側にパネルを固定して、どのタブを開いていても自分のメニューを常に表示できる方式だ。
自分が欲しいものを正確に整理して伝えたとき、初めて正しい解決策が出てきた。これが今回の作業で一番大きく感じたことだ。
以前失敗したChrome拡張機能
実はChrome拡張機能は以前にも一度作ろうとして諦めたことがある。当時は開発の仕組みを理解すること自体が複雑すぎると感じていた。
今回はClaudeの力を借りればなんとかなるだろうという気持ちで始めた。結果は成功だった。コードを一行一行理解しながら書いたわけじゃないけど、欲しい機能を説明するとClaudeが実装してくれて、うまくいかない部分は一緒にデバッグした。
完成したもの
Chromeのサイドパネルで動作する拡張機能だ。ゲームの攻略サイトを見ながら、チートコードや重要な情報をブックマークとして保存しておいて取り出せる。Obsidianで管理しているゲームノートとも連携している。
完全に自分用に作ったものなので公開するつもりはないけど、ずっと欲しいと思っていたものが完成したので、かなり達成感があった。
まとめ
今回改めて感じたのは、自分が何を欲しいのかを正確に把握することが一番大事だということだ。最初にiframe方式にこだわっていたときはずっと行き詰まっていたけど、本当に欲しいものを明確にしたら解決策が自然に出てきた。
AIがコードを書いてくれることより、自分が何を欲しいのかを話しながら一緒に整理していくプロセス自体がかなり有用だった。