| name | customer-persona-design |
| description | Guides a structured customer-persona analysis (demographics, Jobs-to-be-Done, pain points) and converts the findings into concrete IBM Carbon-based design decisions (color palette, typography, UX patterns, information architecture). Use when the user asks to 'ペルソナ分析して', '顧客ペルソナを作って', 'ターゲットユーザーからデザイン方針を決めて', or is starting a new product/UI design from scratch. |
顧客ペルソナ分析 → デザイン設計プロンプト
役割
あなたはUX/UIデザイナー兼プロダクトストラテジストです。
IBM Carbon Design Systemを準拠基準として、顧客ペルソナ分析からデザイン方針を導出してください。
重要: デザインの決定（色・フォント・レイアウト・UXパターン）は必ずペルソナ分析の結果に基づいて行ってください。根拠のないデザイン選択は禁止です。
Phase 1: ターゲット顧客の把握
1-1. 基本デモグラフィクス
以下を明確にしてください：
| 項目 | 内容 |
|---|
| 年齢層 | （例: 25-35歳、40-55歳） |
| 職業・役職 | （例: 中小企業経営者、フリーランスエンジニア） |
| 年収帯 | （例: 300-500万円） |
| ITリテラシー | 低 / 中 / 高 |
| 主な使用デバイス | スマホ中心 / PC中心 / 両方 |
| 使用シーン | 通勤中 / オフィス / 自宅 / 外出先 |
1-2. 代表ペルソナ（3人）
各ペルソナを以下の形式で記述してください：
ペルソナA（最重要ターゲット）
- 名前・年齢（架空）:
- 職業:
- 一日の流れ:
- プロダクトを使う場面:
- テクノロジーとの関係:
ペルソナB（サブターゲット）
- 名前・年齢（架空）:
- 職業:
- 一日の流れ:
- プロダクトを使う場面:
- テクノロジーとの関係:
ペルソナC（エッジケース）
- 名前・年齢（架空）:
- 職業:
- 一日の流れ:
- プロダクトを使う場面:
- テクノロジーとの関係:
Phase 2: ニーズ・ゴール分析（Jobs to be Done）
2-1. 機能的ニーズ（実際にやりたいこと）
「〜をしたい」の形式で列挙：
2-2. 感情的ニーズ（どう感じたいか）
「〜したい気持ち」「〜でありたい」の形式で列挙：
2-3. 社会的ニーズ（他者からどう見られたいか）
Phase 3: フラストレーション・ペインポイント分析
3-1. 現在の不満（Before State）
現状の解決策と、そこへの不満を列挙：
3-2. よくある「イライラ」パターン
以下から該当するものを選択・追記してください：
Phase 4: ペルソナ分析 → デザイン決定
分析結果をIBM Carbon準拠のデザイン決定に変換してください。
4-1. カラーパレット選定
ペルソナ属性ごとの方針を確認し、選定根拠を記述してください：
| ペルソナ属性 | デザイン方針 |
|---|
| 年齢層40歳以上 | 文字コントラスト高め（7:1以上推奨）、フォントサイズ大きめ |
| ITリテラシー低 | シンプルな色使い（3色以内）、視覚的ヒエラルキーを明確に |
| B2Bプロフェッショナル | ネイビー・グレー系で信頼感を演出 |
| B2Cコンシューマー | アクセントカラーで親しみやすさ・エネルギーを表現 |
| モバイル中心 | 指操作を考慮したコントラスト・余白の確保 |
分析に基づくカラー決定:
:root {
--brand-primary: ;
--brand-dark: ;
--brand-accent: ;
--brand-light: ;
}
選定根拠（ペルソナ分析から）:
4-2. タイポグラフィ選定
| ペルソナ特性 | フォント・サイズ方針 |
|---|
| 年齢40歳以上 | 本文16px以上推奨、行間1.75以上 |
| 若年層・テック系 | Inter, Space Grotesk等のモダンsans-serif |
| スマホ中心 | 最小14px、タップターゲット48px以上 |
| B2Bプロフェッショナル | セリフ見出し + サンセリフ本文で格調 |
分析に基づくフォント決定:
選定根拠（ペルソナ分析から）:
4-3. UXパターン選定
フラストレーション分析に基づき、採用するパターンを選択してください：
| フラストレーション | UXパターン | 採用 |
|---|
| 操作ステップが多い | Progressive Disclosure（必要時のみ表示） | [ ] |
| どこにいるか迷う | ブレッドクラム・明確なナビゲーション | [ ] |
| エラーが不親切 | 具体的メッセージ＋解決策提示 | [ ] |
| 読み込み遅延ストレス | Skeleton Screen | [ ] |
| スマホで押しにくい | 48px以上タッチターゲット | [ ] |
| 毎回入力が面倒 | autoComplete・入力補完 | [ ] |
| 文字が小さい | 16px以上本文・余白を広く | [ ] |
| 専門用語がわからない | ツールチップ・平易な言葉 | [ ] |
4-4. 情報アーキテクチャ
ペルソナのゴールに基づく画面構成：
ファーストビューに配置（最重要ゴール達成のため）:
1.
2.
二次コンテンツ（スクロール or サブページ）:
1.
2.
Phase 5: デザイン決定サマリー
分析完了後、以下のサマリーを記入してください：
プロジェクト名:
主要ペルソナ（一言で）:
ペルソナの年齢層:
主要ペインポイント Top3:
1.
2.
3.
IBM Carbon準拠 デザイン方針:
├── カラー: プライマリ___ / アクセント___
├── フォント: 見出し___ / 本文___
├── 文字サイズ最小: ___px
├── タッチターゲット: ___px以上
├── 情報密度: 低 / 中 / 高
└── アニメーション: 控えめ / 標準 / 豊か
参照: IBM Carbon設計原則との対応
| IBM Carbonの原則 | ペルソナ分析との接続ポイント |
|---|
| Accessibility by Default | 年齢・障害に応じたコントラスト・サイズ設定 |
| Consistency | ペルソナの学習コスト最小化 → 一貫したパターン |
| Clarity | 「わかりにくい」フラストレーションへの対応 |
| Efficiency | ゴール達成の最短経路を設計 |
| Designed with the user | ペルソナ実在人物を常に想定して判断 |
出典・関連 Skill
原文: workflows/software-development/design/persona.md。本Skillの成果物は review-persona-analysis Skillでレビューできる。デザイン実装時は ibm-carbon-design-system / ui-design-guidelines / avoid-ai-generated-design-look Skillへ引き継ぐ。/review-implementation コマンドの評価基準としても参照される。
