
個性的なスタジオの内観やチームメンバーの様子が垣間見える 3D 表現がおもしろい Caffè Design のウェブサイト
遊び心満点の楽しいウェブサイト
今回ご紹介するのは、イタリアのデザインスタジオ Caffè Design のウェブサイトです。
すごく陽気というか、ポップな雰囲気がおもしろいウェブサイトになっていて、3D 的な表現とそれを土台にした 2D 的な表現が渾然一体となった不思議な構成です。
技術的にもすごくおもしろいことをやっているのに、それをいい意味で感じさせない優しく楽しい手触りが素敵です。
リンク:
触り心地がめちゃくちゃいい
今回のサイトは、見た目の印象だけでいうとかなりしっかりとした 3D コンテンツで、スクロールやクリックなどのユーザーの操作に対しての反応も、基本的には 3D 空間のなかで発生します。
具体的にはカメラがグッと動いたり、あるいは 3D シーンのなかに変化が起こったりという具合です。
ただ一部、ポップアップしてくるダイアログのような画面があったりして、そこは普通に平面的な要素で構成されていたりもします。

3D 空間にはさまざまなオブジェクトがみっちりと詰め込まれている感じで、そのなかにはクリックすることで別のタブが開くといった、リンクのような役割を持っているものもあります。
ここでこういう操作をしたらどうなるんだろう? みたいなかなり直感的なわくわくや好奇心を誘発する仕組みみたいなものが感じられる場面が多くて、閲覧者を飽きさせません。
3D オブジェクトとして置かれているラップトップの画面があり、その画面のなかは普通に DOM で構築されたウェブになっている、みたいな変わった表現もあります。

ウェブで表現できるさまざまな技術を組み合わせ、そこに WebGL が主体的な役割を果たすことで 3D シーンとして破綻なく組み立てられています。
画面右下にいるキャラクターが絶えず意味不明な音声でしゃべっていたり、来訪者が自由に書き込めるホワイトボードが用意されていたり……
遊び心にも溢れた楽しいウェブサイトとなっています。

スクリーンショットを見てどういう印象を持たれている方が多いか、わたしは想像するしかありませんがおそらくちょっとネタっぽい感じというか、おもしろ系に全振りしたウェブサイトかな? という印象を受ける人が多いんじゃないでしょうか。
でも実際触ってみるとわかるのですが、ただ面白くしてやろうみたいな短絡的なウェブサイトでは全然なくて、むしろすごく細かく手触り感まで踏まえてチューニングされている感じがあります。
デザインやスタイリングとしてのおもしろさもありますが、技術的な面でもいろいろな興味深い部分があると思います。
ぜひチェックしてみてください。