必要、それとも不要!?パララックスエフェクトとは?

今回は、最近注目のウェブデザイン手法「パララックスエフェクト」を取り上げます。

パララックスとは「視差」のことで、「視差効果」とも呼ばれます。
人は何かを見るとき、両目を同時に使いますが、左右の見える角度の違いによって、距離感や奥行きなどの立体感を感じることができます。この両目でモノを見る際の、角度の差のことをパララックス(視差)といいます。

ウェブデザインで言うパララックス効果は、画面スクロールする際に背景のイラストや画像に、異なる早さや動きのパーツなどを組み合わせて、立体感、奥行き感を表現する手法です。

日本では、東京スカイツリーのサイトが、パララックスエフェクトを採用しているサイトとして有名です。
東京スカイツリー

見ていただくとわかりますが、このウェブサイトでは、スカイツリーの頂上からページを下にスクロールしていくにつれ、徐々に地上に近づいていくデザインです。
その途中途中で、スカイツリーの魅力を伝えるために、スカイツリー内の施設案内を表示するパララックスエフェクトが使われています。

海外では、下記のような面白いサイトもあります。
Weight and Things

これは、自分の体重を入力すると、さまざまなモノや動物などの数に換算してくれるというウェブサイトです。
私の体重を入力すると、寿司がなんと4,000個分!他にも色々と換算してくれるので、一度、試してみて下さい。

パララックスエフェクトの目的は、サービスや商品をよりわかりやすく、また魅力的に伝えることです。
そのため、ページのスクロールに合ったストーリーを作成することが重要となります。

そのポイントとしては、

●過度に情報を詰め過ぎず、繰り出される内容が主題に沿った流れになること
●効果を多用せず、効果を狙ったパーツや動きに意味や妥当性があること
●変則的な動きを避けてわかりやすい動きにする

などがあります。

つまり、効果そのものを過度に見せるのではなく、サービスやコンテンツの理解を深めてもらうことを意識することが重要です。

最近では、AppleのiOS 7に搭載された新機能でも、パララックス効果が取り入れられています。
ただ、現時点では壁紙とSafariのタブ切替画面でしかその効果を体感できないようです。
実用上なくても困らないので、単に電池の無駄遣いだという指摘や、この画面をみて「酔ってしまう」という声などもあります。

このようにデメリットもあるパララックスエフェクトですが、その点に留意すれば、例えば、体内の臓器への薬剤の作用を見せる動画など、医薬品マーケティングでもコンテンツを魅力的にデザインできそうです。

最近では、医薬品マーケティングにおいても、コンテンツの内容だけで差をつけるのが難しくなってきているので、こうした手法を取り入れることも1つの選択肢になるのでないでしょうか?