倉庫という空間をまるごと 3D で EC サイトのコンテンツに落とし込んだ AZERO のウェブサイト
コンセプトがしっかりしてる
今回ご紹介するのは AZERO というファッションブランドのウェブサイトです。
いわゆるアパレルに分類される業態だと思うのですが、今回紹介するウェブサイトがコーポレートサイトでありながら同時に EC サイトでもあるという構造で作られており、実際に商品を購入する体験も含めて設計されている感じがします。
モータースポーツにインスピレーションを得た製品・デザインが多いみたいです。
リンク：
AZERO - Welcome to our warehouse
俯瞰の視点から倉庫のなかへ
今回のサイトのイントロ演出はなかなか凝っていて、倉庫の骨組みを俯瞰する視点から 3D シーンが始まります。
ロゴマークとカメラの視点とがダイナミックに動きながら、スピード感のあるモーションで倉庫のなかへと入っていくイントロ演出は、サイトを訪れたユーザーに対して一気に世界観を見せていくつくりです。
全体に暗い印象の色使いですが、その分、動きを使って演出が派手めに味付けされている感じがします。
スクリーンショットで見ると、ちょっと暗すぎる感じがしますね……
ただ、動いている様子はそんなに見にくいというほど暗い感じはしないですが、でもこれは感じ方に個人差があるかもしれません。
全体的にコントラストが結構低めに統一されているのは、製品の写真など、カラーで描かれる要素をより印象的に見せるためなのかもしれません。
製品の写真などはあくまでも画像、映像などの平面的な素材です。
布で作られている製品を 3D 化するというのは、結構がんばって質感表現を作り込まないとすごくチープな印象に仕上がってしまう傾向があると思うので、倉庫の中に 3D モデルを配置するようなアプローチはここでは取らなかったのかなと想像します。
倉庫内の配管やフォークリフトといった機械的な部分だけを 3D 化することで統一感を持たせているのかなとも感じました。
アパレル系の WebGL 事例では、製品自体を 3D 化している場合とそうでない場合とで、結構方向性がはっきり別れます。
先にも書いたように、洋服などを 3D 化するのはどうしても手触り感などの質感が表現しにくいのでハードルが高い印象があります。
今回のケースはそこは割り切って作っているように個人的には感じられて、あえて製品はキレイな写真素材だけで見せつつ、世界観のほうを 3D で表現したのかなと思いました。
ぜひチェックしてみてください。
