涼し気な氷の表現が見事! 期間限定でしか楽しめない RINGO オリジナルアイスバーのウェブサイト
透明感がほんとうにキレイ……
今回ご紹介するのは、当サイトでも何度かご紹介させていただいている、BAKE Inc. が展開するブランド RINGO の夏季限定商品のウェブサイトです。
夏の限定商品にぴったりの「アイスバー」が主役のサイトなのですが、そのアイスを模した 3D モデルはもちろん、背景に散りばめられた氷の表現がとても涼し気な、楽しいウェブサイトとなっています。
夏季限定のアイスバーの販売は 26 日からスタートということみたいなのですが、一足早くご紹介しようと思います。
リンク:
背景が絶妙に映り込むリアルな質感
今回のサイトは、大きめにレイアウトされたフォントやアイコンなど、全体の構成としては比較的シンプルな構図になっていると思います。
そんななかで、背景部分には WebGL を使った本格的なグラフィクスが描かれるようになっており、その質感や色彩が、思わず目を引く仕上がりになっています。
この上の画像がトップページの冒頭部分に出てくるシーンなのですが、ちょうど画面の中心を境目にして、左側と右側でふたつのフレーバーの製品をそれぞれ紹介しています。
左側は全体的に赤を中心にした色使いで、りんごを直接イメージさせるような質感。
そして右側は、爽やかな印象のイエローとブルーで彩られています。
カーソルを動かすと、左右それぞれのどちらにカーソルが置かれているかによってインタラクティブに画面上に変化が現れるようになっていて、アニメーションもポップな感じで楽しいです。
そして、既に画面にもいくつも映っていますが、背景を時折通りすぎる「氷のかたまり」の質感が本当に素晴らしいです。
若干背景が透けるような感じに見えるのですが、白いラインや背景の模様が映り込む様子が透明感があってなんとも素敵です。
よーく観察してみるとわかるのですが、ほんの僅かにですが、マゼンタのような微妙に背景色とも異なる色がチラリと乗る瞬間があったりして、細かいところまで工夫が凝らされていますね……
ほんとうにすごい!
明るい雰囲気と軽快なアニメーションで、見る人の心をウキウキさせるような、本当に楽しいサイトになっていると思います。
まるで実店舗に置かれているポップがそのままサイトに埋め込まれてしまったかのような見せ方もちょっと珍しい表現方法ですし、リアルタイムに、シーンの様子が次々と変化するのもほどよい刺激になっていると感じました。
デフォルメされている部分と、リアリティ寄りな部分の、そのバランス感がいいからなんですかね…… とても、キレイにまとまっていると思います。
ぜひチェックしてみてください。