秀逸なスクロールエフェクトを使ったWebデザイン表現

秀逸なスクロールエフェクトを使ったWebデザイン表現の記事

この記事と同じカテゴリ

ARTNOC記事

[`evernote` not found]

Webサイト内でマウス操作や、タップに応じて動きを付ける事をスクロールエフェクトと言います。
今回はPCサイトにてWebならではの表現で上手くスクロール効果を演出している秀逸な4サイトを紹介します。

 

ぼくとわたしの。SEABREEZE

seabreezeweb-wsidestory

若者向けの清涼剤だけあり、サイトのテーマも思春期の男女の気持ちになっています。
左側の男の子と右側の女の子で交互に表示が別々にスクロールします。何か淡い青春を感じるオシャレな演出です。
画面分割してシーンをスクロールするという演出は中々斬新です。

 

MUJI to Relax

muji-to-relax

無印良品さんのリラックスグッズのサイト。
周知の事実ですが、製品自体がかなりの癒しアイテムです。この製品の心地よい世界観をそのままスクロールで表現されています。
背景などに動画が流れる領域と、スクロール操作に応じて動く箇所に分かれており、それらが秀逸に連動して動きく事で、全体的に快適な操作感と雰囲気を生みだしています。
これはかなりソファが欲しくなります。

 

サンスタートニック シャンプー

tonicworld

男性向けトニックシャンプーという爽快感が売りの商品だけあって、スクロールに応じた動きも爽やかでアクティブです。
派手かつキレのある動きで、無意識に「爽快」という製品効果への期待値も上がる表現になっています。

 

立山の水 さらら

sarara

「山から生まれた水」というコンセプトを上から下へのスクロールの中に組み込んでおり、背景の雫の動きもその世界観が上手く表現されています。
途中で左右方向への動きも入れる事で、単調にならず、目立たせるべきアクセントも効いています。

 

いろいろな表現がありますが、コンセプトに沿った動きには引き込まれる物があります。
その他にも「スクロールエフェクトの効いた」Webデザインは以下のカテゴリページからご覧頂けます。
http://art-noc.com/category/design-taste/scroll-effect

この記事と同じカテゴリ

ARTNOC記事

この記事と同じタグ

WebサイトURL
http://art-noc.com/scroll-effects-6559.html
Webサイト説明
(Description)