WebGallery

Webデザインの初心者がスマートフォン対応しているWebサイトを淡々と紹介していくサイトギャラリーです。

*

「Golden」にかけた黄金のアニメーションがとても幻想的!フェレロ ロシェのキャンペーン公式サイト

   

「Ferrero Rocher(フェレロ ロシェ)」のキャンペーン公式サイトです。

写真の商品部分はキラキラしているようなエフェクトを散りばめることで、中央の女性のように思わず商品に手が伸びてしまうような魅力的な写真になっています。

ページ全体が1ページごとにスクロールして画面遷移する仕組みになっており、余白を大胆に使ったデザインで高級感のあるwebサイトになっています!
文章を必要最小限に抑え写真を大きく配置することで、より印象的なコンテンツになっています。特に、ラインナップのコンテンツは暗めの背景に金色の商品が輝いており、どこか神秘的にも感じる絶妙な配置です。

クリックすると拡大されます。

その下のインスタグラムのコンテンツも、ただ商品をふわっと表示させるのではなくちょっと変わったアニメーションを使用しています。
何より1枚1枚の写真がとてもオシャレ!

そして、フッター部分にも動画を設置しています…!しかも画面いっぱいに配置されている!最後まで世界観が統一されている、商品の世界に酔いしれることが出来る素敵なデザインです。
こういったアニメーションを使ったデザインはとても参考になりますね…私も早くここまで出来るようになりたいです!

 - キャンペーンサイト, 写真で表現, 動きで表現

  関連記事

コンテンツと雲のスクロール量を変えることで奥行きを出したデザインにしたイベントサイトがおしゃれ!

2017年の5月4日・5日・6日の3日間にわたって蘇我スポーツ公園で開催される「 …

テキストが最大限に排除されたトップページがカッコいい設計事務所

広島県広島市にある設計事務所「株式会社トランスデザイン」がプロデュースした新築の …

白を基調にして衣装や料理の写真を際立たせているモダンレストランのサイトがオシャレ!

愛知県安城市にある和モダンレストラン「hana no utage(花の宴)」のホ …

ロゴマークにマウスをホバーさせるとアニメーションになる仕組み

東京都台東区にあるランドセル工業会が運営している「ランドセルくらぶ」のホームペー …

東京都青山にある美容室のサイトがシンプルでカッコいい!

東京都港区青山にあるヘアサロン「Beauty Palor arca(アルカ)」の …

舌でも目でも石巻を楽しむことができる、「泳ぎ寿司 石巻」

今年の3月6日・11日に東京都にある「代々木ビレッジ code kurkku」で …

手描きのようなアイコンで視認性だけでなく、見た目にも可愛らしさを

東京都中央区新川にある和菓子屋「翠江堂(すいこうどう)」のホームページです。 左 …

「伝統」と「革新」を伝える「廣榮堂 採用サイト」

岡山で160年の歴史を誇る老舗和菓子屋「廣榮堂」の採用ページです。 学生たちをタ …

コンテンツごとに様々な動きをつけたデザイン

新潟県南魚沼市にある道の駅「南魚沼」のホームページです。 大きく表示される道の駅 …

インパクトのある構図で撮影された写真で、思わずクリックしたくなるような旅行記ブログが素敵!

西村 沙羊子さんの旅行記サイト「salt | oniguili」です。 ファース …