私たちデザイナーにとっては受け入れがたい事実ですが、クライアントの目標達成の助けにならなければ、どれだけ美しい作品でも意味がありません。どのクライアントにとっても最優先すべきことは、Webサイトと商品に魅力を感じてもらうことです。
攻撃的なデジタルマーケティング（Web広告やバナー、ポップアップ）の時代は終わりました。ミレニアル世代や高齢者も含め、現在のネットユーザーは余計なもののない「クリーン」で美しいWebサイトの閲覧体験を求めています。広告ブロックアプリについての検索数がこの５年間でどれだけ増えたかを考えてみてください。
あらゆるデバイスに広告ブロッカーがインストールされているので、Web広告やバナーなどの簡単で頼りになる広告ツールをあきらめて、製品やサービス、アイデアを、もっと洗練された手段で広告して販売する方法を探さなければいけません。
そのような手段のひとつに「感情に訴えるデザイン」があります。これはユーザーの感情に訴えかけて訪問者をWebサイトに引き止めることを目的とした、デザインへの心理学的アプローチです。
たとえば、清涼飲料水の販売促進用Webサイトをデザインすることになったら、次の２つの方法があります。
- 商品とブランドを前面に押し出す
- 商品やブランドを適した雰囲気の中で登場させる
Webサイトを訪れると、若者たちが晴れ渡ったビーチでバレーボールをしている画像（またはビデオクリップ）が目に入ったと想像してみてください。バレーボールのファンではなくても、若者たちが楽しんでいる気分は伝わってくるでしょう。その中で若者のひとりが冷たい飲み物でリフレッシュしているのを見れば、あなたはのどの渇きを感じるに違いありません。
この画像や映像の目的はビーチバレーではなく、あるソーダ水ブランドを宣伝することです。しかし、いきなりソーダ水を飲みたいという気分にさせるのではなく、楽しい気分やゲーム感覚を通して、次第にそう思わせるのです。
感情レベルを理解する
複雑なアニメーションや軽い動画クリップがバーチャルな空間に広がっていったWeb 2.0の初期から、デザイナーはWebサイトにおける感情の影響を研究してきました。Aaron Walter氏が2005年に書いた『感情に訴えるデザイン』はすぐにベストセラーになり、現代の多くのWebデザイナーの必読書となっています。
Walter氏は同書でWebサイトに対するユーザーの感情を、感動する、興味を抱く、関わりを持つ、という３つのステージに分けています。
１. 直感レベル：「感動する」
第一印象は理性的な判断とは無関係に、無意識のうちに持つものです。ユーザーはWebサイトを訪れるとほぼ同時に良し悪しを評価しています。
ユーザーはそれに基づいて、Webサイトのすべてのコンテンツに対してポジティブな印象を持ち続けます。そのため、直感的に良いと思えるデザインがポジティブな反応だけを引き起こすというのは何ら不思議なことではありません。
２. 行動レベル：「興味を抱く」
一見してかっこよいものがあると、脳はその正体を分析しようとします。これによっていくつか行動パターンが引き起こされ、気に入ったものに対する感情が高ぶり始めます。そのため感情に訴えるデザインの第２段階は、ユーザーにもっと詳しく知りたいと思わせるWebサイトデザインにすることなのです。
ユーザーは興味をそそられると、ぺージをスクロールしたり、リンクをたどったり、コールトゥアクション（CTA）に反応したりせずにはいられません。
３. 熟考レベル：「関わりを持つ」
認知プロセスの中でもっとも高いレベルです。ここでは、見ているものの正体を分析して論理的な判断を下します。ユーザーは前述の２つの段階を踏まえてこのレベルに到達します。このレベルでは、商品は何なのか、何の役に立つのか、など手の内をすべて明かさなければなりません。
Webサイトの意図が商品を売ることであることをユーザーは理解しますが、それまでの体験によるポジティブな感情のおかげで、Webサイトの意図に反感を持たれることはありません。
感情に訴えるデザインは一連の心理的反応を呼び起こそうとするものです。まず驚かせることでユーザーの心をつかみ、次にもっと詳しく知りたいと思わせ、最後にそのすべてを正しく理解してもらいましょう。
それでは、感情を惹きつけるビジュアルデザインに役立つ手法を見てみましょう。
感情デザインのための手法
商品やブランドのビジュアルを制作するために、どのデザイナーも使っている３つのアプローチを見て、感情に訴えるデザインの視点からこれらを分析してみましょう。
１. ブランドルールブック
ブランドを感情に訴えて宣伝するのであれば、まず企業や商品のブランドのルールブックを研究しなければいけません。すぐれたブランドルールブックやスタイルガイドには、色彩設計や指定フォント、グリッドシステムの原則、広告スペースでの使用例などが掲載されています。
ブランドアイデンティティにはすでに感情的要素が組み込まれていると考えなければなりません。多くのデザイナーはその要素をくみ取り、Webサイト全体へ広げます。最終的には単なるWebサイトではなく、ロゴのようなブランドを体現するものができあがります。
ブランドルールブックからブランドのエッセンスを取り出して使うためのもっと良い方法は、ブランドのエッセンスを前面に出さずに、それとなくほのめかすことです。ロゴはページ左上の適切な場所に置き、残りのスペースはユーザーがブランドを連想するようなもののために使いましょう。
２. 色
一般的なレベルでの色の意味はよく知られています。赤は危険と攻撃。青はおだやかさ。緑は承認、自由、自然。しかし感情に訴えるデザインの場合、色そのものよりもトーン（明度と彩度の組み合わせ）の方がはるかに重要です。トーンを明るくするか暗くするかで、さまざまな方向へ感情を動かすことができます。
次の動画はBen Lukas Boysenのディスコグラフィの無音ショートビデオです。ここではすべての感情が色で表現されています。音楽がなくても、色によってそれぞれの曲が表現する感情を感じることができます。
文化によって色が持つ意味が異なることを頭に入れておいてください。日本では白は悲しみを表し、中近東では黄色は嫌がられます。さまざまな文化において色が何を表すかについて、こちらの記事に興味深い情報をまとめています。
３. 環境
ブランドそのものよりも、それを取り巻いているものの方がはるかに簡単に感情を呼び起こします。ブランドは、ユーザーがもっとも理解しやすい環境の中におかなければいけません。
暑い日の飲み物はわかりやすい例のひとつです。唐突に清涼飲料水が飲みたくなることはめったにありません。しかし休暇中の晴れた日にビーチやプールサイドに横たわっているときなどを想起させれば話は別です。
感情に訴えるデザインの始祖Aaron Walter氏は「感情に訴えるデザインはありふれたユーザーを熱狂的な支持者に変え、彼らはポジティブな体験をほかの人々に喜んで伝えてくれます」と著書で締めくくっています。
実際どのWebサイトも、視覚、感覚、情報、楽しみなど体験に関するものです。Webサイトがこれらの体験をひとつでも提供できれば、ユーザーは何度もサイトを訪れたくなるでしょう。そしてクライアントのWebサイトを普段から訪れるユーザーの数が増えることは、クライアントの満足感に繋がるもっとも良い方法です。
