
3D なんだけど 2D な不思議な質感と構成が特徴的な Brunello Cucinelli のウェブサイト
インタラクティブな絵本のような雰囲気
今回ご紹介するのは BRUNELLO CUCINELLI(ブルネロクチネリ)というファッションブランドのウェブサイトです。
わたしはファッションなどに疎くて名前を知らなかったのですが、イタリア発祥のファッションブランドで、日本では銀座にもショップがあるようです。公式サイトも、日本語版がしっかり用意されていますね。
今回のサイトはオンラインのブティックみたいな位置づけなんですかね…… 雰囲気たっぷりのウェブサイトから、直接ショップサイトへとジャンプできるようになっています。
リンク:
Hotel of Dreams | Gift Guide | Brunello Cucinelli
利用シーンに応じて振り分けられた製品ページへ
今回のサイトは、いくつかのセクションが用意されており、それぞれのセクションごとに異なるページへとリンクが張られています。
要するに、屋内シーン向けの、あるいは屋外シーン向けの、といったようにユースケースごとに分類されたコレクションがあり、それぞれのコレクションへリンクする各セクションを WebGL でビジュアル化したような感じみたいです。
サイトの入口はまず大きな鍵穴を見つめる視線から始まります。
サイト内に共通操作があり、どのように操作したらいいかは適切にインターフェースが用意されています。
たとえばボタンを掴んで下方向にドラッグ操作すればいいんだな、といったように、具体的にどう操作したらよいかが視覚的に示される感じですね。
この共通する操作は、どのセクションでも有効になっており、PC で閲覧中であればスクロール操作でも代替できるようです。
シンプルな操作で閲覧できるので、とてもシンプルな操作性だと思います。
静止画で見てもちょっとわかりにくいかと思いますが、上のスクリーンショットのように「平面的なイラスト」を、複数の奥行き感で「レイヤーのように重ねた」シーンが WebGL によって描かれます。
オブジェクトは立体的な構造を持っているわけではなく、すべてスプライト、つまり平面です。
カーソルの動きに応じて微妙に視線が動くように各種オブジェクトが動くのですが、なんとも不思議な世界観ですね。
あえてイラストを使っていることで、動く絵本のような独特な空気感が演出されていると思います。
ファッションブランドって「ブランドとしてのアイデンティティ」をウェブに投影するのが上手ですよね。正確には、ファッションブランドの事例を手掛けるような制作会社が上手、ということなんでしょうけれども……
今回紹介している BRUNELLO CUCINELLI は、イタリアでカシミア製品を扱うところからスタートしたブランドらしいのですが、優しく温かい、どこか家族や恋人など親しい間柄の人たちを想像させるような、そんな空気感がサイト内に漂っています。
あえて絵本風のビジュアルにしているのも、狙ってそうしているんでしょうね。今回のサイトが仮にフル 3D だったら、全然違ったイメージになってしまいますもんね。
ぜひチェックしてみてください。