MENU

🍌 Banana Canvas🎨の使い方

  • URLをコピーしました!
目次

📌 Banana Canvasとは?

「🍌Banana Canvas🎨は、私(道草 雑草子)が開発した
「🍌Nano Banana Pro」 「API連携」を活用した
AI画像生成 無料Webアプリです。

※初回の無料枠を使い切った後は、APIの従量課金が必要になります。

複数の参照画像とスケッチを組み合わせて、あなたのイメージ通りのイラストを生成できます。
プログラミング知識は一切不要で、ブラウザ上で完結します。

🎯 こんな方におすすめ

  • イラスト制作の効率を上げたいクリエイター
  • ラフ画から完成度の高い作品を作りたい方
  • 複数の参照画像を組み合わせてオリジナル作品を作りたい方

✨ 主な特徴と出来ること

🎨 1. 色分けスケッチシステム

  • 4色の参照画像枠:異なる色で区別された4つの画像アップロード枠
  • 色連動ペンツール:スケッチペンの色が参照画像の枠の色と連動
  • 直感的な配置コントロール:ペンで描いた場所に、対応する色の参照画像の要素が配置される

🖼️ 2. 多彩な参照画像機能

🚨 入力してOKな元絵の条件

下記のどれかを満たしている画像のみの使用が安全

  1. 自分の著作物
    • 自分で描いたラフ・線画・完成イラスト
    • 自分で撮った写真(自撮り・風景など)
    • 仕事で“権利を全部譲渡していない”自分の制作物
  2. 利用条件がハッキリOKな素材
    • 利用規約に
      -「商用利用OK」
      -「トレスOK」
      -「AI処理・画像生成に使用OK」
      明示されている 素材集・ストック画像
    • 有料/無料のストックサイトで
      「再加工・再配布OK」「AIサービスでの利用OK」などの記載があるもの
  3. パブリックドメイン / CC0 など
    • 「著作権放棄」「CC0」「パブリックドメイン」などとハッキリ書かれている画像

【参考サイト】
<トレスフリー 素材提供サイト>
「POSE STUDIO」さん
https://pose.pompack.net/terms/
「素材POMPACK」/「@sozaiPOMPACK

❌ 入力しない方がいい元絵の典型例

  • pixiv・Twitter・Pinterest などに投稿されている 他人のイラストや写真(許可・ライセンス不明なもの)
  • アニメ・漫画・ゲーム・映画・写真集などの スクショやそのままの一コマ
  • 「トレスOK」とだけ書いてあっても
    商用利用やAI利用について何も書いていない素材 を案件・商品用に使うこと

※入力する画像と著作権についての法的な考え方はコチラの記事をご覧ください

🎛️ 3. 柔軟な要素抽出システム

参照画像から抽出できる要素をチェックボックスで個別ON/OFF:

  • 被写体のポーズ ※ほぼトレスになるので入力画像に注意
  • 色使い・ディテール ※全体的な塗り方や細部の描き方の参照
  • 服装 ※被写体の服装をほぼトレスになるので入力画像に注意
  • 髪型 ※被写体の髪型をほぼトレスになるので入力画像に注意
  • 画角・構図 ※ほぼトレスになるので入力画像に注意
  • 表情・感情 ※OFFにして「プロンプト指示」で別の表情に指定も可能
  • 背景 ※OFFにして「プロンプト指示」で別の背景に指定も可能
  • テキスト情報 ※参考画像のテキスト情報を除外したい時はOFFにする

→ ”必要な要素だけ”抽出して組み合わせ、理想の画像を生成!

🖌️ 4. インペイント機能

  • 生成後の画像ペンで加筆
  • 加筆した部分だけ再生成(インペイント)
  • 細かい調整が可能

📐 5. 出力設定

  • 縦横比の選択:1:1、16:9、9:16、4:3など
  • 解像度の指定:用途に合わせた画質設定
  • 背景調整オプション:背景の有無や透過設定

💬 6. プロンプト補強

  • 日本語でのテキスト入力で、さらに詳細な指示が可能
  • 画像だけでは伝えきれない要素補強や追加が可能

💾 7. ダウンロード機能

  • 個別ダウンロード:生成した画像を1枚ずつ保存
  • 一括ダウンロード:複数の画像をZIPファイルにまとめて保存

🍌 Banana Canvas🎨

色分けスケッチで自由に描く、あなた専用のAI画像生成キャンバス

\\👇Youtubeのライブ配信でも実演しています👇/

🎨 使い方の手順

📋 事前準備

1. Gemini APIキーの取得

  1. Google AI Studio にアクセス
  2. Googleアカウントでログイン
  3. 「Create API Key」をクリック
  4. APIキーをコピー

💡 ポイント:Gemini APIには無料枠があります。詳細は料金ページをご確認ください。

🎨 基本的な使い方

STEP 1:APIキーの設定

  1. Banana Canvasアプリを開く
  2. 「Enter your Gemini API key」にAPIキーを貼り付け
  3. 「Save API Key」をクリック

🔒 セキュリティ:APIキーはあなたのブラウザ(LocalStorage)にのみ保存され、
  サーバーには送信されません。

STEP 2:参照画像のアップロード

  1. 4つの色分けされた枠に、参考にしたい画像をアップロード
    • グリーン枠:例)キャラクターのポーズ参考
    • マゼンタ枠:例)服装デザイン参考
    •  シアン枠:例)背景参考
    • イエロー枠:例)色使い参考
  2. 要素抽出の設定
    • 各画像について、使いたい要素にチェック
    • 例:ポーズだけ使いたい → 「ポーズ」のみON

STEP 3:キャンバスにスケッチ

  1. 色分けペンツールを選択
  2. キャンバス上で、配置したい場所をスケッチ
    • グリーンペン:赤枠の参照画像の要素がここに配置される
    • マゼンタペン:青枠の参照画像の要素がここに配置される
    • (以下同様)
  3. 参考作品のアップロード(オプション)
    • キャンバスに直接、参考作品をアップロード可能
    • その作品の構図や雰囲気を参考にできる

STEP 4:プロンプト入力(オプション)

テキスト入力欄に、追加の指示を記入:

例:
- アニメ風のイラスト
- 柔らかい雰囲気
- 夕暮れの光

STEP 5:出力設定

  1. アスペクト比を選択
    • 1:1(正方形)
    • 16:9(横長)
    • 9:16(縦長)
    • 4:3(標準)
  2. 解像度を選択
    • 標準画質
    • 高画質
  3. 背景設定
    • 背景あり/なし
    • 透過背景(PNG)

STEP 6:生成

  1. 「生成」ボタンをクリック
  2. 数秒〜数十秒で画像が生成されます

STEP 7:インペイント(必要に応じて)

  1. 生成された画像上で、修正したい部分をペンで描く
  2. 「インペイント生成」をクリック
  3. その部分だけが再生成される

STEP 8:ダウンロード

  • 個別保存:各画像の「ダウンロード」ボタン
  • 一括保存:「ZIPでダウンロード」ボタン

🎓 活用テクニック

💡 テクニック1:レイヤー的な使い方

グリーン枠:キャラクター全身(ポーズのみ抽出)
マゼンタ枠:顔のアップ(表情のみ抽出)
シアン枠:服装デザイン(服装のみ抽出)
イエロー枠:背景写真(背景のみ抽出)
→ スケッチで配置を調整!

💡 テクニック2:ラフ画から完成絵へ

1. 自分で描いたラフ画をキャンバスにアップロード
2. 参照画像として、塗りや質感の参考作品を追加
3. ラフ画の構図を活かしつつ、高品質な完成絵を生成

💡 テクニック3:写真からイラスト化

1. 写真を参照画像に設定
2. 「構図」「色使い」のみ抽出
3. スケッチで配置を微調整
4. プロンプトで「アニメ風」「水彩画風」などスタイル指定

💡 テクニック4:複数パターンの量産

1. 同じ参照画像とスケッチで
2. プロンプトだけを変えて複数生成
3. 「笑顔」「怒り顔」「泣き顔」など表情バリエーション
4. ZIPで一括ダウンロード

⚠️ 重要な注意事項

🔒 セキュリティ

  • ✅ APIキーはブラウザにのみ保存:サーバーには送信されません
  • ✅ LocalStorageを使用:ブラウザを閉じても保存されます
  • ❌ プライベートモード注意:シークレットモードでは保存されない場合があります
  • ❌ APIキーの共有禁止:他人と共有しないでください

💰 API利用料金について

  • Banana Canvasアプリ自体:完全無料
  • Gemini API使用料:あなたのGoogleアカウントに直接請求
    • 無料枠:月に一定回数まで無料
    • 超過分:従量課金
    • 詳細:Google AI Pricing

💡 ヒント:無料枠内でもある程度生成できますが、API利用料金の発生にご注意ください!

🌐 動作環境

  • 推奨ブラウザ:Chrome、Edge、Safari(最新版)
  • 非推奨:Internet Explorer
  • デバイス:PC、タブレット、スマートフォン対応

🛠️ トラブルシューティング

❓ よくある質問

Q1: APIキーが保存されません

A1: 以下を確認してください:

  • ブラウザのCookieとLocalStorageが有効になっているか
  • プライベートモード(シークレットモード)を使用していないか
  • ブラウザの設定で、サイトのデータ保存が許可されているか

Q2: 画像生成に失敗します

A2: 考えられる原因:

  • APIキーが正しく入力されていない
  • Gemini APIの無料枠を超過している
  • ネットワーク接続が不安定
  • 参照画像のサイズが大きすぎる(推奨:5MB以下)

解決策:

  1. APIキーを再入力してみる
  2. Google AI Studioで使用状況を確認
  3. 参照画像のファイルサイズを小さくする

Q3: 生成された画像が思い通りにならない

A3: 改善のヒント:

  • 要素抽出を見直す:不要な要素のチェックを外す
  • プロンプトを追加:より具体的な指示を文章で補足
  • 参照画像を変更:よりイメージに近い画像を使用
  • スケッチを調整:配置を明確に描く

Q4: スマホでも使えますか?

A4: 恐らく使えます(検証不十分)

  • タッチ操作でスケッチ可能
  • ただし、細かい作業はPCやタブレット推奨
  • 画面サイズに応じて自動調整されます

Q5: 商用利用は可能ですか?

A5: 使用可能です

  • Banana Canvasアプリ:商用利用OK
  • 生成された画像:Google Gemini APIの利用規約に従います
  • 詳細はGemini API Termsをご確認ください

📜 免責事項

⚖️ サービス提供について

  1. 本アプリの提供形態
    • Banana Canvasは、Google AI StudioのBuild機能を使用して制作され、Google Cloud Run上でホスティングされている無料のWebアプリケーションです。
    • 本アプリは「現状有姿(As-Is)」で提供されており、特定の目的への適合性、正確性、完全性、有用性について、いかなる保証も行いません。
  2. サービスの継続性
    • 本アプリは、予告なく変更、中断、終了する場合があります。
    • サーバーメンテナンス、技術的障害、その他の理由により、一時的または恒久的にサービスが利用できなくなる可能性があります。
  3. 動作保証
    • すべてのブラウザ、デバイス、OSでの正常な動作を保証するものではありません。
    • ブラウザのバージョンや設定、拡張機能などにより、正常に動作しない場合があります。

💳 料金・課金について

  1. API使用料金
    • 本アプリの利用には、ユーザー自身のGemini APIキーが必要です。
    • API使用料金は、ユーザーのGoogleアカウントに直接請求されます。
    • アプリ運営者(道草 雑草子)は、ユーザーのAPI使用料金について一切の責任を負いません。
  2. 料金の予期せぬ発生
    • Gemini APIの無料枠を超過した場合、自動的に従量課金が発生します。
    • 予期しない高額請求を避けるため、Google Cloud Consoleで予算アラートの設定を強く推奨します。
    • API使用料金の詳細は、Google AI Pricingをご確認ください。
  3. 料金に関するトラブル
    • API使用料金に関するお問い合わせや紛争については、Google LLCに直接お問い合わせください。
    • アプリ運営者は、料金に関する一切の責任を負いません。

🔐 データ・プライバシーについて

  1. APIキーの管理
    • ユーザーが入力したAPIキーは、ブラウザのLocalStorageにのみ保存されます。
    • アプリ運営者のサーバーには、APIキーは一切送信・保存されません。
    • ただし、APIキーの漏洩、不正利用、紛失について、アプリ運営者は一切の責任を負いません。
    • APIキーの管理は、ユーザー自身の責任において行ってください。
  2. アップロードされた画像
    • ユーザーがアップロードした参照画像は、Gemini APIに送信されます。
    • 画像データの取り扱いについては、Google AI Studio Terms of Serviceに準じます。
    • 機密情報や個人情報を含む画像はアップロードしないでください。
  3. 生成された画像
    • 生成された画像は、ユーザーのブラウザ上にのみ表示されます。
    • アプリ運営者のサーバーには保存されません。
    • ただし、Gemini APIのログとして一定期間保存される可能性があります。
      詳細はGoogleのプライバシーポリシーをご確認ください。
  4. LocalStorageのデータ
    • ブラウザのLocalStorageに保存されたデータ(APIキーなど)は、
      ユーザー自身で管理する必要があります。
    • ブラウザのキャッシュクリアやデータ削除により、保存されたデータが失われる可能性があります。

📸 著作権・知的財産権について

  1. 参照画像の著作権
    • ユーザーがアップロードする参照画像について、適切な権利を有していることを確認してください。
    • 他者の著作物を無断で使用した場合、ユーザー自身が法的責任を負います。
    • アプリ運営者は、ユーザーがアップロードした画像の著作権について一切関知しません。
  2. 生成された画像の権利
    • 生成された画像の権利関係については、Gemini API Termsおよび各国の著作権法に従います。
    • 一般的に、AI生成画像の著作権は複雑であり、国や地域によって解釈が異なります。
    • 商用利用、再配布、二次創作を行う前に、必ず専門家にご相談ください。
  3. 本アプリの権利
    • Banana Canvasのコードおよびデザインの著作権は、道草 雑草子(みちくさ ざすこ)に帰属します。
    • ただしGoogle AI Studio Build機能により生成された部分についてはGoogleの利用規約が適用されます。

⚠️ 利用上の制限・禁止事項

以下の行為を禁止します:

  1. 違法行為
    • 法令に違反する目的での利用
    • 他者の権利(著作権、肖像権、プライバシー権など)を侵害する行為
  2. 不適切なコンテンツの生成
    • 暴力的、差別的、性的、または社会的に不適切な画像の生成
    • 児童ポルノ、リベンジポルノなど、違法なコンテンツの生成
  3. システムへの攻撃
    • 本アプリまたはGoogle Cloud Runへの不正アクセス、DoS攻撃
    • APIの不正利用、過度なリクエスト送信
  4. 商業的悪用
    • 本アプリを無断で再配布、販売する行為
    • 本アプリのコードを盗用し、類似サービスを提供する行為
  5. 他者への迷惑行為
    • 他者のAPIキーを不正に取得、使用する行為
    • 他者の名誉を毀損する画像の生成・配布

🚫 損害賠償の免責

  1. 直接損害
    • 本アプリの利用により生じた損害(データ損失、業務機会の喪失、API料金の発生など)について、
      アプリ運営者は一切の責任を負いません。
  2. 間接損害
    • 本アプリの利用に起因する間接的、派生的、特別な損害について、
      アプリ運営者は一切の責任を負いません。
  3. 第三者との紛争
    • 本アプリの利用に関連して、ユーザーと第三者との間で生じた紛争について、
      アプリ運営者は一切関与しません。
    • ユーザー自身の責任と費用において解決してください。
  4. Google LLCの責任
    • Gemini APIの障害、エラー、仕様変更により生じた損害について、
      アプリ運営者は一切の責任を負いません。
    • これらの問題については、Google LLCにお問い合わせください。

🔄 利用規約の変更

  1. 変更の権利
    • 本免責事項および利用規約は、予告なく変更される場合があります。
    • 変更後も本アプリを継続して利用した場合、変更内容に同意したものとみなします。
  2. 通知方法
    • 重要な変更については、本ブログまたはYouTubeチャンネルで告知します。
    • ユーザーは定期的に最新の規約を確認する責任があります。

🌍 準拠法・管轄裁判所

  1. 準拠法
    • 本免責事項および利用規約は、日本国法に準拠します。
  2. 管轄裁判所
    • 本アプリに関する紛争については、東京地方裁判所を第一審の専属的合意管轄裁判所とします。

✅ 利用同意

Banana Canvasを利用することで、上記の免責事項および利用規約に同意したものとみなされます。

同意できない場合は、本アプリの利用をお控えください。
※法的なアドバイスを求める場合は、専門の弁護士にご相談ください。

🔗 関連リンク

📞 お問い合わせ・サポート

💬 質問・要望

🐛 バグ報告

不具合を見つけた場合は、以下の情報と共にご連絡ください

  • 使用しているブラウザ
  • エラーメッセージ(あれば)
  • 再現手順

※ただし、個別の技術サポートは行っておりません。ご了承ください。

🎉 最後に

Banana Canvasは、あなたのクリエイティブな発想を形にするためのツールです。
参照画像とスケッチを組み合わせて、今までにない作品を生み出してください!

ただし、ご利用は自己責任でお願いします。m(__)m
上記の免責事項をよく読み、理解した上でご利用くださいませ。
さあ、キャンバスに描きましょう!🍌🎨


制作者:道草 雑草子(みちくさ ざすこ)
Youtubeチャンネル:AIみちくさチャンネル
技術:Google AI Studio Build / Nano Banana Pro API / Cloud Run

よかったらシェアしてください!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

zasuko 生成AI解説系 Vtuver

個人で Youtubeで生成系AIツールの解説動画を投稿しています。
創作活動をする方向けに私の学んだツールの活用方法などについて発信しつつ自主製作での、イラスト、動画、漫画、最終的にはゲーム開発などのコンテンツ制作を目指しています✨🌱✨

コメント

コメントする

目次