メニュー
「ロゴを作成して」「ロゴを作って」「ロゴを生成して」など、ロゴ画像の生成依頼時に、GrouMapのブランドカラーとデザインスタイルを適用してロゴを自動生成する。
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
【必須・最優先】GrouMapのFlutter画面作成・画面編集・UI実装・コード修正・機能追加でUI/UXルールを適用するためのガイド。このスキルを発動せずにFlutterコードを1行でも書くことは禁止。「作成して」「修正して」「編集して」「追加して」「実装して」「画面」「ウィジェット」「UI」「UX」「レイアウト」「デザイン」「ボタン」「フォーム」「カード」「リスト」「タブ」「画面の見た目」「図鑑」「マップ」「dart」などのキーワードを含む依頼時に、コードを書く前に必ず最初に発動すること。スタンプ・スタンプカードのUI変更時にも使う。
「画像を生成して」「画像を作って」「アイコンを作って」「バナーを作って」など、画像生成の依頼時に、Nano Banana 2（Gemini 3.1 Flash Image）APIを使って画像を自動生成する。
【必須・最優先】GrouMapのFlutter画面作成・画面編集・UI実装・コード修正・機能追加でUI/UXルールを適用するためのガイド。このスキルを発動せずにFlutterコードを1行でも書くことは禁止。「作成して」「修正して」「編集して」「追加して」「実装して」「画面」「ウィジェット」「UI」「UX」「レイアウト」「デザイン」「ボタン」「フォーム」「カード」「リスト」「タブ」「画面の見た目」「図鑑」「マップ」「dart」などのキーワードを含む依頼時に、コードを書く前に必ず最初に発動すること。スタンプ・スタンプカードのUI変更時にも使う。
「手順書を更新して」「ガイドを整理して」「フェーズが完了したのでマークダウンを整理して」「フェーズが進んだので更新して」「ロードマップを更新して」など、フェーズ進捗に応じてAGENT_TEAM_GUIDE.mdとIMPLEMENTATION_ROADMAP.mdを最新状態に整理する依頼時に使う。
「計画書を作成して」「プランを作って」「設計書を作成して」「計画を立てて」「〇〇の計画書」「〇〇のプラン」など、計画書・設計書・プランの作成を依頼されたときに、/Users/kanekohiroki/Desktop/groumapapp/.claude/plans/ 配下にマークダウンファイルを作成して保存するためのルール。
「バッジ」「バッジ追加」「バッジ削除」「バッジ変更」「バッジ一覧」「バッジ定義」「badge」など、バッジに関するワードが出てきたときに BADGE_LIST.md を参照し、変更があれば追記・修正するためのルール。バッジの追加・削除・名前変更・獲得条件変更・レア度変更・画像パス変更・トリガー実装変更などの場面で使う。
| name | logo-gen |
| description | 「ロゴを作成して」「ロゴを作って」「ロゴを生成して」など、ロゴ画像の生成依頼時に、GrouMapのブランドカラーとデザインスタイルを適用してロゴを自動生成する。 |
ユーザーからロゴ生成を依頼されたときに、GrouMapのブランドイメージに合ったロゴを自動生成する。
具体的な画像生成の手順（コマンド実行方法・保存先・アスペクト比の決定方法）は、以下のファイルを Read ツールで読み込んでから実行してください：
/Users/kanekohiroki/Desktop/groumapapp/.claude/skills/nano-banana-image-gen/HOW_TO_GENERATE.md
| 用途 | カラーコード | 説明 |
|---|---|---|
| プライマリオレンジ | #FF6B35 | メインのブランドカラー、ボタン・アイコン等に使用 |
| 背景色 | #FBF6F2 | 画面背景色（温かみのあるベージュ） |
ロゴ生成時は #FF6B35（オレンジ） を主軸カラーとして使用すること。
以下の参照画像のスタイルに 厳密に 準じてロゴを生成すること：
参照画像: .claude/skills/logo-gen/reference/logo_style_reference.png
ロゴ生成前に必ず Read ツールでこの参照画像を確認し、同じスタイルで生成すること。
参照画像は「UI用アウトラインアイコンセット」であり、以下の特徴を持つ：
アプリ内アイコン生成時（icon_coin, icon_badge 等）:
Single minimal outline icon of [対象物], thin uniform stroke weight, stroke only with no fill, dark gray color on white background, rounded line caps and corners, simple and clean with minimal detail, consistent line thickness throughout, no shadows no gradients no textures no 3D effects, flat 2D line art, professional UI icon style, centered with equal padding, isolated single icon
ロゴ生成時:
Single minimal outline logo for "GrouMap", [ユーザーの依頼内容], thin uniform stroke weight, stroke only with no fill, orange color #FF6B35 on white background, rounded line caps and corners, simple and clean with minimal detail, consistent line thickness throughout, no shadows no gradients no textures no 3D effects, flat 2D line art, professional and modern, centered with equal padding
必ず含めるキーワード:
thin uniform stroke weight （均一な細い線幅）stroke only with no fill （線のみ、塗りなし）rounded line caps and corners （角丸）no shadows no gradients no textures no 3D effects （装飾禁止）flat 2D line art （フラットな2D線画）single icon or single logo （1つだけ生成）centered with equal padding （中央配置・均等余白）絶対に含めないキーワード:
colorful, vibrant, gradient （多色・グラデーション）3D, realistic, photorealistic （立体・写実）shadow, glow, reflection （影・光沢）filled, solid （塗りつぶし）detailed, complex, intricate （詳細・複雑）icon set, multiple icons （複数アイコン）対象物の記述:
a coin with a dollar sign, a medal badge with a star, a stamp card1:1（正方形）2K/Users/kanekohiroki/Desktop/groumapapp/generated_images/logo_main.png, logo_icon.png）生成された画像を Read ツールで表示し、以下を確認する：
品質基準を満たさない場合: プロンプトを調整して再生成する。特に「塗りつぶし」や「複数アイコン」が出やすいため、stroke only with no fill と single icon を強調する。
ロゴ生成後は必ず remove-background スキルを使って背景を透明化すること。 ユーザーからの個別依頼を待たずに、ロゴ生成フローの一部として自動的に実行する。
remove-background スキルを発動して背景を透明化する注意: 背景透明化はロゴ生成の必須ステップです。白背景のまま納品しないでください。
GOOGLE_API_KEY 環境変数が設定されている必要がある（HOW_TO_GENERATE.md 参照）。