クライアントへの提案力——デザインの「なぜ」を説明する技術

Course B — Chapter 3 Webデザイナー向け / Lesson 3

クライアントへの提案力
——デザインの「なぜ」を説明する技術

🎯 実践課題型 ⏱ 40分 📐 Course B Ch3-L3

ロードマップに戻る

前の章に戻る

このレッスンのゴール：デザインの根拠をマーケティング視点で言語化し、クライアントに自信を持って説明・提案できるようになること。「なぜこのデザインにしたか」を説明できるデザイナーは、単価・信頼・継続率のすべてが上がります。

「作れる」と「説明できる」の間にある大きな差

多くのWebデザイナーが直面する場面があります。「このデザインはなぜこのレイアウトにしたんですか？」と聞かれたとき、「感覚的に良いと思いました」「シンプルで見やすいと判断しました」と答えてしまう。

これはデザインの判断が間違っていたわけではありません。問題はその判断を「ビジネス上の根拠」として説明できないことです。クライアントが本当に聞きたいのは「なぜそのデザインが成果につながるのか」です。

NG — 感覚で説明する

「このボタン色はブランドカラーに合っていて、全体的にスッキリしているので良いと思います」

クライアントはデザイン審美眼を買っているのではなく「成果」を期待している。感覚的な根拠は反論されやすい

OK — マーケで説明する

「ペルソナの田中さんはこの段階で『本当に効果があるのか』と不安を感じています。そのため直前に受講生の数値成果を置き、ボタンは視線誘導を考慮してFV下に配置しました」

ペルソナ・行動心理・視線誘導という具体的根拠があり、クライアントは修正要求を出しにくい

「感覚 → マーケティング根拠」への切り替えは、使う言葉の問題です。次のフレームワークを身につければ、どんなデザイン判断でも根拠として説明できます。

デザイン根拠を説明する3本柱

Webデザイナーがクライアントに使える根拠は主に3つです。この3つのいずれかから説明できればよく、すべてを使う必要はありません。

🎯

根拠① ペルソナの心理状態

「このペルソナはこの段階で○○を感じています。そのため○○の要素を○○に配置しました」

使いやすい場面：構成・順番・コンテンツ選択の根拠を説明するとき

📊

根拠② CVRデータ・業界知見

「業界平均のABテスト結果では、このパターンのCTAはCV率が○%高いという傾向があります」

使いやすい場面：CTAの色・テキスト・フォームの項目数など細部の説明

👁️

根拠③ 視線誘導・UX設計の原則

「Fパターン/Zパターンの視線誘導に基づき、最も重要な情報を左上〜中央上に配置しました」

使いやすい場面：レイアウト・余白・タイポグラフィの判断を説明するとき

デザイン根拠の説明フォーマット

「ペルソナ / データ / UX原則から見ると、
ユーザーは○○の状態にいます。
そのため、このデザインでは○○を○○しました。
これにより○○（ビジネス成果）が期待できます」

例：「ペルソナの田中さんはFV段階で "自分には難しそう" という不安を持っています。そのため、ファーストビューのサブテキストに "完全初心者OK・スマホ1台で始められる" を入れ、CTA直前に受講生の声（平均受講開始後3ヶ月で月5万円達成）を配置しました。これにより検討離脱率の改善が見込めます」

マーケティング根拠付き提案資料の構成

デザインデータ（FigmaリンクやPDF）を渡すだけでなく、「設計の根拠スライド」を添付するだけで提案のクオリティは大きく変わります。以下の6枚構成が実用的です：

課題の整理

「現状の○○という課題があります」「ヒートマップ/GA4データで○○の問題が確認されています」など、現状の問題を定量・定性で整理する

ヒアリングで得た情報を使う。クライアントに「わかってもらっている」感を与える

ペルソナと行動フロー

今回の制作に使用したペルソナと、そのユーザーがどのようにLPを辿るかの心理フローを1枚で見せる

L2で作成した「ペルソナ→LP変換マップ」がそのまま使える

デザイン判断の根拠

「なぜこのFVコピーにしたか」「なぜCTAをこの位置にしたか」など、主要な判断5〜7点をペルソナ/データ/UXの根拠とセットで説明

全部説明する必要はない。インパクトが大きい箇所3〜5点に絞る

A/Bテスト提案

「まず公開してデータを取り、○○の要素をABテストで検証することを提案します」と具体的なテスト設計を提示

テスト設計を提案することで継続契約・改善フェーズへの自然な誘導になる

デザインデータ（Figmaリンク）

ここで初めてFigmaのデザインを見せる。根拠を理解した後にデザインを見ることで、クライアントが「なぜこのデザインか」を自然に受け入れる

根拠 → デザインの順番が重要。デザインから見せると「好み」で判断されやすい

次のステップ

「公開後○週間でデータを収集し、○○の改善案をご提案します」という具体的な次のアクションを提示する

「納品で終わり」ではなく、継続関係の設計として必ず入れる

資料は6枚でなくていい：1〜2枚でもOK。重要なのは「課題→根拠→デザイン→次のステップ」の流れを持つことです。フリーランスの場合、Notionやスライド共有ツール（Canva/Google Slides）で手軽に作れます。

よくある修正要求——マーケ根拠で切り返す

クライアントからの「〜に変えてほしい」要求は避けられません。重要なのは、感情的に受け入れるか拒否するかではなく、根拠をもとに議論できる状態を作ることです。

よくある修正要求① 「色をもっと明るくして」

NG 対応

「わかりました、変更します」→ あとで「なんか違う」と言われて迷走

OK 対応

「ペルソナの田中さんは信頼性を重視する傾向があるため、今回のカラーパレットはやや落ち着いたトーンにしています。もし明るくするとしたら、信頼を損なわずに华やかさを加える方法として、アクセントカラーの範囲を広げる案はいかがでしょうか。まずA案（現在）とB案（アクセント拡張）を作ってお見せします」

よくある修正要求② 「情報量を増やしてほしい」

NG 対応

「わかりました」→ 盛り込みすぎてCVRが下がる。後からクライアントに怒られる

OK 対応

「どの情報を追加したいですか？ LPの設計上、ファーストビューで情報が増えると離脱率が上がる傾向があります。追加情報はMust・Should・Could（優先度）で分類して、どこに入れるべきか一緒に整理させてください。CVの邪魔にならない配置をご提案します」

よくある修正要求③ 「競合のサイトに似たデザインにして」

NG 対応

「わかりました、参考にします」→ 差別化がなくなり、どちらのLPも印象が薄れる

OK 対応

「参考サイトを見ました。確かにわかりやすい構成ですね。ただ、ペルソナの田中さんは既にその競合も見ている可能性が高いです。同じデザインでは記憶に残りにくいため、構成の参考にしながらもビジュアルで差別化する方向を提案させてください。具体的には…」

実践：提案書の「NG版」と「OK版」を比較する

同じデザインを提出するときでも、「添え書き」の質が受注後の関係を変えます。以下の2つを比較してください：

NG 提案文

「LPデザインの初稿をお送りします。
シンプルで見やすいデザインを意識しました。ご確認よろしくお願いいたします。
修正があればお知らせください」

OK 提案文

「LPデザイン初稿をお送りします。設計の意図を簡単にご説明します。

ターゲット設定：先日のヒアリングで伺った「副業を始めたいが実績がない」という悩みを持つ30代女性を主ペルソナとして設計しました。

主なデザイン判断：
① FVキャッチコピー：「実績なしでも案件が取れる」に設定。ペルソナが最も気にしているハードル（実績不足）に直接応えています
② CTAの位置：FV下とベネフィット後の2箇所。検討中ユーザーが「よし申し込もう」と思う2つのタイミングをカバーしています
③ 証拠セクション：受講生3名の数値成果（before/after形式）で信頼構築。「自分もできるかも」というイメージを持たせる内容を選定しました

提案：公開後2週間でFVのキャッチコピーをA/Bテストすることをご提案します。詳細はご確認後に改めてご説明します。

ご不明点があればお気軽にどうぞ」

両者の違いは「手間」ではなく「視点」です。OK版は同じ制作時間でも、提案の文章にペルソナとマーケティング根拠を加えただけ。この違いが、単価・信頼・継続契約に直結します。

実践演習：マーケ根拠付き提案書を作る

L2で作成したワイヤーフレームをベースに、クライアントへの提案文（または提案スライド1〜3枚）を作成してください。

デザインの判断を3点ピックアップ（FVコピー・CTA位置・実績セクションの見せ方など）

各判断について「ペルソナ/データ/UX原則」のいずれかで根拠を言語化する

「課題 → 根拠 → デザイン判断 → 次のステップ」の流れで提案文を書く

「NG版」（感覚だけの説明）と「OK版」（根拠あり説明）の両方を書き、比較する

Chapter 3 Webデザイナー向けまとめ

この章では「見た目を作る人」から「成果を設計する人」への転換を学びました。CROの基礎概念（L1）、ペルソナ視点のUI設計（L2）、そして提案力（L3）の3つが揃うことで、「マーケティング根拠を持つWebデザイナー」として差別化できます。

📋 ペルソナ→LP変換マップ

📐 マーケ根拠付きワイヤーフレーム

📊 A/Bテスト設計書

📄 提案書フォーマット（テンプレート）

このレッスンのまとめ

「感覚で説明する」から「ペルソナ/データ/UX原則で説明する」への転換がデザイナーの単価を変える
提案資料は「課題 → ペルソナ → 根拠 → デザイン → 次のステップ」の順で構成する
修正要求には即座に応じるのではなく、根拠を持った代替案で対応する
提案文にペルソナとマーケ根拠を加えるだけで、クライアントの信頼と継続率が上がる

次のChapter（Chapter 4）では動画編集者向けに、視聴維持率の設計・チャンネル戦略・データドリブン編集の3レッスンに取り組みます。

前の章に戻る

ロードマップに戻る