楽しい仕掛けがたくさん仕込まれたバーチャルストアを体験できる Carolina Herrera の The Perfume Shop
遊びココロたっぷり
今回ご紹介するのは、ニューヨークを拠点とするファッションブランド、Carolina Herrera のスペシャルサイトです。
WebGL をかなりしっかりと使ったウェブサイトになっていて、3D 的な表現が中心です。
CG として見た目が面白いというのはもちろんのこと、遊び心を感じさせる楽しいインタラクティブコンテンツが用意されています。
リンク:
導線はややわかりにくいかも
今回のサイトは WebGL の 3D 表現がたくさん用意されていて、そういう意味ではリソースがふんだんに使われています。
ポストエフェクトはそこまで表現として使われている感じはなく、単純に 3D の形状やマテリアルでビジュアルを仕上げています。
豊富な 3D シーンが用意されているのですがサイト全体の導線がちょっとわかりにくいというか、やや個性的な感じになっています。慣れれば普通にスイスイ見ていくことができるのですが、最初はちょっと混乱するかもしれません。
サイトに訪れた直後に表示されるトップページから先に進むと、この上の画像にあるような、街の一角を映し出したようなシーンが出てきます。
これがたぶんバーチャルストアの本丸で、コンテンツとしてはメインとなる部分だと思います。
スクロールするか、ドアのあたりをクリックしてやるとストアの中にカメラが移動していき、陳列されている製品を見ることができます。
一見、ファッションブランドだけにハイヒールの新製品なのかなと思ってしまうのですが、どうやらこれは香水みたいですね…… 斬新だ……
今回のサイトの面白いところは、バーチャルストア以外にも実は 3D コンテンツが用意されている点です。
ストアの外観を俯瞰して見ているビューからは、実は左右にもシーンを遷移させることができます。(めちゃくちゃ小さいのですが、左右に矢印のアイコンが出ています)
ニューヨークのストリートを模したと思われるこれらのサイドコンテンツにも工夫が凝らされており、立ち入り禁止のテープをユーザーが自由に張ることができたり、壁紙を変更するインタラクティブコンテンツがあったり、他ではあまり見たことがない感じの楽しい仕掛けになっています。
地下鉄の入り口にテープを張れるって、アイデアがまず面白いですしそれを見事に実装しているのにもびっくりします。
ニューヨークを拠点とするブランドだけに、ニューヨークらしさを感じられるように意図的にコンテンツを精査しているのだと思いますが、ただおしゃれなだけでなく面白さや楽しさもちょうどいい温度感で盛り込まれていると個人的には感じました。
3D コンテンツとしても完成度が高く、技術的な意味でも参考になると思います。
ぜひチェックしてみてください。