user【週刊】今日から始めるAI生活

Google AI Proの無料でもらえる$10クレジット、毎月消えていませんか？Claude Code × Nano Banana 2で有効活用して使い切る方法

Google AI Proの月額$10クレジット、使えていますか？放置すると毎月消えます。Claude CodeにNano Banana 2をMCPでつなげば、このクレジットで月150枚の画像生成が実質無料でできる。設定は一度だけ。2時間かけて壁を全部越えた記録を、そのまま書いた。API活用でClaude Codeをもう一段階ステップアップしましょう！
user
テツメモ｜tetumemo
2026/04/09

こんにちは！テツメモです。

突然ですが、こんなことに心当たりありませんか？　

「Google AI Proに加入しているのに、毎月$10クレジットが勝手についてきて、そのまま消えている」

「Claude Codeを使えるようになってきた。次はMCPを試したい。でも設定方法を調べたら、英語のドキュメントとJSONファイルが出てきて、そっ閉じした」

Untitled_Clipping_040826_035911_PM.jpg.webp

私もそうでした。ただ、簡単にできるかなと思って試してみたら、「今夜こそNano Banana 2を動かす」と意気込んでターミナルを開き、2時間後に「なぜClaude Code自体が起動しなくなっているんだ」と途方に暮れていました。

この記事は、試行錯誤の失敗談と成功の記録です。

Google AI Proの毎月$10クレジットを使って、Claude CodeからAPI経由で画像生成する。

記事のコンセプトはシンプルです。とはいえ、私のように非エンジニアだといろいろつまずいてしまい、もしかしたら本来なら5分〜10分で終わるはずの作業でも、次々に壁が立ちはだかりました。

具体的には、Windows環境の既知バグ、JSONファイルの文法エラー、モデル名のハードコード問題、課金構造の不透明さなどです。そうしたつまずきを赤裸々に、記事に書いていきます。

「簡単3ステップで設定完了！」という記事ではありません。同じ穴に落ちないよう、失敗の全記録と正解の手順を両方書きます。

記事の後半（有料エリア）では、$10クレジットが本当に適用されているかの確認方法、コスト計算、そして私が実際に使っているSkillsファイル「generate-images-v3」を丸ごと配布します。試行錯誤の末、最初は画像生成もうまくできず、画像を参照させても正しく扱えないなど、スムーズに進められませんでしたが、皆さんがつまずかないようにワークフローをスキルとして形にしました。

MCPをインストール後、このスキルを使えば、Claude Code×Nano Banana 2の画像生成もうまくいくはずです。このSkillsを導入すると、画像生成前の確認・1枚ずつの安全な生成・フォルダ整理・エラー時のリトライが自動化されます。

まずは正解の手順からお伝えします。失敗談はその後で。

ちなみに、以前紹介した記事ではGoogle Antigravityを使えばGeminiのサブスク内で画像生成もできますが、これはアスペクト比が1：1で固定されており非常に使い勝手が悪いです。その点、今回ご紹介するMCPなら確実にNano Banana 2のフル機能が使えますのでご安心ください。

🎙️ニュースレターの内容をAI音声でキャッチアップ！

記事の内容を、有料購読エリアの概要も含めて紹介しています。　

ぜひこちらも一緒にフォローしていただき、”ながら聴き”も楽しんでみてください♪

spotify show

🌱 なぜ今、これをやるのか ― Claude Codeから画像生成を体験する理由

Claude Codeが盛り上がっている。でも、少し疲れていませんか？

2026年に入ってから、Claude Codeに関する記事や動画が急増しています。このニュースレターでも何度か取り上げてきました。インストール方法、基本的な使い方、Skillsの活用術、CLAUDE.mdの書き方……ハウツー系の記事が増えるのは良いことですが、正直なところ、「また設定ですか」と少し疲れ気味な方もいるかもしれません。

※今年に入ってからの記事でClaude Code関連のSkillsを紹介しない方が少ないですよね

気持ちはわかります。私はXで頻繁に発信をする立場ですが…結構情報の内容が細分化してきている印象です。

結局、Claude Codeで色々なことができるようになり、非エンジニアの方も活用できるようになりました。これによって、営業職の方が業務を効率化したり、企画職の方がワークフローを刷新したり、あるいは事務関連の方が請求業務フローを外部のMCP（Model Context Protocol）と繋いだりといったことが可能になっています。

専門家がノウハウを提供しているため、専門知識がなくても高度な業務フローの効率化を実現できます。「試してみたいけれど、いざやるとなると何から手をつければいいか迷う」という方も多いでしょう。ブックマークした記事やNoteの情報をどう組み合わせればいいのか、私自身も含めて悩むところだと思います。

ですが、今日はその悩みは一旦置いておいて、新しい可能性を提案します。Claude Codeで記事を書いたりリサーチしたりするだけでなく、画像や動画といったクリエイティブな要素を取り入れてみるのはいかがでしょうか。

今回は、Claude Codeの中で画像を生成できるようにするスキルの設定方法をご紹介します。これができるようになると・・・

  1. 記事のリサーチから執筆までを行うスキルの中で、サムネイル用のプロンプトを生成させる
  2. そのプロンプトを、今回設定する画像生成スキルと組み合わせる
  3. Claude Code内でそのまま画像生成まで完結させる

このように、できることを一つ増やすことで、活用の幅はさらに広がります。例えば、今回のAPI設定を応用すれば、以下のような組み合わせも可能です。

(a) X（旧Twitter）のAPIから最新トレンド情報を取得する
(b) その情報を元に、Claude Code内でポスト案を作成する
(c) 今回のスキルで、そのポストに添える挿絵画像を生成する

また、少し話は変わりますが、Googleのサブスクリプション（Google One AI Premium等）を契約している方は、実は毎月10ドル分のクレジットが提供されています。しかし、「使い道がわからず放置している」という声もよく耳にします。

そこで今回は、Geminiの有料プラン等に入っている方のための活用法としても提案したいと考えています。

  1. 付与されている10ドルを「ムダ無く」活用する
  2. Claude Codeと組み合わせて画像生成を実現する
  3. 生成した画像を記事やSNSに活用する

これにより、実質無料で学びながら、Claude Codeでできることの幅を広げることを今回の目的にしています。

でも今回お伝えしたいのは、「もう一つの設定」ではなく、Claude Codeがようやく「使える」フェーズに入ってきた人が、次に感じるであろう壁と、それを乗り越えた先の景色についてです。

Claude Codeは文章を書ける。でも画像は作れない

Claude Codeが得意なのはテキスト処理です。記事の下書き、SNS投稿文の生成、要約、翻訳。日常的なコンテンツ制作の多くを担ってくれます。

ところが、ブログ記事を書いた後に「サムネイル画像を作りたい」となると、途端に話が変わります。Claudeは画像を生成できません。

そこで多くの方は、別のツールを開きます。Genspark、Felo、Gemini、Lovart……それぞれ優れたサービスですし、Nano Banana 2（Geminiベースの高性能画像生成モデル）を使っている方も多いと思います。でもその都度、別のサービスに切り替えて、プロンプトを入力して、画像を保存して、また戻ってくる。この往復作業、地味に手間がかかります…

という事で実際にClaudeで画像生成をやってみましょう！

💡各画像生成サービスの比較や、Nano Bananaのプロンプトも紹介　↓

「Claude Codeの中だけで完結する」体験を一度やってみよう

image.png.webp

※すべてClaude Code内で画像生成できました

今回試みるのはシンプルなことです。

記事を書く → Claude Codeの中で、そのまま画像も生成する。

APIとMCPという仕組みを使えば、Claude CodeからGoogleのNano Banana 2を呼び出して画像を生成できます。プロンプトをコピーして別タブに貼り付ける必要はありません。Claudeに「この記事のサムネイルを16:9で作って」と言えば、その場で生成して保存まで終わらせてくれます。

これを体験することには、2つの価値があります。

1つ目は、即効性のある便利さです。 記事制作のワークフローが1つのツールで完結するようになります。タブの切り替えが減り、画像の保存先を整理する手間が減ります。

2つ目は、「自動化への入口」としての経験値です。 API経由でツールを呼び出す感覚を一度掴むと、他のサービスをつなげるときのハードルが下がります。今日やることは「土台固め」ですが、この土台があって初めて、将来的な自動化ワークフローが動きます。

先に失敗しまくっておきました

正直に言います。この設定、すんなりはいきませんでした。私は非エンジニアだからです。
結構やるにしても、Claudeに「どういう手順なんですか」というふうなやり取りで聞きながら進めていきました。

多分エンジニアなら2、3分で終わる作業です。けど、この失敗は多分引っかかる人もいると思います。

ここを丁寧に紹介しますね。

具体的にはWindows環境特有のバグ、設定ファイルを壊してClaude Code自体が起動しなくなった経験、Claudeに質問したら間違った回答が返ってきて余計に混乱した話……。一人で試すと、同じ穴にはまって1〜2時間溶けてしまうかもしれません。

だから、私が先に全部失敗しておきました。

この記事は「設定が終わって動いた」記録であると同時に、「なぜそこで詰まるのか」の解説書です。順番通りに読めば、同じ穴には落ちないはずです。

今日は土台固めの記事です。丁寧にClaude Codeから画像生成できるように、一緒に進めていきましょう。

🧩 Claude Code × API × MCPって何？ ― 3つの関係をたとえ話で理解する

Untitled_Clipping_040826_114641_PM.jpg.webp

設定作業に入る前に、「そもそも何をしようとしているのか」を整理しておきましょう。Claude Codeは使い始めているけど、APIやMCPはよくわからない、という方に向けたセクションです。すでに概念がわかっている方は読み飛ばして次へ進んでください。

Claude Codeはできる人に頼める「指示係」

Claude Codeは、ターミナル（黒い画面）を通じてClaudeに直接作業を頼めるツールです。「このファイルを編集して」「フォルダを整理して」「コードを書いて」といった指示を言葉で伝えると、Claudeが実際にパソコン上で作業してくれます。 Claude Desktopの Claude Code を使ったり、あとは VS Code など IDE のツール（Antigravity も一緒ですけど）、そういったものの中に Claude Code の拡張機能があるので、それを使って使うことができますよね。

ただし、Claude Code単体で画像を生成する機能は持っていません。Claudeはあくまでテキストを処理するAIです。画像生成にはGoogleのNano Banana 2のような専用モデルが必要で、そこに橋をかけるのがAPIとMCPという仕組みです。

APIは「外部サービスへの注文口」

APIとは、外部のサービスに「お願い」を届けるための仕組みです。

レストランで料理を注文するとき、あなたは直接厨房には入れません。ウェイターが「お客さんの注文を厨房に伝え、料理を持ってくる」役割を果たします。このウェイターにあたるのがAPIです。

Gemini APIを使う場合も同じです。Claude Codeが「Googleの画像生成エンジンを使って、この内容の画像を作って」という指示を出すと、APIがGoogleのサーバーに届けて結果を返してくれます。Claude CodeはGoogleの中に入るわけではなく、注文を出しているだけです。

そして、このAPIを使うには「APIキー」が必要です。APIキーは会員証のようなもので、「誰がどのくらい使ったか」を管理するための識別番号です。発行は無料ですが、使った量に応じて料金が発生します。

MCPは「Claude Codeに外部ツールをつなぐコンセント」

MCP（Model Context Protocol）とは、Anthropicが2024年11月に発表した「AIと外部ツールをつなぐための共通規格」です。

以前は、Claude CodeにGitHubをつなぐには専用の配線が必要、画像生成ツールをつなぐにはまた別の配線が必要、という状態でした。MCPはこれを共通コンセントに統一した仕組みです。コンセントの形が決まれば、どんなツールでも同じ差し込み口で使えるようになります。

MCPを使ってClaude Codeにつなげられるツールは、現在1,000種類以上が公開されています。

できること

MCPの例

画像を生成する

Nano Banana MCP（今回使うもの）

Webページの内容を取得する

Fetch MCP

Googleカレンダーを操作する

Google Calendar MCP

7,000以上のアプリと連携する

Zapier MCP

ファイルを読み書きする

Filesystem MCP

今回私たちがやろうとしているのは、Nano Banana MCPをClaude Codeに接続して、APIキー経由でGoogleのNano Banana 2モデルを呼び出すことです。3つの概念が一本の線でつながりました。

💰 毎月消えている$10の話 ― Google AI Proの隠れた特典

Untitled_Clipping_040826_115240_PM.jpg.webp

概念がつかめたところで、もう一つ大事な話をしておきます。今回の設定を「やる理由」のもう半分、Google AI Proの$10クレジットについてです。

Google Developer Programという仕組み

Untitled_Clipping_040826_035911_PM.jpg.webp

Google AI Proに加入すると、「Google Developer Program Premium」という開発者向けプログラムに自動的に含まれます。このプログラムの特典として、毎月$10分のGoogle Cloud クレジット（日本円で約1,500円相当）が付与されます。

クレジットの正式名称は「$10の毎月の生成AIとCloudクレジット」。有効期限は翌月末で、使い残しは翌月に繰り越されません。毎月リセットされるため、使わなければそのまま消えます。

使える場所はどこか

このクレジットは「Google AI Studio、Vertex AI、または任意のGoogle Cloudプロダクト」と説明されています。

ただし、実際に使えるかどうかはアカウントの状態や設定によって異なる可能性があります。ネット上では「AI Studio経由では適用されない」という報告も見られます。

しかし私の環境では、AI Studioで発行したAPIキーを使ったNano Banana 2での画像生成費用が、このクレジットで完全に相殺されました。¥507分の使用に対して請求額は¥0でした（詳しくは有料エリアの第6章で）。

Untitled_Clipping_040826_045047_PM.jpg.webp

この記事のアプローチは「まず試してみて、課金画面で相殺されているかを自分の目で確認する」です。相殺されていれば実質無料で練習できる。されていなくても、どのくらい使ったかは画面で見えるので、止めるタイミングはわかります。

有効化されているか確認する方法

クレジットを使うには、Developer Programのページで請求先アカウントとの紐づけが必要です。

Google Developer ProgramのMy Benefitsページ

image.png.webp
申込済みの画面

（https://developers.google.com/program/my-benefits）にアクセスすると、特典一覧が表示されます。「$10の毎月の生成AIとCloudクレジット」という項目を見つけてください。

「請求先アカウントを選択」から自分のGoogle Cloudアカウントを選び、「常にこの請求先アカウントを使用する」にチェックを入れて申し込みます。

この紐づけをしていないと、クレジットは付与されていても使われません。意外と見落としやすい手順なので、次の章で一緒に設定します。

🔧 第1章：準備と環境設定 ― Claude Codeから画像生成できるまでの全手順

Untitled_Clipping_040826_114905_PM.jpg.webp

概念と$10クレジットの仕組みを理解したところで、実際に手を動かしましょう。この章では、Claude Codeの確認からAPIキーの取得、課金設定、予算アラートまで、最初から最後まで一気に通します。

準備するものは大きく5つです：

  1. Claude Codeがインストールされていること
  2. Node.js（v18以上）が動いていること
  3. Gemini APIキーが手元にあること
  4. Google Cloudの請求先アカウントが作成されていること
  5. Developer Programとの紐づけが完了していること

1つずつ確認しながら進めましょう。

ステップ1：Claude Codeのインストール確認

まず前提として、Claude Codeがインストールされている必要があります。まだの方は、PowerShellを開いて以下のコマンドを実行してください。

💡基本的に手順は記載しますが、Claude Codeは導入済みという想定で進めます。

irm https://claude.ai/install.ps1 | iex

このコマンドは「Claude Codeのインストールスクリプトをダウンロードして実行する」という意味です。インターネット経由でインストーラーを取ってきて、自動でセットアップしてくれます。

インストール完了後、バージョン確認をしてみましょう。

claude --version

バージョン番号が表示されればOKです。初回起動時にはブラウザが開いてAnthropicアカウントでのログインを求められるので、画面の指示に従ってください。

ステップ2：Node.jsの確認

Nano Banana 2のMCPサーバーはNode.jsというプログラムを使って動きます。インストールされているか確認しましょう。

node --version
npm --version
npx --version

3つとも数字が表示されればOK。もしNode.jsが入っていない場合は、公式サイト（https://nodejs.org/）から「LTS版」と書かれた安定版をダウンロードしてインストールしてください。

ステップ3：Google Cloudで請求先アカウントを作る

APIを有料プランで使うには、支払い情報を登録した「請求先アカウント」が必要です。$10クレジットが適用される場合は実際の請求は発生しませんが、登録しておかないとTier 1（有料枠）を使えません。

Untitled_Clipping_040826_051725_PM.jpg.webp
Google Cloud コンソール（https://console.cloud.google.com/billing）にアクセスします。「請求先アカウントを作成」から手順に従って進みます。

  • 名前：わかりやすい名前をつける（例：tetumemo AI）
  • 国：日本
  • 通貨：JPY（自動設定）
image.png.webp

クレジットカードを登録しますが、クレジットで相殺される範囲内では実際に引き落とされません。

ここで一点、重要なことがあります。

Google AI Proの$10クレジットを画像生成に充てたい場合、APIキーが紐づくプロジェクトの請求先アカウントが、Google Developer Programのクレジットを有効化したアカウントと同一である必要があります。

あたりまえですが、Gmailが一緒じゃないとダメってことです。

別の請求先アカウントを選んでしまうとクレジットが適用されません。次のステップで紐づけを行いますが、ここで作成したアカウントを使うよう注意してください。

ステップ4：Developer ProgramとGoogle Cloudを紐づける

Google Developer Program（https://developers.google.com/program/my-benefits）にアクセスし、「$10の毎月の生成AIとCloudクレジット」の項目を見つけます。

「請求先アカウントを選択」から、ステップ4で作った請求先アカウントを選んで申し込みます。「常にこの請求先アカウントを使用する」にチェックを入れると、毎月自動的にそのアカウントにクレジットが付与されます。

Untitled_Clipping_040826_052055_PM.jpg.webp

この紐づけが完了すると、毎月リセットされる$10クレジットが自動的に適用されるようになります。

ステップ5：Google AI StudioでAPIキーを取得する

Untitled_Clipping_040826_050813_PM.jpg.webp

次に、画像生成に使うGemini APIキーを取得します。Googleの画像生成機能を呼び出すための「会員証」にあたるものです。

Google AI Studioにアクセスしてください。Googleアカウントでログインすると、APIキーの管理画面が開きます。

「APIキーを作成」をクリックすると、プロジェクトの選択を求められますので、プロジェクトを作成しましょう。

Untitled_Clipping_040826_051022_PM.jpg.webp

プロジェクト名は何でも良いですが、わかりやすく「Nano Banana」にしました。

Untitled_Clipping_040826_051122_PM.jpg.webp

これでAPIキーの作成は完了です。次にお支払い情報を設定します。

Untitled_Clipping_040826_052524_PM.jpg.webp

Google Cloud側で設定した請求アカウントを選択します。

Untitled_Clipping_040826_052632_PM.jpg.webp

これで請求情報の紐づけが完了です。

Untitled_Clipping_040826_052719_PM.jpg.webp
Untitled_Clipping_040826_052810_PM.jpg.webp

発行されたAPIキーはメモ帳などに貼り付けておいてください。この後の設定で使います。

⚠️ APIキーは他人に見せないでください。 これを知っている人があなたのアカウントでAPIを使うことができ、費用が発生します。

念のため費用の上限を設定しておきましょう。

Untitled_Clipping_040826_053728_PM.jpg.webp
image.png.webp

これでGoogle AI Studio側の設定は完了です。

ステップ6：Google Cloudで予算アラートを設定する

最後に予算アラートを設定します。これは使用額が一定のラインを超えたときにメールで知らせてくれる仕組みです。

ひとつ重要なことを先に言います。予算アラートはAPIを自動で止めてくれません。

火災報知器が煙を感知して警報を鳴らすことはできますが、自動でスプリンクラーが動くわけではない、という感じです。「使いすぎを知らせてくれるが、止めるのは自分」です。

設定方法はこうです。

Google Cloud コンソール（https://console.cloud.google.com/billing）を開き、アカウント名をクリック　↓

Untitled_Clipping_040826_054119_PM.jpg.webp

自分の左メニューから「予算とアラート」を選択します。「予算を作成」をクリックして、以下の通りに設定します。

Untitled_Clipping_040826_054236_PM.jpg.webp
範囲の設定

Untitled_Clipping_040826_054316_PM.jpg.webp
  • 名前：AIクレジット監視（など、わかりやすい名前）
  • 期間：月別
  • サービス：すべてのサービス

金額の設定

Untitled_Clipping_040826_054337_PM.jpg.webp

  • 予算タイプ：指定額
  • 目標金額：¥1,500（$10クレジットの相当額）

しきい値の設定（通知のタイミング）

Untitled_Clipping_040826_054357_PM.jpg.webp

しきい値の設定イメージ　↓

しきい値

金額

意味

50%

¥750

半分使った

90%

¥1,350

あと少し

100%

¥1,500

使い切った

110%

¥1,650

超過した

「メール通知アラートを課金管理者とユーザーに送信する」にチェックを入れて保存します。

これでアラートが届いたら、使いすぎていないかGoogle AI Studioの利用額画面で確認する習慣をつけましょう。自動停止はしませんが、こまめに確認していれば予想外の請求にはなりにくいです。

以上で準備は完了です。Claude Codeがある、Node.jsがある、APIキーがある、請求先アカウントが設定済み、クレジットが紐づいている、予算アラートがセットされている。この6点が揃えば、次の章のMCP設定に進めます。

🤔 第2章：2つのMCP、どちらを選ぶべきか

Untitled_Clipping_040826_114944_PM.jpg.webp

準備が整ったら、いよいよMCPをClaude Codeに接続します。

実は、Nano Banana 2をClaude Codeで使うためのMCPサーバーは、GitHub上で主に2つ公開されています。

  1. ConechoAI版（@conechoai/nano-banana-mcp）
  2. daveremy版（@daveremy/nano-banana-2-mcp）

結論から言うと、今回は「daveremy版」を使いました。

最初はConechoAI版を試したのですが、Nano Banana 2への対応が不十分で、画像生成時にエラーが出てしまいました（この失敗談は後ほど詳しく書きます）。一方、daveremy版はNano Banana 2の機能（アスペクト比の指定やThinkingモードなど）にしっかり対応しており、ツールも豊富に用意されています。

daveremy版はConechoAI版をフォークして作られているので、ベースは同じ、Nano Banana 2の機能を拡充させた版という理解でOKです。

というわけで、ここからは「daveremy版」を正しく設定し、画像生成を成功させるまでの手順を解説します。

✅ 第3章：正解の手順 ― daveremy版MCPを設定して画像を生成する（Windows版）

これ、大前提としてここから紹介する設定方法は一例です。一番確実なのは、「daveremy版」のURLをClaudeに投げて、以下のように質問するだけでもOKです。

私はWindowsユーザーです。Claude CodeでNano Banana 2の画像生成をするためにdaveremyを導入して実現したいです。非エンジニア向けにステップバイステップでレクチャーしてください。
なおGeminiのAPIは取得済みです。

という指示をしようと思っているけど、指示で不足してる部分があればステップバイステップでユーザーに一問一答で確認して

実際に私も似たような指示から始まり、コツコツ実施して、失敗を重ねながらも成功した結果が次から説明する内容です。どちらを試してみても大丈夫ですので、お好みの方法で進めてください。

JSONファイルを直接編集する理由

daveremy版の公式ドキュメントを見ると、claude plugin add nano-banana-2-mcp というコマンドでインストールする方法が推奨されています。

しかし、今回はあえて「設定ファイル（JSON）を直接編集する」という少しアナログな方法をとります。理由は2つあります。

  1. 他の設定への影響を防ぐため：Claude Codeにお願いしてコマンドで自動設定させると、意図しない部分が書き換わってしまうリスクがあります。特に私のような非エンジニアの場合、どこがどのように変更されたのかの確認や修正が困難のため、自分の目で確認しながら、必要な部分だけを追記したいからです。
  2. セキュリティの観点：APIキーという重要な情報を、Claude Codeのチャット画面に直接貼り付けて設定させるのは、セキュリティ上おすすめできません。

少し手間に感じるかもしれませんが、確実で安全な方法で進めましょう。

※ただし、ここからの設定は自己責任でお願いします。記事内の情報だけで足りない場合はClaude等に確認しながら、ログやJSONファイルのBackupを取りながら進めるのが鉄則です。

ステップ0：設定ファイル（.claude.json）のBackupを取る

Untitled_Clipping_040826_063111_PM.jpg.webp

Claude Codeの設定は、ユーザーのホームディレクトリにある .claude.json という隠しファイルに保存されています。

Windowsの場合は、エクスプローラーのアドレスバーに %USERPROFILE% と入力してEnterを押すと、ホームディレクトリが開きます。その中にある .claude.json をまずはコピーしてBackupを取ってください。

設定を間違えるとClaude Codeが起動しなくなりますので、Backupは超重要です。

ステップ1：設定ファイル（.claude.json）を開く

image.png.webp
.claude.json をVSCodeやCursor、Google Antigravity、またはメモ帳などのテキストエディタで開いてください。

もしファイルが見つからない場合は、Claude Codeを一度起動して \exit で終了すると自動的に作成されます。

ステップ2：MCPサーバーの設定を追記する

開いた .claude.json ファイルに、daveremy版MCPの設定を追記します。

ファイルの中身は、ユーザーの環境によって色々書かれていますがあまり気にせず、一番下にスクロールします。

私の場合は最後の行が以下になっていました。

■最後の行：パターン①

 },
  "overageCreditUpsellSeenCount": 3
}

JSONのルールはシンプルで、「次の項目があるならカンマが必要、最後なら不要」 というだけです。

今回追加するMCPサーバーはこちら　↓

"mcpServers" {
    "nano-banana" {
      "command" "cmd",
      "args" [
        "/c",
        "npx",
        "-y",
        "nano-banana-2-mcp"
      ],
      "env" {
        "GEMINI_API_KEY" "ここにあなたのAPIキーを入れる"
      }
    }
  }

これをパターン①の文末に追加すると以下のとおりです。

JSONの文法ミスを防ぐため、「3 の後ろにカンマを足し、最後の } を mcpServers の後ろに持ってくる」のがポイントです。

以下のブロックを、そのままコピーして現在のファイルの最後の方と入れ替えてください。「ここにあなたのAPIキーを入れる」という部分には先ほどGoogle AI Studioで取得したAPIキーを入力してくださいね。

"overageCreditUpsellSeenCount" 3,
  "mcpServers" {
    "nano-banana" {
      "command" "cmd",
      "args" [
        "/c",
        "npx",
        "-y",
        "nano-banana-2-mcp"
      ],
      "env" {
        "GEMINI_API_KEY" "ここにあなたのAPIキーを入れる"
      }
    }
  }
}

これでMCPサーバーの設定は完了です。スムーズにエラーなければ、実はこれだけの簡単な作業なんです。

Untitled_Clipping_040826_083259_PM.jpg.webp

ただ、念のためJSONの最後の行が少し違うバージョンも例として置いておきます。

■最後の行：パターン②

{
  "companion" {
    "name" "Tremor",
    ...
  }

上記が最後の行の場合、MCPサーバーを追加すると以下のようになります。

{
  "companion" {
    "name" "Tremor",
    ...
  }, // ← ここにカンマが必要！
  "mcpServers" {
    "nano-banana" {
      "command" "cmd",
      "args" [
        "/c",
        "npx",
        "-y",
        "nano-banana-2-mcp"
      ],
      "env" {
        "GEMINI_API_KEY" "XXXX"
      }
    }
  }
} // ← 最後はカンマなし

いかがでしょうか？ちょっと専門的なコードをいじるのでドキドキすると思いますが、やってはいけないことなどを知っておくだけで容易にリカバリーできます。

本音を言うと、ここまで設定をシンプルに伝えられたのは私がメチャクチャ失敗して、Claudeに聞きまくったからなんですけどね。そのへんの失敗談は後半で紹介しますね。

⚠️ 注意：JSONファイルは、カンマ（,）や波括弧（{}）が1つ抜けるだけでエラーになり、Claude Code自体が起動しなくなります。貼り付けた後、括弧の対応が合っているかよく確認してください。

編集が終わったら、ファイルを上書き保存して閉じます。

ステップ3：Claude Codeを起動して確認する

設定が正しくできているか確認しましょう。ターミナル（PowerShellなど）を開き、以下のコマンドでClaude Codeを起動します。

claude

無事に起動したら、以下のコマンドを入力するか

/mcp

Claudeにこう聞いてみてください。

「現在利用可能なMCPツールを一覧で教えてください」

Untitled_Clipping_040826_083526_PM.jpg.webp

上記のように「nano-anana」が表示され、connectedとなっていれば完璧に成功しています！

ステップ4：いよいよ画像生成！

さあ、いよいよお楽しみの時間です。Claude Codeに画像を作ってもらいましょう。

「夕焼けの富士山の画像を2Kで生成して」

image.png.webp

※Google AntigravityのClaude Code拡張機能で実行

Claudeが「ツール generate_image を使用します」と考え始め、しばらくすると「画像を生成し、保存しました」と報告してくれます。保存先のパス（例：G:\マイドライブ\AI\generated_imgs\generated-2026-04-04T09-45-51-987Z-g6y1ld.jpg (2.8 MB)）も教えてくれるので、開いて確認してみてください。

image.png.webp

ちなみに、生成した画像を指定のフォルダに保存したい場合はパスで指定してあげるだけでOKです。

見事な画像が生成されていれば、すべての設定が完了です。お疲れ様でした！

🛠️ 第4章：daveremy版MCPでできること ― 5つのツールを使いこなす

Untitled_Clipping_040826_115009_PM.jpg.webp

無事に画像が生成できたところで、今回導入したdaveremy版MCPの機能について少し詳しく解説しておきます。

「画像を作るだけじゃないの？」と思うかもしれませんが、実はこのMCPには5つのツールが用意されており、かなり細かくNano Banana 2をコントロールできます。

自然言語で「◯◯して」とお願いしてもいいのですが、以下のコマンドをそのまま指示すれば確実に依頼どおりの動きをしてくれます。

1. generate_image（新規画像生成）

先ほど使った、ゼロから画像を作るメインのツールです。プロンプト（指示文）を渡すだけでなく、いくつかのオプションを指定できます。

  • アスペクト比の指定：16:9（横長）、9:16（縦長）、1:1（正方形）など、用途に合わせてサイズを変えられます。ブログのサムネイルなら16:9、スマホ向けなら9:16が便利です。
  • Thinkingモード：デフォルトは「minimal」ですが、「high」にすると思考モードに切り替わり、AIが「どう描けばプロンプトの意図を最もよく表現できるか」を深く考えてから生成してくれます。複雑な構図や、細部の描き込みが必要なときに威力を発揮します。
  • 生成枚数：一度に最大4枚まで生成できます。「とりあえず3パターン出して」といった指示が可能です。

2. edit_image（画像編集・参照）

すでに手元にある画像をベースにして、新しい画像を作るツールです。

例えば、「自分が描いたラフスケッチ」や「以前生成したキャラクターの画像」のファイルパスをClaudeに伝え、「この画像をベースに、背景を夜の街に変更して」と指示できます。

また「参照画像（Reference Image）」として使うことで、キャラクターの顔や雰囲気をある程度保ったまま、別のシチュエーションの画像を作りたいときに重宝します。

私の場合はキャラクターシートを参照させて図解をよく作るので、非常に頻繁に使うコマンドです。

画像

※私が作成したオリキャラ

こんな感じのポストを毎日投稿しています　↓

3. continue_editing（連続編集）

直前に生成・編集した画像を、さらに続けて編集するツールです。

「さっきの画像、すごく良いんだけど、もう少し明るくして」「背景の車を消して」といった微調整を、いちいち元の画像を指定し直すことなく、会話の続きとして指示できます。

4. get_configuration_status（設定確認）

現在のMCPの設定状態（APIキーが正しく読み込まれているかなど）を確認するツールです。エラーが出たとき、まずこれで設定が生きているかチェックします。

5. get_last_image_info（画像情報取得）

最後に生成した画像の情報を取得します。どこに保存されたか分からなくなったときなどに使います。

これら5つのツールが揃っているおかげで、Claude Codeのチャット画面から一歩も出ることなく、「生成 → 確認 → 微調整 → 保存」という一連のクリエイティブ作業が完結するわけです。

ワンポイントTip：最初は generate_image だけで十分です。慣れてきたら「この画像をベースにして」と edit_image を試してみてください。Claude Codeが立派なデザインアシスタントに進化します。

😤 第5章：私が踏んだ地雷の全記録 ― 同じ穴に落ちないために

Untitled_Clipping_040826_115039_PM.jpg.webp

ここまでで、正しい設定手順とMCPの機能を一通り説明しました。第3章の手順通りに進めれば、ほとんどの方はスムーズに画像生成まで到達できるはずです。

ただ、私はそのスムーズな道を通りませんでした。2時間かけて3つの壁に順番にぶつかりました。同じ穴に落ちる人を減らすために、失敗の全記録を残しておきます。

地雷①：claude mcp add コマンドがWindowsで動かない

Claude Codeには claude mcp add というコマンドがあり、これを使えばJSONファイルを手動で編集しなくてもMCPサーバーを追加できます。私はまずこれを試しました。

claude mcp add --scope user nano-banana -e GEMINI_API_KEY=AIzaSy●●● -- cmd /c npx -y nano-banana-2-mcp

Windows環境では npx を直接実行できないケースがあるため、cmd /c を挟むのが作法です。

「unknown option '-y'」の衝撃

Enterキーを押した瞬間、こんなエラーが返ってきました。

Error unknown option '-y'

-y はnpxのオプションで「インストール確認をスキップする」という意味です。

本来は cmd /c npx -y nano-banana-2-mcp という文字列がそのままコマンドとして渡されるべきなのに、Claude Code自身が -y を自分へのオプションだと誤解してエラーを出しているのです。

これはWindows版Claude Codeの既知のバグということが調べてわかりました。GitHubのIssue（https://github.com/anthropics/claude-code/issues/3369）にも報告があり、-- の後に - で始まる引数を含めるとCLIが誤認するという問題です。

このエラーも自分で調べたのではなくClaudeが教えてくれました。

「claude mcp add-json」も試したが…

回避策として claude mcp add-json というコマンドも試しました。JSONを直接文字列として渡す方法です。

claude mcp add-json nano-banana --scope user '{"command":"cmd","args":["/c","npx","-y","nano-banana-2-mcp"],"env":{"GEMINI_API_KEY":"AIzaSy●●●"}}'

しかし今度はPowerShellのJSONエスケープ問題に引っかかりました。

PowerShellではシングルクォートの中のダブルクォートが特殊な扱いを受けるケースがあり、渡されたJSONが壊れた状態でClaude Codeに届いてしまいます。

Windows PowerShell環境では、claude mcp add 系のコマンドでNano Banana 2を追加する方法はどれも使えないという結論に至りました。ここで30分以上を消費しましたね。

これ、結構あるあるなのですが、GitHubで公開されている情報のメインはMacやLinux環境での設定方法が掲載されていることが多いです。そのため、私のようなWindows環境の人がそのままトライするとドツボにハマります。

💡 この章の教訓：Windows環境では claude mcp add コマンドに既知のバグがある。設定ファイルの直接編集が最も確実。

地雷②：JSONファイルを壊してClaude Codeが起動不能に

claude mcp add が使えないとわかったので、次に.claude.jsonを直接編集する方法を試みました。ここでも失敗しました。

Untitled_Clipping_040826_063111_PM.jpg.webp

Claude Codeの設定は2つの場所に分かれています。ここが非常にわかりにくいポイントです。

C\Users\<ユーザー名>\
├── .claude.json          ← MCPサーバー設定（このファイルを編集する）
├── .claude\              ← Claude Code本体の設定フォルダ（別物）
│   ├── settings.json
│   └── CLAUDE.md

.claude.json（ファイル）と .claude\`（フォルダ）。名前が酷似していますが全くの別物です。MCPサーバーの設定は.claude.json` というファイルの方に書きます。フォルダの方ではありません。

ここで私は最初の失敗をしました。バックアップを取らずに編集を始めてしまったのです。「ちょっと追記するだけだし大丈夫だろう」という油断です。

最初の試みでは、mcpServers ブロックをファイルの一番下に追記したのですが、既存の } を消さずに新しいJSONオブジェクトを丸ごと貼り付けてしまいました。結果、1つのファイルの中に2つのJSONオブジェクトが連結された状態になりました。

 "overageCreditUpsellSeenCount": 2
}
{
  "mcpServers": {
    "nano-banana": {
      ...
    }
  }
}

JSONは1つのファイルに2つのルートオブジェクトを持てません。このファイルを保存してClaude Codeを起動しようとしたところ、Claude Codeが起動しなくなりました。

Untitled_Clipping_040826_094340_PM.jpg.webp

ClaudeのWeb版を開き、JSONのスクショを渡して状況を伝えると、こう指示されました。

「ファイルの末尾に余計なJSONブロックが追加されていると思います。メモ帳で開いて、2つ目の { から最後までを削除してください。」

メモ帳で開くと、確かに2つのJSONオブジェクトが並んでいました。さらにMCPの情報を追加したのに直前のJSONの末尾にカンマを1つ足していなかったのも原因ですね。

後半を削除してClaude Codeを起動すると、無事に復活。ここで初めてバックアップの大切さを痛感し、即座に取りました。

閉じブレースの数で混乱

次はバックアップを取った上で再挑戦。今度は正しい位置に挿入しようとしましたが、ここでまた問題が発生しました。

.claude.json の構造は入れ子になっていて、companion オブジェクトの閉じ }、その外側の閉じ }、ファイル全体の閉じ } と、複数の閉じブレースが連なっています。どの階層に入れるべきかがわかりにくいのです。

Claudeに「閉じブレースは4つでいいの？さっきは5つだったよ」と聞くと、「正しくは4つです」と返ってきました。しかし実際に4つにするとまたJSONが壊れました。正解は元のファイル構造に依存するので、Claudeの回答を鵜呑みにはできません。

💡 Claudeは設定ファイルの中身を直接見ているわけではない。ファイルの実際の構造を自分の目で確認してから編集すること。

最も安全な方法はこうでした。

Claudeにファイルの末尾30行を表示して実際の構造を確認してもらい、最後の } の直前の行にカンマを追加、その下に mcpServers ブロックを挿入する。そしてファイル全体の最後が1つの } で閉じていることを目視確認する。

もし途中でわからなくなったら、バックアップから復元してやり直せます。

地雷③：ConechoAI版を先に試したらモデル名エラーが出た

実は、nano-banana-2-mcp（daveremy版）にたどり着く前に、まず別のパッケージを試していました。オリジナルの nano-banana-mcp（ConechoAI版）です。

.claude.json に設定を書き、Claude Codeを起動し、/mcp コマンドで接続を確認。nano-banana が connected と表示されたので画像生成を試みると、こんなエラーが返ってきました。

MCP error -32603 model 'gemini-2.5-flash-image-preview' not found (404)

gemini-2.5-flash-image-preview？私が環境変数で gemini-3.1-flash-image-preview を指定しているのに、旧モデル名でリクエストが飛んでいます。

ConechoAI版の nano-banana-mcp はコード内部にモデル名がハードコードされており、環境変数 NANO_BANANA_MODEL を設定しても無視されるという問題がありました。GitHubのREADMEに環境変数の記載はあるのですが、実際のコードでは使われていない。READMEと実装が乖離しているパターンです。

これら3つの地雷を全部踏んだ結果、最終的にdaveremy版MCPで画像生成に成功するまでに2時間かかりました。第3章の手順を最初から使えば、同じ穴には落ちないはずです。

ワンポイントTip：失敗談の中で一番大事な教訓は「.claude.json を編集する前に必ずバックアップを取る」です。これだけは絶対に守ってください。

🎉 第6章：実際に使い始めて気づくこと ― 初回許可・保存先・言語設定

第3章の手順で画像生成に成功した後、実際に使い始めるといくつか気になることが出てきます。この第6章では、初回起動時の許可ダイアログ、画像の保存先の確認、日本語設定など、知っておくと少し楽になる小ネタをまとめておきます。

初回起動時の許可ダイアログ

CLAUDE.mdの設定にもよりますが、初回はMCPツールの使用許可を求めるダイアログが表示されます。

「May we use nano-banana's generate_image tool?」と聞かれ、選択肢が3つ表示されます。

1を選ぶと今回だけ許可。2を選ぶと今後同じツールを永続的に許可。 3は拒否です。信頼できるMCPサーバーであれば2で永続許可して問題ありません。毎回確認が入るのは煩わしいので、2がおすすめです。

許可するとClaudeがプロンプトを英語に変換し、Nano Banana 2のAPIを呼び出します。処理には数十秒かかります。成功すると生成された画像のファイルパスが表示されます。

生成完了 C\Users\●●●\Documents\nano-banana-images\generated-2026-04-04T23-15-00-abc123.png

WindowsのエクスプローラーやCursor、Google Antigravity等の画面ででこのフォルダを開くと、生成された画像が保存されています。

image.png.webp

※Google Antigravity内で生成画像を確認しました

保存先の確認

daveremy版の画像保存先はデフォルトでこちらです。（ユーザーによって変わる場合もあります。）

Windowsの場合：C:\Users\<ユーザー名>\Documents\nano-banana-images\

PowerShellで確認する場合はこちらのコマンドです。

dir "$envUSERPROFILE\Documents\nano-banana-images"

保存先はClaude Codeにお願いして変更してもらってもよいです。

🚀ここからのコンテンツ： もっとスムーズに生成したい、という次の欲求

image.png.webp

ここまでで、Claude CodeからNano Banana 2で画像を生成する環境が整いました。しかし実際に使い始めると、いくつかの問題に遭遇しました。

複数枚を一気に頼むとエラーになる。 Nano Banana 2のAPIは複数のリクエストを同時に受け付けるとエラーが頻発します。6枚並列で依頼したら4枚失敗した、というのが私の実体験です。

保存先のフォルダがバラバラになる。 毎回 Documents\nano-banana-images に全部放り込まれるため、プロジェクト別に整理したい場合は自分で移動する手間がかかります。

解像度やアスペクト比を毎回指定するのが面倒。 ブログ用は16:9、SNS用は1:1、といった使い分けを毎回プロンプトに書くのは地味に手間です。

参照画像を使ったキャラクター一貫性のある生成に失敗。 オリジナルキャラクターを複数のシーンで参照させたい時、確実に参照されない時がありました。これはオリキャラを使う私にとっては大問題です。

edited-2026-04-06T18-36-04-747Z-ez7hui.jpg.webp

※こちらはオリキャラを参照させて生成した成功バージョンの画像です

一方で、最初はオリキャラをうまく参照してくれず、以下のような画像が生成されました。

generated-2026-04-06T17-33-28-231Z-km8y91.jpg.webp

※オリキャラが参照されない

edited-2026-04-06T18-04-44-399Z-hwse0k.jpg.webp

※オリキャラを参照せず、画像を読み取って雰囲気をプロンプトで渡してごまかされた

これらをまとめて解決するのが、Claude Codeの「Skills」という仕組みです。

Skillsとは、Claudeに特定のタスクの実行手順を事前に教えておく仕組みです。マークダウン形式のファイルに手順やルールを書いておくと、Claudeがそれを読み込んでその通りに動いてくれます。

私が実際に使っているSkills「generate-images-v3」では、こんなことが自動化されています。

Untitled_Clipping_040826_101912_PM.jpg.webp
Untitled_Clipping_040826_101927_PM.jpg.webp

生成前に保存フォルダ名・アスペクト比・解像度を対話形式で確認

  • 画像は1枚ずつ順番に生成（並列処理によるエラーを防止）
  • 生成のたびに「○枚目（全△枚）生成中...」と進捗を報告
  • 参照画像を使ったキャラクター一貫性のある生成に対応
  • エラー時に自動リトライ、それでもダメなら日本語で報告

このSkillsファイルの使い方・配置方法・3つのパターン別の実践ガイドは、有料エリアの第8章で丸ごと公開しています。

それから「Skills」を手にすることで、様々なワークフローにも組み合わせることが可能です。私が何度も試行錯誤を提供している複数コンテンツを一気に生成するコンテンツ工場のSkillsですが、そこに今回紹介するSkillsを組み合わせることで、「調査→記事生成→サムネプロンプト生成→画像生成」という流れを一気通貫で実行できるようになります。

ここまでが無料エリアです。

有料エリアでは以下の内容をお届けします。

  • 第7章：$10クレジットは本当に適用されているか？4つの課金画面の読み方
  • 第8章：1枚あたりのコスト計算と、月に何枚生成できるかの試算。上限設定の方法
  • 第9章：generate-images-v3 完全ガイド。Skillsの構造・3パターンの使い方・ダウンロードリンク
  • 終章：MCPを使いこなすための3つの教訓 ＋ クイックリファレンス

ぜひ私が経験した失敗という”時間”を解決し、画像生成を効率よく進められる「Skills」を手に入れて快適にClaude Code×API×Nano Banana 2の組み合わせをお楽しみください。

📝 発行者

📝テツメモ｜tetumemo（Xアカウント）

📝テツメモ｜tetumemo（Xのハイライト）

📝テツメモ｜tetumemo（リンク集）

🎤Spotify：AI QUEST（今日から始めるAI生活）

🎤Apple Podcasts：AI QUEST（今日から始めるAI生活）

📹️YouTube：AI QUEST（今日から始めるAI生活）
📝noteでも、たまにAIなどの記事を書いています。

🎟️お得な招待コード

💡Manus（1,000クレジットが獲得できる限定招待コード）

💡AIエージェント「Felo」（月額100円引きの招待コード）

💡Perplexity Pro（初月10ドルの招待コード）

💡Genspark

💡Lovartの招待コード

💡LilysAI（7日間有料プランが使える招待コード）

💡YouWare（アプリを作ってUPして稼ぐ新しい仕組み）

💡リアルタイム翻訳「Felo字幕」（15分無料で試せる招待コード）

💡便利なAI音声入力ツール「Typeless」（5ドルのクレジットがもらえます）

ここから先は有料コンテンツです
この続き：8,107文字 / 画像15枚
2026年04月のバックナンバー
¥1,176 / 税込み
収録されている記事
¥980 / 月額 (税込み)
購読を開始すると有料記事が閲覧できるようになります。バックナンバーは別途購入が必要です。
今月の記事

7,100人以上の方達が購読中

いつでも購読解除可能です

PREVIOUS
【6つの要約記事がXで数万imp達成！】ネタ収集ゼロ・執筆5分はそのまま、品質だけ4段階上がった。X記事生成スキルv8と改善版を配布します
NEXT
【基礎編】これチート級。Claude×NotebookLMで「トークン消費1/10」を実現するための全手順