ZOZOの服サイズ買い間違いをClaude Codeで解決した話【Chrome拡張・配布あり】

2026/5/27 ・なおき #開発ノート

この記事の初出は note です。

Chrome拡張は完全に初めて。Claude Codeに話しかけるだけで、ソースコードを読まずに動くものができたというお話です。

同じLサイズなのに、なぜ違う

去年の話。ZOZOTOWNであるブランドのTシャツを買ったら、Lサイズがぴったりだった。

気に入ったので同じブランドの別のTシャツもLで注文した。

届いて着てみたら……袖が長い。身幅もブカブカ。着丈もお尻が隠れるくらいある。前に買ったやつと全然違うやんけ。

「あー、サイズ表ちゃんと見比べてから買えばよかったなー」

…絶対また同じことをする。だって商品ページ開いてから「前のTシャツの肩幅って何センチだっけ」なんて覚えてないもん。

サイズ比較くん

ZOZOの商品ページを開くと、自動でこんなパネルが出てくる。

「ぴったりだった服」のサイズデータを登録しておくと、今見てる商品と自動で比べてくれる。

「この商品の肩幅は今持ってるやつとほぼ同じ、でも袖が2センチ短いな」みたいなことが、ページを開いた瞬間にわかる。

Amazonにも対応してる（商品によっては取得できないこともある）。表示はドラッグして好きな場所に移動させることもできるから、ZOZOの画面を邪魔しない。

初めてちゃんと動いたとき、「あ、これ欲しかったやつ！」と思った。 Tシャツだけじゃなく、パンツやワンピースなどもサイズ情報があれば対応できてることに気づいたときは感動した。（靴は現時点では対応してない）

1〜2時間。

「Chrome拡張とか絶対難しいやろー」って正直もっとかかるもんだと思ってた。

私はClaude Codeを仕事でふだんから使っていて、使い方には慣れていた。ただ、Chrome拡張を作ったことは一度もないし、コードを書くのは学生時代以来、20年近くブランクがある。いわゆる**【非エンジニア】**

やってみたら、コードが書けなくてもなんとかなった。Claude Codeが生成したコードの意味がわからなくてもなんとかなった。「動かない」「こんな画面になってる」ってスクリーンショットを見せながら伝えると、Claude Codeが原因を調べて次の手を教えてくれる。それだけ。頼りになる。

Claude Codeを使い慣れている人なら、同じように1〜2時間でできると思う。

もちろんスムーズにはいかない場面もあった。

ファイルを読み込んでZOZOを開いても、何も出てこない。「なんで？」と思いながらいろいろ試した。原因がわかったときは笑えた。まさかそんなところが間違ってたとは、という話を有料部分に書いた。

ほかにもドラッグで動かせないとか、サイズが自動で取れないとか、詰まった瞬間が3〜4回あった。でもまぁエラー画面のスクリーンショットを貼ってやり取りするだけで、原因を調べて直してくれる。

最初は「なんか解決方法ないかなー」ってぼんやり考えてた。メモアプリにサイズを記録しとくとか、スプレッドシートを使うとか。でも、商品見ながら別のアプリを開くのが面倒くさいし、どうせ記録したことすら忘れる。

「商品見てるそのページに、比較情報が出てくれたら一番いいのに」ずっとそう思ってた。ちょうどAmazonがセール始まるから見てたらKeepaというChrome拡張が目に止まった。

こういうやつね

「あーChrome拡張ねー」でも自分で作る方法はさっぱりわからない。Claude Codeに聞いてみようと思い立ったのが今朝の出来事。

こんな感じで話しかけた。

そのまま話した。技術的な言葉は一切なし。

するとClaude Codeから質問が来た。「お気に入りは1枚だけ保存したいですか、複数登録して切り替えたいですか」「商品ページを開いたとき自動で表示するか、ボタンを押したときだけにするか」「登録方法は商品ページからのボタンにするか、手動入力にするか」みたいな感じで。

「複数保存して選べるようにしたい」「自動で表示したい」「商品ページのボタンで登録したい」って答えていったら、実際のコードとファイル構成を作ってくれた。

え、もう？という感じだった。

有料部分では、

を書いています。が、ここまでの内容を見てClaude Codeに相談してもらえば似たようなものは作れると思います。