絵本のような手描き風イラストと WebGL を用いた 3D 表現が融合した de Bijenkorf のスペシャルサイト
もしかしたら期間限定のサイトかもなので注意
今回ご紹介するのは、オランダにあるデパート de Bijenkorf のスペシャルサイトです。
日本で言うところの三越や高島屋といった、高級デパートなんでしょうか。今回のサイト上ではいくつかの特別なアイテムを森の中に展示したような、ちょっと不思議な世界観が作り込まれています。
読み込んでいる画像などのリソース量がめちゃくちゃ多いからなのか、ちょっと最初のロード部分など一部重く感じる部分があるかもしれません。
また、もしかしたらこちらのサイトはセール期間などに合わせた特設サイトかもしれず、すぐに見られなくなってしまうかもしれないので注意してください。
リンク:
de Bijenkorf • Bewonder en Verwonder
スクロール連動型絵本
今回のサイトのビジュアル的な特徴は、なんといっても手描き風の、まるで絵本のようなイラストの数々です。
画面内を構成する葉や、木の幹、あるいは飛び回る蝶など、多くのものがイラスト調のオブジェクトとして描かれます。
文字やインターフェースそのものについても表現上の工夫が多く見られ、かなりリッチな外見になっています。
上の画像はフランス語の状態でキャプチャしたものですが、画面右下のメニューから英語にすることもできます。
基本的に、シーンはスクロール操作を行うことで自動的にカメラが動き、移り変わっていきます。
蜂のアバターが画面内を漂いながら、案内役のような感じで追従してきてくれるのですが、なにか言葉をしゃべるような演出はなく、それぞれの商品についてもあまり細かく文字で説明されるということはありません。
完全に、ビジュアルの雰囲気で興味を引く感じの内容ですね。
この上の画像を見ると、イラスト調でありながらもしっかりと奥行き感を演出しているのがわかるかと思います。
カメラに近い位置を横切るオブジェクトは最初からシルエットがぼやけた状態になっているので、被写界深度のようなテイストが演出されるようになっていますね。
静止画ではわかりにくいかと思いますが、カメラワークはかなりダイナミックで前後に大きく前進・後退するような場面もあるため、実際に動いているのを見るとめちゃくちゃ臨場感があります。
ウェブサイトの機能という意味では、せいぜいハートマークのアイコンをクリックすることでお気に入りとしてマークしておく、くらいのことしかできません。
実際に EC サイトのほうで買物はしてくださいね~ という割り切りで、こちらのサイトではビジュアル的な面白さにステータスを全振りしているのだと思います。
効果音の感じも森の中をイメージさせた内容になっていて、まるで絵本の世界に入ってしまったかのような錯覚を覚える、高品質なウェブサイトだと思います。
冒頭にも書いたとおり、ちょっと重い感じがするのに注意が必要なのと、期間限定のスペシャルサイトだと思うので気になる方は早めにチェックしてみてください。