良いデザインとは何か — 「印象 × 行動」で評価し、主観はユーザー視点に置き換える

第 4 章はデザインの章です。 多くの担当者が「デザインの話になると主観で揉める」と困っています。 本書は主観を排除しません。 でも、主観を語る前に「目的に照らす」枠組みを持つこと、そしてその主観を「ユーザー視点」に変換してから語ることを徹底します。 この Lesson は、その出発点になります。

1. 「いいデザイン」を 1 文で定義する

本書版の定義

本書での「いいデザイン」の定義は、これです。 「ユーザーに与えるべき印象を与えられて、目的に則した行動をとってもらえるような設計」。 第1章 Lesson 1 で見た「Web コミュニケーションの管理」という担当者の役割を、デザインの言葉に置き換えたものです。

2 つの要素

定義の中身は、2 つの要素に分解できます。

• 印象(感情・ブランディング)：信頼 / 安心 / 専門性 / 革新性 / 親しみ
• 行動(機能・CV＝問い合わせ・購入など、サイト上で達成したい成果)：問い合わせ / 購入 / 応募 / 閲覧

印象だけでは行動が起きないし、行動だけでは信頼を作れません。 両方が揃って初めて「良い」と言えます。

評価軸のおおもとは 第2章 Lesson 1 の「4 つの問い」

第2章 Lesson 1 で言語化した「誰に・何を・どう感じて・どう行動してほしいか」は、そのままデザインの評価軸になります。 「どう感じてほしいか」が印象、「どう行動してほしいか」が行動。 企画段階で言葉にしたことを、デザインという形で実装していく流れです。

「印象 × 行動」を下支えする基礎品質

「印象 × 行動」は本書の 主軸の評価軸 で、揺るがしません。 ただし、「印象 × 行動」が成立するためには、行動以前の基礎品質が前提として満たされている必要があります。 基礎品質が崩れると、ユーザーは「印象」を持つ前に離脱しますし、「行動」する手前で詰まります。

基礎品質は、評価軸の前提条件として次の 5 つを意識しておきたいところです。

• アクセシビリティ：見えない・押せないでは、一部のユーザーに印象も行動も生まれません(第4章 Lesson 5 で詳述)
• 読みやすさ：文字サイズ・行間・コントラストが崩れていると、印象を持つ前に離脱されます
• 性能(表示速度)：表示が遅いだけで、特にスマホでは印象を持つ前に離脱されます
• 保守性：作りが雑だと、長期運用の中でデザインが継ぎ接ぎになっていきます
• CMS 更新時の崩れにくさ：運用フェーズの更新で印象が壊れない作りかどうか(第4章 Lesson 3 で詳述)

これらは「印象 × 行動」を 評価する以前 にチェックする土台です。 デザインレビューの順序は、まず基礎品質チェック(アクセシビリティ・読みやすさ・性能・保守性・CMS 更新の崩れにくさ)、その上で「印象 × 行動」をレビュー、という二段構えです。 基礎品質が崩れているのに「印象 × 行動」を細かくレビューしても、根本問題が解決しません。

基礎品質は専門的な確認が必要な領域です。担当者は、そのチェックを業者に依頼したうえで(詳細は 第4章 Lesson 2 / 第4章 Lesson 5)、「印象 × 行動」の判定を自分で行う、と切り分けます。

2. デザイン評価で持ってはいけない 3 つの軸

良いデザインの定義の裏返しとして、評価軸に持ち込んではいけないものを確認します。 どれも、現場で頻繁に出てくる軸です。

「自分の好み」

主観の最たる罠です。 担当者個人の好みは、ターゲットの好みとは無関係です。 自分の好みで評価し始めると、デザインが個人趣味に着地してしまいます。

「他社がかっこいい」

他社のかっこよさは、他社のターゲットに最適化された結果です。そのまま持ってきても、自社のターゲットには合いません。 参考にしてよいのは 「なぜその見せ方にしたのか」という狙い の部分だけ。見た目そのものを真似すると、目的とズレたデザインになります。

「業界の流行」

流行を追うことは目的ではありません。 流行に乗ったデザインは、半年後には古く見えます。 流行ではなく、目的に合うデザインを選びたいところです。

これらに共通するのは 「目的とつながっていない」 ことです。 どの軸も、第2章 Lesson 1 の「4 つの問い」と切れています。 目的に紐付かない評価軸は、思い切って手放してしまいましょう。

3. フィードバックは「ユーザー視点」に変換して伝える

主観そのままではコメントしない

デザインフィードバックの大原則です。担当者個人の好みは語らないようにします。 「私は嫌い」「私はこっちが好き」は、業者にとって最も困るコメントになりがちです。

違和感は「ユーザー視点」に言い換える

とはいえ、感じた違和感を飲み込む必要はありません。違和感は伝えてください。 ただし、「誰に・どう感じて・どう行動してほしいか」 に言い換えてから渡します。 「私は嫌い」を「うちのターゲット(30 代女性)には響かないと思う」に置き換える、という具合です。 軸は一つ、ユーザーが目的(行動)を達成しやすいか です。ここで語れば、業者は動きやすく、議論も建設的になります。

動きやすいフィードバックの書式

フィードバックは 「箇所 → 現状 → 気づき(ユーザー視点) → 方向性」 の 4 段で書くと、業者が動きやすくなります。結論を押し付けず、判断はデザイナーに委ねる形です。

例：「[トップ KV(トップのメイン画像)] 写真の表情が硬い → ターゲットは安心感を求める層 → もう少し柔らかい表情のほうが合いそう → 別案を再提案してもらえますか?」

最後は「変えて」ではなく 「再提案して」 と書くのがコツです。「変えて」は指示、「再提案して」は依頼。デザイナーに考える余地を残すと、もっと良い案が出てきます。

NG / OK フィードバック対比

悪い言い方と、その直し方をセットで見ておきましょう。

「もっとイケてる感じで」「次までに直しておいて」のような、具体性のない・丸投げのコメントも避けます。何を・なぜ・いつまでには、伝える側の責任です。細かな作業指示より、目的と違和感を伝えるほうが、良い結果につながります。

4. 「キメラデザイン」を防ぐ — 最初に決定権者を明確に

キメラの典型

デザインの議論を経て、最終形が「ちぐはぐ」になることがあります。 社長は「赤を入れたい」、上司は「モダンに」、現場は「親しみを」 — それぞれの意見を平等に反映した結果、どれも中途半端な「キメラ」状態が完成します。 これは現場で何度も見るパターンです。

原因

キメラが生まれる原因は明確です。 決定権者が明確でない。 全員の意見を平等に反映しようとして、何も決めきれない。 結果として、誰の意見も完全には通らない、誰にも刺さらないデザインが出来上がります。

防ぎ方は「最初に決め方を決める」こと

キメラの防ぎ方は、第2章 Lesson 1 で目的を関係者と合意したときと同じ。「決め方」を先に決めておくことです。

• 最初に「誰が決めるか」を明確にする(プロジェクト責任者 or 最終決定者)
• 他部門は「意見を言う」だけ、決定はしない
• 各意見はフィルター(目的に貢献するか)してから決定者へ

意見を集めることと、決定することを分ける。 これがキメラ防止の基本構造です。

デザインレビュー会議の設計

レビュー会議には、これらのルールを組み込んでおくとうまく回ります。 参加者を絞る、意見と決定を分ける、進行役を立てる。 特に進行役は、「これは意見ですね、決定は後ほど」と適切に流す役を担います。

「私の意見は通らなくてもいい」を全員が合意してから始める

レビューを始める前に、全員でこう確認しておきたいところです。 「私の意見は通らなくてもいい、ただ目的のために意見は出す」。 この合意があるとないとで、議論の進み方が大きく変わります。 意見が通らなくても納得できる文化、これがキメラ防止の出発点です。

5. 目的に照らして評価する 5 つの問い(チェックリスト)

【「印象 × 行動」を下支えする基礎品質】を確認したあと、デザインを目的に照らして見るための 5 問です。どのデザインカンプ(完成イメージのデザイン案)・どのレビュー会議でも、この 5 問を通すようにしておくと安心です。

• ターゲットに与えたい印象を与えているか(見るポイント：色・写真・余白のトーン／悪い例：狙いは「安心」なのに、とがった印象)
• 取ってほしい行動が明確か(見るポイント：次にどこを押せばいいかが一目でわかるか)
• ファーストビューで主軸が伝わるか(見るポイント：最初の画面だけで「誰向け・何のサイト」が伝わるか)
• CV 動線(成果までの導線)が自然に目に入るか(悪い例：問い合わせボタンが下部に埋もれている)
• ブランドトーンと一致しているか(見るポイント：他ページや会社全体の雰囲気とちぐはぐでないか)

デザインの良し悪しは、センスではなく「目的に照らせるか」で決まります。 印象 × 行動という 1 本の物差しさえ手元にあれば、主観で揉めそうな場面でも落ち着いて舵を取れます。 最初から完璧に判断できなくて大丈夫です。 まずは目の前のデザインを 5 つの問いに通してみるところから、少しずつ慣れていきましょう。