mcpField
L
logo-colorway-generator

logo-colorway-generator

github.com/sanbaoaiデザイン・UI7758 回インストール20 週間前に更新
リポジトリ

logo-colorway-generator について

logo-colorway-generatorは、既存ロゴのカラーシステムとシナリオボードを作成するデザインスキルです。ロゴの構造を保ちながら、さまざまなブランド用途での配色を示します。

主な機能

  1. 01ロゴ構造と単色対応の維持
  2. 022~4案のカラーパレット作成
  3. 03ブランドに合う配色の選定
  4. 04シナリオレイアウトと用途の設計
  5. 05リカラー用プロンプトの作成

活用シーン

  1. 01既存ロゴの配色案の検討
  2. 02製品やデジタル画面でのロゴ用途の提示
  3. 03画像モデル向けリカラー用プロンプトの準備

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/sanbaoai/logo-generator-skill --skill logo-colorway-generator

インストール後、Claude Code で/logo-colorway-generatorを入力して読み込まれたか確認します。

同梱ファイルinput-schema.jsonprompt.md

詳細

ロゴカラーバリエーション生成

ロゴまたはブランドシステムのボードがすでにある場合に、このスキルを使用します。元のシンボル、ワードマーク、シルエット、単色での使いやすさを保ちながら、配色戦略、用途に応じたレイアウト、シナリオ別の展開を追加します。デフォルトの配色は、印象に残りやすく、幅広い層に受け入れられ、実用的なものにします。ブランドを象徴する色のアクセントを生み出し、効果的であればボードの背景やレイアウトを調整し、静的なブランドマニュアルを超えてロゴを活用できることが伝わるシナリオを示します。

ワークフロー

  1. 元となるロゴまたはボードを特定します。ブランド名、既存のシンボル、ワードマーク、マスコット/基本デザインの方向性、現在のレイアウト、想定する使用媒体を確認します。
  2. ロゴの不変要素を保ちます。マークを描き直したり、マスコットの特徴やワードマークの綴り、基本のシルエットを変えたりしないでください。明示的に依頼されていない限り、新しいコンセプトも加えないでください。
  3. 既存のデザインシステムを把握します。モノクロでの見え方、グリッドのスタイル、タイポグラフィの雰囲気、視覚的な密度、展開例、モックアップ、既存のアクセントカラーを確認します。
  4. 影響度が明確な配色案を2〜4種類作成します。各案には、シグネチャーカラー、プライマリーカラー、セカンダリーカラー、アクセントカラーまたはコントラストカラー、ニュートラルな背景色、ダークカラー/インクカラー、単色での代替案を含めます。
  5. ブランドの文脈に最も適した配色案を選び、それが第一印象での記憶への残りやすさを高める理由を説明します。その際、対象となる人々、ロゴの形状、マスコット/元となるアイデア(ある場合)、制作物への適用性との適合性も考慮します。
  6. カラーバリエーションのレイアウト形式を選びます。ユーザーが元のボードを維持するよう求めていない限り、用途に応じたシナリオボードを優先します。背景色、大きな色面、実用的なシーンモジュールを活用し、カラーバリエーションの実用性が伝わり、ひと目で理解できるようにします。
  7. シナリオごとの適用ルールを定義します。メインロゴ、ファビコン/アプリアイコン、ロックアップ、ソーシャルメディア/アバター、パッケージまたは製品面、デジタルインターフェースまたは表紙、グッズ/サイン、黒/アイボリーでの代替、縮小サイズでの使用を含めます。
  8. プラットフォームで使えるリカラー用プロンプトを作成します。ユーザーが画像を提供した場合は、依頼に応じて編集対象または参照画像として扱います。ロゴの構造は維持しつつ、適用性を高めるために周囲のボードレイアウト、背景色、シーンモジュールは変更できるようにします。
  9. ユーザーが「generate」「render」「create an image」「出图」「直接生成」「recolor」「改色」と依頼した場合、または render_image: true が設定されている場合は、最適な GPT Image または Universal プロンプトを使って imagegen スキル/ツール、あるいは利用可能な別の画像生成ツールを呼び出します。ユーザーが複数案を求めていない限り、洗練されたシナリオ別カラーバリエーションボードを1点生成します。
  10. 画像生成が依頼されているものの、画像生成ツールを利用できない場合は、カラーバリエーション一式を返し、画像モデルに貼り付ける最終プロンプトを明示します。
  11. revision_notes が提供されている場合は、既存の配色/レイアウトの有用な要素を保ち、依頼された箇所だけを修正します。

出力

以下のセクションを返します。

  • 既存ロゴの読み取り
  • 配色案
  • 選定したカラーシステム
  • 第一印象への効果
  • シナリオ別レイアウト戦略
  • カラー適用ルール
  • カラーバリエーションボードのレイアウト
  • 最終リカラープロンプト
  • 生成したカラーバリエーション:画像の直接生成が依頼され、利用可能な場合のみ

色の制約、避けるべきパターン、出力テンプレートの詳細については、prompt.md を確認してください。

コメント