Nano Banana ゲームデザイン実践:UIアイコン&実績バッジ量産テンプレート10選 (Iconography & UI Assets)
Nano Banana ゲームデザインシリーズ:
UIデザイナーにとっての悪夢は、1つの美しいアイコンを描くことではなく、50個のスタイルが統一されたスキルアイコンやインベントリアイテムを描くことです。本チュートリアルは、Nano Bananaをあなたの「アイコン量産工場」に変えます。「グリッド配列 (Array Grid)」 と 「スタイルアンカー (Style Anchoring)」 技術を使用することで、RPGのスキルアイコン全セット、高品質なアイテム素材、ランク別実績バッジを一度に生成することができます。
01. 核となるロジック:メタプロンプト解析
アイコン生成の鍵は**「一貫性 (Consistency)」と「切り抜きやすさ (Isolation)」**です。モデルに対して、特定の形状仕様(角丸長方形など)と統一された背景に従うよう強制する必要があります。
メタプロンプト (Meta Prompt):
Prompt (英語):
Create a set of [Number] Game/App Icons for [Theme].
Layout: Arranged in a strict Grid Layout (e.g., 4x4) with consistent spacing.
Frame: [Shape: Rounded Rectangle / Circle / Shield-shape].
Style: [Art Style: Skeuomorphic / Flat Vector / Neon / Pixel].
Background: Solid [Color] background for easy masking.
Content: High readability, strong silhouette, distinctive colors.
(解析:**"Strict Grid Layout"* は、アイコン同士の重なりを防ぐ量産の核心です。"Solid Background"(純黒やマゼンタなど)は、後工程でのワンクリック自動選択切り抜きを保証します。)*
02. 徹底実践:厳選UIシナリオ10選 (10 Cases)
1. RPG 元素魔法スキルアイコン (Magic Skill Icons)

Prompt (日本語):
RPGの元素魔法スキルアイコンセットを作成。16個のアイコンを含む。
レイアウト:4x4のグリッド配列。
フレーム:装飾的な金の縁取りがある暗い正方形のタイル。
スタイル:精巧な手描きデジタルアートスタイル、魔法の輝き (Glow effects) を強調。
内容:火の玉、氷の破片、落雷、癒しの光、盾、影の呪い、風の刃、流星群など。各アイコンは明確な色テーマを持つ。
Prompt (英語):
Create a set of RPG Elemental Magic Skill Icons containing 16 icons.
Layout: 4x4 grid arrangement.
Frame: Dark square tiles with ornate gold borders.
Style: Exquisite hand-painted digital art style, emphasizing magical Glow effects.
Content: Fireball, Ice Shard, Lightning Strike, Healing Light, Shield, Shadow Curse, Wind Blade, Meteor Shower, etc. Each icon has a distinct color theme.
- 実践解説: 典型的なMMO/RPGの要件です。**「枠線」と「内部の発光」**のコントラストにより、UIバーの中で視認性が高まります。
2. カジュアルマッチ3ゲームの資源アイコン (Casual Game Currency)

Prompt (日本語):
カジュアルなマッチ3モバイルゲームの資源/通貨アイコンセットを作成。
レイアウト:3x3のグリッド、純白の背景。
スタイル:3Dレンダースタイル、ジューシーで光沢のあるゼリーの質感、高彩度、キャンディのように美味しそうに見える。
内容:金貨(積み上げ)、ピンクのダイヤモンド、エネルギーの稲妻、赤いハートのライフ、爆弾パワーアップ、虹色のハンマー、無限時間の砂時計。
Prompt (英語):
Create a set of Casual Match-3 Mobile Game Resource/Currency Icons.
Layout: 3x3 grid, pure white background.
Style: 3D render style, Juicy/Glossy jelly texture, high saturation, looking appetizing like candy.
Content: Gold coins (stacked), Pink diamonds, Energy bolts, Red heart lives, Bomb power-ups, Rainbow hammers, Infinite time hourglass.
- 実践解説: カジュアルゲームの核心は**「ジューシーさ (Juiciness)」**です。反射とハイライトを強調して、クリックしたくなる欲求を高めます。
3. FPS キルフィード/HUDアイコン (Kill Feed / HUD Icons)

Prompt (日本語):
FPSシューターのHUDキルフィード(撃破ログ)アイコンセットを作成。
レイアウト:水平またはグリッド配列、純黒の背景。
スタイル:ミニマリストなフラットホワイトのベクターシルエット、詳細なし、高い視認性。
内容:アサルトライフルの側面図、スナイパーライフル、手榴弾、近接ナイフ、ヘッドショットのドクロマーク、車両衝突マーク、落下ダメージマーク。
Prompt (英語):
Create a set of FPS Shooter HUD Kill Feed Icons.
Layout: Horizontal or grid arrangement, pure black background.
Style: Minimalist Flat White Vector Silhouettes, no details, high readability.
Content: Assault rifle side profile, Sniper rifle, Grenade, Melee knife, Headshot skull symbol, Vehicle impact symbol, Fall damage symbol.
- 実践解説: 鍵となるのは**「シルエット」**です。白いシルエットはゲームエンジン内で自由に着色(ティント)できるため、最も実用的なアセット形式です。
4. SFサバイバル ステータスアイコン (Status Effects)

Prompt (日本語):
ハードコアSFサバイバルゲームのステータス効果アイコン(バフ/デバフ)セットを作成。
レイアウト:4x4のグリッド。
スタイル:ホログラフィックHUDスタイル、シアンと警告色の赤の配色、半透明のテック感。
形状:六角形のハニカムボーダー。
内容:放射線中毒(バイオハザード記号)、低重力、酸素不足、低体温症(雪の結晶)、骨折、重量超過、ステルスモード。
Prompt (英語):
Create a set of Hardcore Sci-Fi Survival Status Effect Icons (Buffs/Debuffs).
Layout: 4x4 grid.
Style: Holographic HUD style, Cyan and Alert Red color scheme, translucent tech vibe.
Shape: Hexagonal honeycomb borders.
Content: Radiation poisoning (Biohazard symbol), Low gravity, Low oxygen, Hypothermia (Snowflake), Bone fracture, Overencumbered, Stealth mode.
- 実践解説: SF UIは**「六角形」と「ホログラムカラー」**と不可分です。画面の隅に表示するのに適しています。
5. リアルなインベントリ食品アイコン (Realistic Inventory Food)

Prompt (日本語):
リアルなサバイバルゲームのインベントリ用食品アイコンセットを作成。
レイアウト:グリッド配列、灰色の背景。
スタイル:超リアルなスキューモーフィック(擬似実物)デザイン、詳細なテクスチャ、食べられそうに見える。
内容:錆びたスパム缶(半開き)、カビの生えたパン、きれいな水筒、焼いたウサギの脚、赤いリンゴ、圧縮ビスケットのパック。
Prompt (英語):
Create a set of Realistic Survival Inventory Food Icons.
Layout: Grid arrangement, grey background.
Style: Hyper-realistic Skeuomorphic, detailed textures, looking edible.
Content: Rusty spam can (half open), Moldy bread, Clean water bottle, Roasted rabbit leg, Red apple, Pack of compressed biscuits.
- 実践解説: タルコフやDayZのようなゲームでは、没入感を高めるために、このような**「薄汚れた」**しかしリアルなアイコンが必要です。
6. ランクティアバッジ (Ranked Badges)

Prompt (日本語):
競技ゲームのランクティアバッジセットを作成。低ランクから高ランクへの進化を示す。
レイアウト:横並び、計7個のバッジ。
スタイル:宝石が埋め込まれた金属的なエンボススタイル。
内容:ブロンズ(粗い)、シルバー(磨かれた)、ゴールド(装飾的)、プラチナ(サファイア付き)、ダイアモンド(結晶質)、マスター(紫のオーラ)、グランドマスター(炎のような複雑な紋章)。
Prompt (英語):
Create a set of Competitive Ranked Tier Badges, showing evolution from low to high.
Layout: Horizontal arrangement, total 7 badges.
Style: Metallic embossed style with gem inlays.
Content: Bronze (rough), Silver (polished), Gold (ornate), Platinum (with sapphire), Diamond (crystalline), Master (purple aura), Grandmaster (fiery complex crest).
- 実践解説: バッジデザインの課題は**「階層性」**です。材質(粗野→結晶)とエフェクト(なし→炎)を通じて価値を定義します。
7. モダン iOS タブバーアイコン (Tab Bar Icons)

Prompt (日本語):
モダンなiOSスタイルのアプリタブバーアイコンセットを作成。
レイアウト:2行配列。上段はラインアイコン(アウトライン)、下段は同じ内容の塗りつぶしアイコン(アクティブ状態)。
スタイル:Apple SF Symbolsスタイル、丸みを帯びたストローク、ミニマリスト、モノクロ黒。
内容:ホーム(家)、発見(コンパス)、メッセージ(吹き出し)、カート(バッグ)、プロフィール(人型)。
Prompt (英語):
Create a set of Modern iOS style App Tab Bar Icons.
Layout: Two rows: Top row is Line icons (Outlined), Bottom row is Filled icons (Active state) of the same content.
Style: Apple SF Symbols style, rounded strokes, minimalist, monochrome black.
Content: Home (House), Discover (Compass), Message (Bubble), Cart (Bag), Profile (Person).
- 実践解説: UIデザイナーには、単なるアイコンではなく、**「アクティブ」対「非アクティブ」**状態のペアが必要です。
8. TCG 属性シンボル (TCG Attribute Symbols)

Prompt (日本語):
トレーディングカードゲーム (TCG) の属性シンボルアイコンセットを作成。
レイアウト:円形アイコンの配列、透明背景。
スタイル:シンプルなグラデーションを用いたベクターグラフィックデザイン。ハースストーンやMTGのマナシンボルに似ている。
内容:水滴(青)、炎(オレンジ)、葉(緑)、ドクロ(黒)、太陽(黄)、星(無色)。
Prompt (英語):
Create a set of TCG (Trading Card Game) Attribute Symbol Icons.
Layout: Circular icon array, transparent background.
Style: Vector graphic design with simple gradients, similar to Hearthstone or MTG mana symbols.
Content: A Water drop (Blue), A Flame (Orange), A Leaf (Green), A Skull (Black), A Sun (Yellow), A Star (Colorless).
- 実践解説: 抽象的なシンボルには**「高い可読性」**が求められ、カードの隅に小さく印刷されても判読できる必要があります。
9. ダークファンタジー スキルツリーノード (Skill Tree Nodes)

Prompt (日本語):
ダークファンタジーのパッシブタレントツリーアイコンセットを作成。
レイアウト:グリッド配列、濃い灰色の背景。
形状:円形の枠、石や骨に似たテクスチャ。
スタイル:モノクロまたはデュオトーン、エッチング/版画スタイル。
内容:筋力アップ(筋肉質な腕)、クリティカル率(目)、ライフスティール(コウモリ)、移動速度(ブーツ)、耐性(ひび割れた盾)。
Prompt (英語):
Create a set of Dark Fantasy Passive Talent Tree Icons.
Layout: Grid arrangement, dark grey background.
Shape: Circular borders, texture resembling stone or bone.
Style: Monochrome or Duotone, Etching / Engraving style.
Content: Strength Up (Muscular arm), Crit Chance (Eye), Life Steal (Bat), Move Speed (Boot), Resistance (Cracked shield).
- 実践解説: パッシブスキルは通常、アクティブスキルよりも控えめです。**「エッチングスタイル」**は「古の才能」という感覚を伝えるのに適しています。
10. レースシム 計器盤警告灯 (Dashboard Warning Lights)

Prompt (日本語):
レースシミュレーターのダッシュボード警告灯アイコンセットを作成。
レイアウト:グリッド配列、黒背景。
スタイル:発光するネオンベクタースタイル、高コントラスト。
内容:ABS故障(黄)、エンジン過熱(赤い温度計)、燃料低下(給油機)、タイヤ摩耗(タイヤ断面)、DRS作動(緑)、エンジンチェック(オレンジのエンジン輪郭)。
Prompt (英語):
Create a set of Racing Sim Dashboard Warning Light Icons.
Layout: Grid arrangement, black background.
Style: Glowing Neon Vector style, high contrast.
Content: ABS Fault (Yellow), Engine Overheat (Red Thermometer), Low Fuel (Gas Pump), Tire Wear (Tire section), DRS Active (Green), Check Engine (Orange Engine outline).
- 実践解説: シム系ゲームでは、実際の工業規格アイコンを再現する必要があります。LEDの点灯をシミュレートするには**「Glowing(発光)」**がキーワードです。
03. Nano Banana 失敗しないためのヒント
文字を入れない (No Text):
UIアイコンの中に文字(「LV.1」「NEW」など)を絶対に入れないでください。AIが生成する文字はここでは通常使えません。- ヒント: 文字は後でPhotoshopやFigmaで追加してください。AIにはグラフィックだけに集中させましょう。
枠線の統一 (Border Consistency):
AIは時々、一部のアイコンにだけ枠を付けてしまうことがあります。- ヒント: プロンプトで "Uniform shape and border style" (統一された形状と枠線スタイル) または "Borderless" (枠線なし) と明記してください。
色の修正 (Color Correction):
セットの中の1つのアイコンだけ色が違う(例:火の玉が緑色)場合。- ヒント: 画像全体を描き直さないでください。Nano Bananaの Inpainting (部分書き直し) 機能を使って、その特定のアイコンだけを修正しましょう。