感情を揺さぶるWebサイトをデザインする方法

Alan Smith

AlanはIT分野で非常に多くの経験を持つ熱心な技術ブロガーです。現在はカリフォルニアのロサンゼルスにあるウェブサイトのデザイン、開発、インターネットマーケティングを手掛けるSPINX Digital Agencyで仕事をしています。

この記事はUsabilityGeekからの翻訳転載です。配信元または著者の許可を得て配信しています。

How To Design A Website With Emotional Impact (2015-11-02)

私たち人間は、自分たちが論理に従って選択をする理性的な人間だと思っています。しかし実際は非常に感情的な生き物です。理性的だと考えようとすればするほど、感情は決断により大きな影響を与えます。

WebデザイナーはWebサイトがどのような感情を引き起こすものかを考慮に入れなければなりません。あなたの意図することを伝えるだけでは十分ではないのです。感情的な反応を引き出せないWebサイトはすぐに忘れられてしまいます。Webサイトをデザインするときには、人の感情を考慮する必要があります。

感情とWebデザイン

Donald Normanは『Emotional Design』という著書の中で、次のように述べています

審美的な感情を満たすものにユーザーはより注目する。このコンセプトはほとんどすべてに適用できる。もちろんWebサイトにも適用できる。

感情はポジティブなものにもネガティブなものにも成り得ますし、また特定のデザイン要素への反応としても引き起こされます。こうした反応は女性か男性かによって、また文化によっても違ってきます。Dianne Cyrは次のように述べています

オンラインサイトの質感やフォーマットが気に入らなければ、女性はそれに夢中にならない。

とりわけeコマースサイトについては、これは重要な示唆を含んでいます(オンラインショッピングサイトでは、感情は非常に関連性の高い事柄です)。

コンセプトから始める

見込み客を探し始める前に、Webサイトデザインのコンセプトが必要です。何が対象とする顧客にアピールし、どのようなメッセージを送りたいのか理解しておく必要があります。地図無しで大陸を横断することはできません。地図がなければ目的地に到達するのに非常な労力がかかるでしょう。

Webサイトをデザインするとき、以下のような要素について考慮しなくてはなりません。

・伝えたいメッセージ

・あなたの会社のイメージ

・見込み客たちにメッセージが伝わりやすくなるデザインの特徴

・どのようなデザインの特徴がメッセージを損なってしまうか

伝えたいメッセージは何か?

メッセージを明確にすることから始めると、プロセスをはるかにシンプルにすることができます。メッセージに含まれる感情を強調したコンテンツによって、Webサイトをより成功に近づけることができます。メッセージに反するようなコンテンツがないか、よく注意を払ってください。ここには議論の余地がありますが、注意深く考える必要があります。

design-website-emotional-impact-key-measures

出典(The MediaBriefing


加えて、伝達したいコンテンツの質感にも特別な注意を払ってください。人がユーモアを愛することは誰でも知っています。ですから雰囲気をやわらかくし、ユーザーを心地よくするために注意深くユーモアを付け加えてください。

この注意深く、というところが重要です。あなたがユーモラスだと思うところが読者にとってもユーモラスだとは限りません。また、ユーモアの使い過ぎは逆効果になります。なぜなら、ユーザーはWebサイト(とあなたの会社)のことをプロフェッショナルではないと感じるかもしれないからです。

このように、メッセージは言葉やデザイン要素以上のものです。これは、各要素が望んだ感情を引き起こすことを含んでいます。テキストからデザイン要素まですべてのコンテンツの要素によって意味のあるページが作られます。それぞれの要素が調和しているかチェックしてください。さもなければ、やってきたユーザーの多くが混乱してしまうでしょう。

メッセージとそれに付随する感情は企業のイメージにマッチするものでなくてはなりません。ユーザーは一貫性を好み、世間に認められた企業はWebページのメッセージを企業イメージに合うように仕立てています。さもなければ、人々は混乱してしまいます。

ユーザーのビュー数を増大させるためにも、決してユーザーを混乱させてはいけません。とりわけ、Webサイトへの導入となるトップページやランディングページではこのことが重要です。メッセージをシンプルにし、感情的な反応を明確にし、強調したいところでのみ、デザインのルールを破るようにしてください。

メッセージを伝える

Webサイトのすべての要素は意味があるべきです。無意味なデザインは訪れた人に不満を与えます。いくつかの要素が明らかな意味を持っていなければ、それが何かわからないのでユーザーは不満を持つか、さもなければ勝手に個人的な意味付けをしてしまうでしょう。意味を深読みさせることは悪くはなさそうですが、あなたの伝えたいメッセージと矛盾してしまうかもしれません。

ユーザーはあなたの選択したすべてのデザイン要素に感情を覚えます。明確な意味付けをすることで、ユーザーとあなたの関わりをシンプルにしましょう。

一貫性は明確なメッセージを送る上で重要な要素です。一貫性はWebサイトのデザインにおいては文章に矛盾がないようにすること以上に重要です。これはページのすべての要素が調和し、企業イメージにマッチすることを意味します。デザインの意味と感情の一貫性を維持し、混乱させないようにしましょう。

一貫性はすべての媒体で維持するべきです。ロゴマークをWebサイトでもメールでも、ソーシャルメディアでも使ってください。そうすれば、あなたの企業がすぐに思い浮かぶようになります。そのような関連性は、とくに社会的なイメージを確立したい場合には重要な価値があります。そうすることで、ロゴマークはそれだけで一つの意味を思い起こさせることができるのです。

注意深くデザイン要素を選択する

感情を動かすようなWebサイトをデザインするときは、ページのあらゆる側面を考慮しなくてはいけません。色や画像の選択、フォントに至るまで、すべてのページの要素が全体として調和するようにしてください。主題について書き終わっても、ページをデザインする場合には色がとりわけ大事な要素だということを常に頭においてください。

黄色は幸福、青は静穏、赤は興奮といったように、色は感情を引き起こすきっかけになります。個人の色の好みによっても違いますが、平均的なユーザーがどういう感情を感じるかについては確かな説があります。

使う画像に類似性を持たせると、大きな感情を与えることができます。画像同士が近くにあり、大きな視野を占めるほど緊迫感や親密感といった感情を引き起こすことができます。距離感はしばしば、そのまま感情的な距離感となります。イメージが視野の大きな部分を占めていなければ、ユーザーはそれを重要だとは思わず、意味のないものだと見なします。

また、画像が何を描いているかによってそれに応じた感情を引き起こすことができます。たとえば微笑んでいる女の子の写真はポジティブな感情を表しています。

design-website-emotional-impact-young-wed

出典(One Extra Pixel

どのような意味のある画像であれ、コンテクスト(文脈)に合ったものでなければなりません。なぜそこにそのイメージがあるのか、ユーザーに考えこませてはいけません。

あなたがとくにユニークで時代の最先端の感覚をもっているのでなければ、標準的なインターフェースを使用するようにしてください。そうでないものを使う場合にはその目的を明確にしてください。標準的だと考えられているデザインのルールを理由もなく破ることは良いアイデアではありません。そうした変更が改善につながり、あなたがその理由を理解しているときにのみ、このルールを逸脱することができます。

どうしてもルールから離れたい場合には、この変更が明確で、それがどこにあるかはっきり分かるようにしてください。誰もメニューバーを探すために苦労をしたいとは思っていません。見る人にそのような苦労をさせることは逆効果になります。奇抜な特徴はWebページの個性を引き立てるかもしれませんが、それがページの機能の妨げになっていないかチェックしてください。大きなイラストをスクロールダウンしたときにようやく現れるメニューなどは、インターフェースのユーザビリティを損なうものです。ユニークなデザインを施そうと思うときはよく注意してください。

単なるフォントの選択でさえ、Webページを完全に脱線させてしまうことがあります。Arial、Times、New Romanといった書体は標準的でプロらしいと見なされています。そうでないフォントは目立つかもしれませんが、プロらしくなく感じさせる可能性もあるのです。

意図的な感情

選択するすべてのデザイン要素の感情的な意図や実用性を理解してください。さもなければ、よくない選択をしてしまう可能性があります。企業イメージに矛盾しない、それにふさわしいフォントを選択してください。

Webサイトをまとめあげるときは個々の要素がお互いにフィットし、また伝えたいメッセージと合致していることを確認してください。よく考えずに混合すると、Webサイトに軽率な印象を与えてしまいます。シンプルさを意図するにしても、シンプルであることと退屈であることには明確な違いがあります。同様に、興奮と混乱との間にも明確に境界線があります。

そこを間違えないようにページを作ってください。感情に訴えるWebページ作りの手助けが必要な場合にはデザインチームを雇うことも考えてください。デザイナーは成功するWebページに重要な要素を知っているので、あなたの伝えたいメッセージを素早く効率的に伝えることができます。技術のないチームにあなたのビジネスを託してはいけません。必要があれば、プロに問い合わせてください。


イベント