brand-voice-generator

ブランド＆ボイスジェネレーター

PPTX Generatorや、ブランド設定に対応したその他のスキルで使用する、完全なブランド設定ファイルを生成します。このスキルでは、対話形式でブランドアイデンティティと文体を定義できます。

作成されるもの

ファイル	目的	使用先
brand.json	色、フォント、アセット	PPTX Generator、Excalidraw
config.json	出力設定	PPTX Generator
brand-system.md	デザイン哲学とガイドライン	すべてのコンテンツスキル
tone-of-voice.md	文体とパーソナリティ	LinkedIn、X、PPTX コンテンツ

出力先

ファイルは次の場所に作成されます。

.claude/skills/pptx-generator/brands/{brand-name}/

---

プロセスの概要

1. ブランドの基本情報を収集する - 名前、説明、主な用途
2. 色を定義する - システム全体で使用する10個の色の値
3. タイポグラフィを定義する - 見出し、本文、コード用のフォント
4. アセットを定義する - ロゴとアイコンのパス
5. 文体を把握する - パーソナリティ、語彙、文のパターン
6. デザイン哲学を作成する - 中核となる原則と特徴的な要素
7. ファイルを生成する - 収集した情報を使って4つのファイルをすべて作成
8. 設定を確認する - ファイルが正しく配置されていることを確認

---

ステップ1：ブランドの基本情報を収集する

ユーザーに次の情報を尋ねます。

項目	説明	例
ブランド名	フォルダー名（小文字、スペースなし、ハイフンは使用可能）	my-brand、acme-corp
表示名	人が読みやすい名前	"My Brand"、"ACME Corporation"
説明	ブランドを1行で説明したもの	"AI教育コンテンツとコミュニティ"
主な用途	主なコンテンツの種類	プレゼンテーション、ソーシャルメディア、ドキュメント

質問の例：

"ブランドを設定しましょう。ブランド名を教えてください。（これはフォルダー名になります。'my-brand'のように、小文字とハイフンを使用してください）"

---

ステップ2：色を定義する

10個の色の値を収集します。色は、#を付けずに16進数コードで指定してください。

必須の色

色	目的	ガイダンス
background	スライド／ページの主な背景	ダークテーマ：ほぼ黒。ライトテーマ：白／オフホワイト
background_alt	変化をつけるための別の背景	背景より少し異なる色合い
text	主な文字色	背景に対して高いコントラスト
text_secondary	控えめな文字／補助的な文字	主な文字より少し低いコントラスト
accent	主なアクセント（CTA、ハイライト）	ブランドを象徴する色
accent_secondary	2番目のアクセント	主なアクセントを引き立てる色
accent_tertiary	3番目のアクセント（任意）	もう1つの補色、または2番目のアクセントと同じ色
code_bg	コードブロックの背景	主な背景より暗い色
card_bg	カード／サーフェスの背景	背景色と文字色の中間
card_bg_alt	別のカード背景	card_bgに少し変化をつけた色

色を決めるための質問

ユーザーが色のシステムをまだ決めていない場合は、次の質問で案内します。

1. "ブランドを象徴する色は何ですか？（これが主なアクセントになります）"
2. "ダークテーマ（暗い背景に明るい文字）とライトテーマのどちらが好みですか？"
3. "2番目の色はありますか？それとも補色を提案しましょうか？"

テーマ別の色の提案

ダークテーマの場合、次の色を提案します。

background: 0a0a0a to 1a1a2e range
text: f5f5f5 to ffffff range
card_bg: 1a1a1a to 2d2d44 range

ライトテーマの場合、次の色を提案します。

background: ffffff to f8f9fa range
text: 1a1a1a to 333333 range
card_bg: f0f0f0 to e8e8e8 range

---

ステップ3：タイポグラフィを定義する

3種類のフォント名を収集します。

フォント	目的	よく使われる選択肢
heading	見出し、タイトル、ボタン	Inter、Montserrat、Poppins、Roboto
body	本文、説明	Inter、Open Sans、Lato、Source Sans Pro
code	コードブロック、ターミナル	JetBrains Mono、Fira Code、Monaco、Consolas

質問：

"使用するフォントを教えてください。見出し用、本文用、コード／等幅フォントが必要です。よく使われる組み合わせは、見出しと本文にInter、コードにJetBrains Monoです。"

わからない場合のデフォルト：

• 見出し：Inter
• 本文：Inter
• コード：JetBrains Mono

---

ステップ 4：アセットを定義する

アセットのパスを収集します（ブランドフォルダーからの相対パス）。

アセット	説明	一般的な値
logo	メインのロゴファイル	assets/logo.png
logo_dark	暗い背景用のロゴバリエーション（任意）	null または assets/logo-dark.png
icon	正方形のアイコン（任意）	null または assets/icon.png

質問：

「ロゴファイルはありますか？ある場合は、ブランドフォルダーにコピーしてください。ファイル名を教えてください。（例：'logo.png'）」

ロゴがある場合は、パスを assets/logo.png に設定します（そこにコピーしてもらいます）。 ロゴがない場合は、null に設定します。

---

ステップ 5：ボイスを見つける

これはコンテンツの品質を左右する最も重要なステップです。ユーザーがブランドのボイスを見つけられるよう案内します。

ボイスを見つけるための質問

ボイスを理解するため、次の質問をします。

1. 3つの言葉で表すパーソナリティ：

   「ブランドのパーソナリティを、ちょうど3つの言葉で表してください。例：'大胆、技術的、親しみやすい'、または'落ち着いた、権威のある、役に立つ'」

2. ボイスの参考にしているもの：

   「コミュニケーションスタイルに感銘を受けるクリエイター、ブランド、人物を2〜3人挙げてください。雰囲気を理解する参考になります。」

3. 語彙の傾向：

   「よく使う言葉やフレーズはありますか？口癖や、好んで使う強調表現（'とても'、'信じられないほど'など）、または自然と使いたくなる言葉はありますか？」

4. 避けたいもの：

   「避けたい口調やフレーズはありますか？（例：企業的な言い回し、誇大な表現、くだけすぎた口調）」

5. 文体：

   「どれを好みますか？短く力強い文、長く流れるような説明、それともその組み合わせですか？くだけた場面で短縮形（'don't'、'can't'）を使いますか？」

6. 教え方（該当する場合）：

   「複雑なことを説明するとき、どのように進めますか？プロセスや試行錯誤を見せますか？たとえを使いますか？実践的な内容から始めて、理論へと進みますか？」

ボイスのテンプレートの参考資料

ユーザーに見せるボイス設定の例として、references/voice-templates.md を読みます。

---

ステップ 6：デザイン哲学を作成する

収集した情報をもとに、次の内容の定義を支援します。

コア原則（3〜4個）

質問：

「ビジュアルの選択を導くデザイン原則を3〜4個挙げてください。例：'派手さよりもシンプルさ'、'技術的でありながら親しみやすく'、'ダークモードをデフォルトに'」

シグネチャー要素

質問：

「特徴的なビジュアル要素はありますか？例：すりガラス風のカード効果、特定のシャドウスタイル、グラデーションパターン、幾何学的な形状、グロー効果」

決めかねている場合は、色とテーマをもとに提案します。

---

ステップ 7：ファイルを生成する

収集した情報を使って、4つすべてのファイルを作成します。

brand.json

{
  "name": "{display_name}",
  "description": "{description}",

  "colors": {
    "background": "{background}",
    "background_alt": "{background_alt}",
    "text": "{text}",
    "text_secondary": "{text_secondary}",
    "accent": "{accent}",
    "accent_secondary": "{accent_secondary}",
    "accent_tertiary": "{accent_tertiary}",
    "code_bg": "{code_bg}",
    "card_bg": "{card_bg}",
    "card_bg_alt": "{card_bg_alt}"
  },

  "fonts": {
    "heading": "{heading_font}",
    "body": "{body_font}",
    "code": "{code_font}"
  },

  "assets": {
    "logo": "{logo_path}",
    "logo_dark": {logo_dark_path},
    "icon": {icon_path}
  }
}

config.json

{
  "output": {
    "directory": "output/{brand_name}",
    "naming": "{name}-{date}",
    "keep_parts": false
  },
  "generation": {
    "slides_per_batch": 5,
    "auto_combine": true,
    "open_after_generate": false
  },
  "defaults": {
    "slide_width_inches": 13.333,
    "slide_height_inches": 7.5
  }
}

tone-of-voice.md

references/tone-template.md のテンプレートを使い、収集したボイスの情報を記入します。

brand-system.md

references/brand-template.md のテンプレートを使い、収集したデザインの情報を記入します。

---

ステップ 8：セットアップを確認する

ファイルを生成した後、次の手順を行います。

1. 作成したファイルを一覧表示する：

   Glob: .claude/skills/pptx-generator/brands/{brand-name}/*
   

2. アセットについてリマインドする：

   「ロゴファイルを .claude/skills/pptx-generator/brands/{brand-name}/assets/ にコピーするのを忘れないでください」

3. テストを提案する：

   「'Create a 3-slide presentation for {brand-name} about [topic]' と入力して、簡単なプレゼンテーションを生成してみてください」

---

クイックモード

ユーザーがすぐに始めたいだけの場合：

1. ブランド名、シグネチャーカラー、ライト／ダークの設定だけを尋ねます
2. それ以外は妥当なデフォルトを生成します
3. 最小限ながら機能するファイルを作成します
4. 後から調整できることを伝えます

クイックモードのトリガーフレーズ：

• "quick setup"
• "just the basics"
• "minimal brand"
• "get started fast"

---

既存ブランドの更新

すでにブランドがある場合：

1. まず既存のファイルを読みます
2. 更新する内容を尋ねます：
   • 色のみ？
   • ボイスのみ？
   • すべて？
3. 変更しないセクションはそのまま保持します
4. 書き込む前に変更差分を表示します

---

チェックリスト

• ブランド名と説明を集めます
• 10 個すべての色の値を集めます（またはデフォルト値を提案します）
• 3 つのフォント名を集めます（またはデフォルトを使用します）
• アセットのパスを決定します
• 質問を通じてブランドの声を見つけます
• デザイン原則を定義します
• brand.json を生成します
• config.json を生成します
• tone-of-voice.md を生成します
• brand-system.md を生成します
• assets フォルダーを作成します
• すべてのファイルが作成されたことを確認します
• ロゴのコピーについてユーザーに伝えます
• テスト生成を提案します