kaankiziltug/logo-design-skill

A comprehensive logo-design skill for Claude, Gemini CLI, Codex and other AI agents: principles, process, SVG craft, testing tools and a 1,400+ logo reference library.

概要

logo-design-skill は、Claude、Gemini、Codex、Cursor、GitHub Copilot、その他 Agent Skills 形式を理解する LLM エージェントが、フル機能のロゴデザイナーとして動作するようにするプラグイン(スキル と呼ばれる)です。このスキルには、説明文、Python ユーティリティ群、そして約 1,400 点の実在する SVG ロゴの厳選ライブラリが含まれています。エージェントがスキルを実行すると、ブリーフからコンセプトスケッチ、監査、テスト、最終的なプロダクションレディなブランドキット(SVG ロゴ、ファビコン、モックアップボード、スタイルガイドなど)に至る、規律あるデザインワークフローに従います。


仕組み

  1. ブリーフ – ユーザーが短いブリーフ(業界、トーン、制約)を提供します。必要に応じてスキルがフォローアップ質問を行います。
  2. リサーチ – 内蔵の SVG ライブラリから類似のマークを検索し、視覚的パターン(マークタイプ、形状、色、タイポグラフィ、雰囲気、業界)を抽出します。
  3. コンセプト生成 – エージェントは 8〜12 の一行アイデアを起草し、その後 3 つの SVG コンセプトを作成します。
  4. 監査とテスト – 各コンセプトは一連の Python チェックで実行されます:
    • 幾何学的正確性(オーバーシュート、ボーン効果、正確な角度)
    • ピクセルサイズでの可読性(16 px、32 px、64 px)
    • 単色、反転、細目、ミラー、コンテキスト、競合他社の棚テスト
  5. チェックポイント – スキルは推奨事項付きのグレースケール概要画像を表示し、ユーザーが方向性を受け入れるか修正を依頼できるようにします。
  6. キット作成 – 方向性が選択されると、スキルは完全なブランドキット(カラー SVG、PNG レンダリング、ファビコン、Web マニフェストアイコン、ロックアップバリエーション、業界固有のモックアップ付きプレゼンテーションボード)を生成します。

対象ユーザー

  • デザイン重視の AI エージェント – Agent Skill フォルダを読み込める Claude Code、Gemini CLI、Codex CLI、Cursor、Copilot など。
  • デザインチーム – 初期段階のロゴアイデア出しを高速化し、すべてのコンセプトが基本的な視覚的可読性テストを通過することを保証します。
  • AI 駆動デザインツールを構築する開発者 – スキルの Python ユーティリティはカスタムパイプライン用に直接呼び出すことができます。
  • 教育者 / 学生 – 1,400 以上の分類された SVG ロゴのライブラリは、ロゴ構築を学ぶための便利なリファレンスです。

リポジトリの内容

項目 説明
skills/logo-design/ エージェントが読み取るスキル定義(SKILL.md、プロンプト、メタデータ)。
tools/ SVG 監査、テストシート生成、PNG レンダリング、ファビコンセット作成、プレゼンテーションボード組み立てのための依存関係のない Python スクリプト。
library/ 各ロゴがマークタイプ、形状、業界、雰囲気などでタグ付けされた 1,400 以上の実在 SVG ロゴ。CLI 経由で検索可能。
docs/ README で使用される画像(ヒーロー、実行例、モックアップボード)。
tests/ Python ツールが機能し、スキルのワークフローが期待されるファイルを生成することを検証する自動テスト。
package_skill.py スキル(大きな SVG ライブラリの有無にかかわらず)を Claude Desktop アップロード用の zip にバンドルするヘルパースクリプト。

インストールと開始方法

  1. Claude Code(推奨) – プラグインマーケットプレイスからスキルを追加します:
    /plugin marketplace add kaankiziltug/logo-design-skill
    /plugin install logo-design@logo-design-skill
    
  2. 手動インストール – リポジトリをクローンし、skills/logo-design を適切な ~/.claude/skills/(Gemini、Codex などの同等のフォルダ)にコピーします。
  3. Claude Desktop / その他のエージェント – Releases ページから zip をダウンロードするか(python3 tools/package_skill.py を実行)、Settings → Capabilities → Skills UI からアップロードします。
  4. 実行 – エージェントとの新しいチャットを開始し、ロゴを依頼します。エージェントは自動的にスキルを読み込み、ブリーフの質問をし、チェックポイント → キットのフローを案内します。

出力例

README には 28 のエンドツーエンド実行例(Kiln コーヒーロースター、Zestly フードデリバリーアプリ、Keyfort パスワードマネージャーなど)が示されています。各ブランドについて、スキルは:

  • 16 px/32 px/64 px で 3 つのグレースケールコンセプトを提示、
  • 見つかった幾何学的またはコントラストの問題を強調表示、
  • 1 つのコンセプトを推奨、
  • 承認後、完全な SVG ロゴ、PNG プレビュー、ファビコンセット、業界固有のモックアップ付きプレゼンテーションボードを提供します。

重要な理由

  • 一貫性のある再現可能なデザイン – スキルは古典的なロゴデザイン原則(光学的オーバーシュート、コントラスト比、グリッド整列)を自動チェックに組み込みます。
  • LLM の創造性を活用 – エージェントは多くのコンセプトアイデアを迅速に探索でき、スキルは出力を実証済みの視覚ルールに基づいて保持します。
  • 再利用可能なアセットライブラリ – デザイナーは CLI から直接、実ロゴの大規模で分類されたコレクションを閲覧でき、偶然の類似物を避けるのに役立ちます。
  • エージェント非依存 – オープンな Agent Skills 仕様に従うため、同じスキルが Claude、Gemini、Codex、Cursor などで動作し、AI 駆動デザインワークフローのポータブルなビルディングブロックとなります。

TL;DR

logo-design-skill は、Agent-Skills 形式をサポートする任意の LLM エージェントを、規律あるロゴデザイナーに変えます。Python のみのツールセットと 1,400 以上の SVG 参照ライブラリを使用して、ブリーフ → コンセプト → 監査 → チェックポイント → 完全なブランドキットのフローをガイドします。Claude のプラグインマーケットプレイスからインストールするか、スキルフォルダをコピーして、エージェントにロゴを依頼すれば、スキルが重い作業を処理します。

関連

  • プロジェクト
  • プロジェクト
  • プロジェクト
  • プロジェクト
  • プロジェクト