TOP UX用語 デザイン・情報設計 レストルフ効果

レストルフ効果 Von Restorff effect

ありきたりなものよりも、特徴的なものの方が覚えやすい現象

人は、似たようなものや同じパターンで情報が並んでいる場合、1つだけ特徴的なものがあると印象に残りやすい。
1933年にドイツの精神科医・小児科医のHedwigヘドヴィッヒvon・フォンRestorff・レストルフ が提唱した心理用語で、孤立効果とも呼ばれる。

明確に異なる情報が印象に残りやすい

以下の図を一瞬だけ見てほしい。

無数の紫の正円の中に、赤い正円や四角形、楕円形が整列している図

多くの人は一つだけ存在する赤い丸や、青色の四角が目に留まるだろう。赤い丸と青い四角は並んでいる「青い丸」と比べると、色や形といった面で明らかに異なっており、他のものよりも記憶に残りやすくなる。

画像をよく見てみると、青い丸の中にも少しだけ色の濃いものや縦長の楕円になっているものもある。

周囲の正円より色の濃い正円と、やや楕円にマークがつけた図

周囲のパターンと似通っていると□や赤丸と違って特異性があると認識しづらい

先ほどの赤い丸や青い四角と同様、色や形を変えてはいるが、同じ青系統の色であったり、他の丸とほぼ同じ円形であるため、明確に異なっている情報とは認識されず、記憶に残りにくい。

特異性を持たせすぎてもNG

レストルフ現象が起こるためには、多くの同じ情報の中に「特異な情報」を入れる必要がある。

webサイトの場合、載っている情報の多くが似ている“統一性のあるページデザイン”と、特異な情報であると”強調”されている場合にレストルフ現象が生じる。

統一感がないサイトや、強調させたものばかり配置しすぎると、特異性も失われ、レストルフ現象が起こらない。それぞれのオブジェクトの主張が強すぎることで、サイト全体が認知負荷の高い(わかりにくい)状態になってしまうので、ユーザーはウェブサイトを利用することに疲れてしまう。

左:強調したオブジェクトを配置しすぎて、認知負荷が高い状態  右:過度な強調を避けてオブジェクトを配置し、認知負荷を下げた状態

左:強調したオブジェクトを配置しすぎて、認知負荷が高い状態
右:過度な強調を避けてオブジェクトを配置し、認知負荷を下げた状態

レストルフ現象は、CTA(call to action)を実現する理論として扱われる。ユーザーの目的が達成しやすいサイトを設計する際に、レストルフ現象を利用する。

レストルフ現象から見るデザイン工程

レストルフ現象を効果的に利用するためには以下の手順でデザインをしていくべきだ。

  1. 目立たせたい情報を決める
  2. 特徴的な情報が複数ある場合はページを分割する
  3. 目立たせるためにコントラストをつける

1. 目立たせたい情報を決める

レストルフ現象を利用する上で、どのコンテンツを記憶に残したいか、目立たせたいかを決めることが重要である。レストルフ現象を発生させることが効果的な例は、次のステップにつながるボタンや判断に重大な影響を及ぼすコンテンツ、重要な注意喚起などである。

2. 特徴的な情報が複数ある場合はページを分割する

目立たせたい情報が多くなってしまうとレストルフ現象がうまく機能しなくなる。1ページの中に特徴的なコンテンツを複数配置してしまった場合は、ページを分けるなどの対応をすべきである。

3. 目立たせるためにコントラストをつける

どのコンテンツを記憶に残したいか決めた後は、それ以外のコンテンツに統一感を持たせてデザインし、重要なコンテンツが際立つようにコントラストをつける。

コントラストをつけるための代表的な方法は、フォントやサイズなどの文字のスタイルを変えることや、余白をつけること、他の情報とは異なる色を使用することである。

文字の羅列より、コントラストをつけると情報が見やすくなる

文字の羅列より、コントラストをつけると情報が見やすくなる

関連用語

参考サイト

東京在住のWEBデザイナー。 趣味:映画鑑賞、気分がノってる時の料理 好きな食べ物:ビリヤニ、野菜、虫 マイブーム:テキスト読み上げ機能での読書

「UX用語」のカテゴリー