ユーザーの感情を刺激する5つのデザインテクニック

Sylvia MLewis

Sylviaは、情熱的なフリーのライター。探求するのが好きなジャンルは、グラフィックデザインとテクノロジー。彼女はLogo Pearlで、プロのバナーデザイナーである。彼女についてもっとよく知りたい場合は、Facebookで彼女を友達に加えてください。

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

5 Design Techniques to Incite User Emotion

デザイナーはいつも、Webの基準について話し合ったり、ナビゲーションを作ったり、レイアウトやフォントを選ぶというような即物的なデザイン要素に注力してしまいます。しかしデザインは絶えず進化しており、ユーザーの感情を刺激する方法論もより明確になってきました。

今や、デザイナーはユーザーの感情に触れる何かを提供することで、はじめて本当の体験を与えることができるのだと言っていいでしょう。UIに一味添え、ユーザーの感情を刺激するようなUXを届けるテクニックをいくつかご紹介します。

イラストで個性を加える

「個性がUXとどう関係があるの?」と不思議に思うかもしれません。あなたが想像する以上に、個性はターゲットとするユーザーに大きな影響を与えるのです。個性は、我々の感情をもっともよく表現します。あなたが楽しいか、独創的か、真面目か、怠惰か、実践的か、真摯か、堅実か、などを示してくれるのです。

user-emotion-1

したがって、あなたのブランドに個性を組み入れることで、消費者はあなたの商品やサービスに触れるときに抵抗なく使うことできるのです。たとえば、サルをマスコットにしているMailChimpの例を見てみましょう。このようなイラストをサイトに加えることによって、どのようにしてデザインに喜びを添え、ユーザーの感情を刺激することができるかを示す良い例です。

ミニマリズムで洗練された雰囲気を出す

抜け目のないデザイナーであれば、最近のWebデザインのトレンドについてよく知っているでしょう。これらのトレンドをよく見ると、波のように大きく押し寄せている顕著なトレンドがあります。それはミニマリズムのデザインです。ミニマリズムのデザインは洗練された雰囲気を生みだし、それによってあなたはユーザーの感情に一歩近づくことができます。

yourkarma

最も洗練されたデザインの例の一つがYourKarmaです。デザイナーが、簡単なカラーパレットとミニマルなコンテンツと大きなの画像を組み合わせて、いかに凝った作品を作ったかに注目してください。

パララックスで視覚を刺激する

感情というものがユニークな点は、視覚や聴覚といった人間の感覚を利用して誘発することができる、ということです。パララックスが流行し、手軽に導入できるようになった今では、オーディエンスの視覚を刺激し、興味を引くことは難しいことではなくなりました。

user-emotion-3

たとえばNizoの例を見てください。度肝を抜かれるようなパララックススクローリングサイトです。Nizoは、印象的なスクローリング効果でオーディエンスの目を引き付けます。パララックスのテクニックが人気なのは、その魅力的なアニメーションだけでなく、それが立体的であるかのような錯覚を作り出し、ユーザーに3D体験や、触れているような感覚を与えるからでもあります。

無料のインタラクションをつける

人間は、深い物思いにふけって何もしないで座っているときや、神経質になったりイライラしているいるときなどに何かをいじる傾向にあります。UIに接しているときにも同じような行動を示す傾向が見られます。

そのような行動パターンを利用して、UIに何らかのインタラクティブな要素を組み込み、遊ぶものを提供することもできます。これには、ロールオーバーを用いたアニメーションやカルーセルによるインタラクションなどが含まれます。

user-emotion-4

例えば、Rog.ie‘sのナビゲーションバーは、ユーザーにいじるものを与えています。ユーザーがナビゲーションリンクの上にマウスを当てると、ロゴやアイコンが大きくなって浮き上がり、ユーザーの注意を引きます。

高解像度の肖像写真で感情を誘発する

感情を介する反応は人とつながりや結びつきを形成するのに役立ちます。私たちが、人と面と向かってやりとりするのを好むのもそのためです。面と向かって話すと、パーソナリティや態度や特徴をすぐにとらえることができるからです。

user-emotion-5

Andrea Mann が自分のサイトでやっているように(※)、高解像度の肖像を取り入れることほど、人とのつながりを作るのに役立つことはありません。彼女はクラシカルな自画像を美しく使い、モノクロームフィルターをかけることで、戦略的にそれを背景と一体化させています。

※編集注:現在はサイトデザインが変わってしまっています

まとめ

ブランドに感情的な要素を入れることは、メリットとともにデメリットもあります。それは、感じ方が人によって異なるため、いつも望ましい反応が得られるとは限らないことです。しかし、オーディエンスの感情が動くことは、何の感情も持たれないよりは良いはずです。無感情は何も与えてくれないからです。Maya Angelouは次の名言により、このことを非常にうまく表現しています。

人はあなたが何を言ったか、何をしたかはいずれ忘れるでしょう。しかし、あなたに対してどう感じたかは決して忘れないでしょう ―Maya Angelou


イベント

2017/12/05(火)
Design Thinking Square