WebGallery

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

*

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

   

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

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

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

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

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

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

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

  関連記事

アニメーションを使って分かりやすく見所を紹介している「びわ湖硫水船」のサイト

京都府京都市で乗船できる「びわ湖硫水船」のサイトです。 ファーストビューに大きく …

金額やカテゴリを絞って特典を選べる検索フォームが便利!岡山県備前市のふるさと納税サイト

岡山県備前市のふるさと納税特設サイトです。 ファーストビューの写真の配置がとても …

10月から開催している「パリグラフィック」展のサイトがシンプルでおしゃれ!

2017年10月18日から2018年の1月8日まで、東京・丸の内にある三菱一号館 …

東京にある建設会社のサイトが、和風なデザインでカッコいい!

東京都港区にある建設会社「株式会社タカノハ住建」のホームページです。 ファースト …

メニューに写真とキャッチフレーズを載せた「アクエリアス」

今年の6月20日に販売されるアクエリアスの新製品 先行モニター募集のページです。 …

コンテンツ毎に文章の配置を変え、見出しを強調するレイアウトにする

静岡県伊東市にある隠れ宿「花の雲」のホームページです。 まず、画面いっぱいに表示 …

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

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

写真を様々な形に切り取ることでアクセントに

  表参道にある鳥カフェのホームページです。アクセントに様々な種類の鳥 …

冬の夜の静まり返った雰囲気を、画面いっぱいに表示される星空や雪のアニメーションを使って表現

2016年6月に、京都府南丹市にある宿泊や日帰りでの温泉が楽しめる温浴宿泊施設「 …

北海道にある「朱鞠内湖」のサイトがシンプルだけど写真を大胆に使ったレイアウトでカッコいい!

北海道雨竜郡幌加内町にある「Kake Shumarinai(朱鞠内湖)」のホーム …