mcpField
B
brand

brand

github.com/nextlevelbuilderマーケティング・グロース142.1k41.6k 回インストール2 日前に更新
リポジトリ

brand について

ブランドのアイデンティティ、声のトーン、メッセージ、ビジュアル基準を定めるスキルです。参照フレームワークとスクリプトを使い、ブランド情報の提示、アセット検証、ガイドラインからデザイントークンへの同期を支援します。

主な機能

  1. 01ブランドボイスとメッセージのフレームワーク
  2. 02ビジュアルアイデンティティの指針
  3. 03ブランド一貫性のレビュー
  4. 04アセットの命名と検証
  5. 05カラーの抽出と比較
  6. 06ガイドラインとトークンの同期

活用シーン

  1. 01ブランドボイスとトーンの定義
  2. 02ビジュアルアイデンティティ指針の作成
  3. 03コンテンツのブランド一貫性の確認
  4. 04ブランドガイドラインのデザイントークンへの同期

インストール

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

$npx skills add https://github.com/nextlevelbuilder/ui-ux-pro-max-skill --skill brand

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

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

references/
approval-checklist.md
asset-organization.md
brand-guideline-template.md
color-palette-management.md
consistency-checklist.md
logo-usage-rules.md
messaging-framework.md
typography-specifications.md
update.md
visual-identity.md
voice-framework.md
scripts/
extract-colors.cjs
inject-brand-context.cjs
sync-brand-to-tokens.cjs
validate-asset.cjs
scripts/tests/
test_sync_brand_to_tokens.py
templates/
brand-guidelines-starter.md

詳細

ブランド

ブランドアイデンティティ、ボイス、メッセージング、アセット管理、一貫性を保つためのフレームワークです。

使用するタイミング

  • ブランドボイスの定義とコンテンツのトーンに関するガイダンス
  • ビジュアルアイデンティティの基準とスタイルガイドの策定
  • メッセージングフレームワークの作成
  • ブランドの一貫性のレビューと監査
  • アセットの整理、命名、承認
  • カラーパレットの管理とタイポグラフィの仕様

スクリプトのパス

このスキルおよびその references/ 内のスクリプトのパスは、プロジェクトではなく、この SKILL.md が格納されているディレクトリを基準とします。scripts/<file> はこのスキル独自の scripts/ フォルダーを、../<skill>/scripts/<file> はこのスキルと並べてインストールされたサブスキルのフォルダーを指します。そのディレクトリを基準に完全なパスを組み立て、作業ディレクトリはプロジェクトのルートにしてください（スキルの読み込み時に Claude Code がスキルのベースディレクトリとして報告します）。スクリプトは、docs/brand-guidelines.md、assets/design-tokens.json、src/ などのプロジェクトファイルを基準に読み書きします。

クイックスタート

プロンプトにブランドコンテキストを挿入する：

node scripts/inject-brand-context.cjs
node scripts/inject-brand-context.cjs --json

アセットを検証する：

node scripts/validate-asset.cjs <asset-path>

カラーを抽出／比較する：

node scripts/extract-colors.cjs --palette
node scripts/extract-colors.cjs <image-path>

ブランド同期ワークフロー

# 1. Edit docs/brand-guidelines.md (or use /brand update)
# 2. Sync to design tokens
node scripts/sync-brand-to-tokens.cjs
# 3. Verify
node scripts/inject-brand-context.cjs --json | head -20

一般的な CSS エントリポイントとそのローカル CSS インポート内に既存のトークンファイル、:root カスタムプロパティ、Tailwind v4 の @theme 変数が見つかった場合、または Tailwind のテーマカラーやプリセットが見つかった場合、同期は停止します。続行する前に、報告されたソースを確認してください。検出されたファイルが以前の同期で生成された管理対象の assets/design-tokens.* 出力であり、置き換える意図がある場合は、--force を付けて再実行してください。

同期されるファイル：

  • docs/brand-guidelines.md → 信頼できる情報源
  • assets/design-tokens.json → トークン定義
  • assets/design-tokens.css → CSS 変数

サブコマンド

サブコマンド説明参照先
updateブランドアイデンティティを更新し、すべてのデザインシステムに同期しますreferences/update.md

参照資料

トピックファイル
ボイスフレームワークreferences/voice-framework.md
ビジュアルアイデンティティreferences/visual-identity.md
メッセージングreferences/messaging-framework.md
一貫性references/consistency-checklist.md
ガイドラインのテンプレートreferences/brand-guideline-template.md
アセットの整理references/asset-organization.md
カラー管理references/color-palette-management.md
タイポグラフィreferences/typography-specifications.md
ロゴの使用方法references/logo-usage-rules.md
承認チェックリストreferences/approval-checklist.md

スクリプト

スクリプト目的
scripts/inject-brand-context.cjsプロンプトへの挿入に使うブランドコンテキストを抽出します
scripts/sync-brand-to-tokens.cjsbrand-guidelines.md を design-tokens.json/css に同期します
scripts/validate-asset.cjsアセットの命名、サイズ、形式を検証します
scripts/extract-colors.cjsカラーを抽出し、パレットと比較します

テンプレート

テンプレート目的
templates/brand-guidelines-starter.md新しいブランド向けのスターターテンプレート一式

ルーティング

  1. $ARGUMENTS からサブコマンドを解析します（最初の単語）
  2. 対応する references/{subcommand}.md を読み込みます
  3. 残りの引数を使って実行します

コメント

Markdown 対応