丁寧に作られた 3D モデルと心地よい触り心地のインタラクションが織りなす空気感がお見事! Panasonic World
ほどよくデフォルメされた 3D 表現
今回ご紹介するのは、Panasonic の特設サイトです。
たぶん、サイト内に書かれていることやドメインを拝見した感じでは、採用サイトの一部というか、採用につなげるために作られた特設サイトという感じなのかもしれません。
フォトリアル系というよりは、ほどよくデフォルメされたような感じの質感になっていてとても空気感がいいビジュアルに仕上がっています。
リンク:
インタラクションがとにかく心地よい
今回のサイトでは、3D 表現がガッツリと使われています。
バキバキにフォトリアルに仕上げるという感じの方向性ではなく、ちょっとデフォルメされた可愛らしい感じのトーンです。
小さな街が1つそのまま立体化したような感じになっていますね。
この 3D ビューのページがホームになっていて、3D シーン内に置かれたアイコンや、画面の右上にあるメニューなどから各種下層ページへとアクセスすることができます。
3D ビューはマウスを使ってある程度自由に視点を変更できるほか、ホイール操作などでズームすることもできます。
細部までよく確認してみると、すごく細かい部分までしっかり丁寧に作り込まれた 3D モデルであることがわかります。
また、3D シーンのテイストもいい感じなのですが、今回のサイトの最も注目すべきポイントはむしろサイト全体に統一感を持って実装されている心地よいインタラクションだと思います。
これは静止画ではどうしても伝えることができないのですが、アイコンなどの干渉可能なアイテムにカーソルが重なったとき、あるいはカード状のオブジェクトの上をカーソルが動いたときなど、その個性的なインタラクションは本当にすてきな触り心地です。
サイト全体のトーンが優しい感じになっているので、こういうフワッと軽いインタラクションが見事にマッチしていますね。
Panasonic という巨大企業の魅力を、けして堅苦しくすることなく楽しい雰囲気で可視化したような、そんなウェブサイトです。
3D シーンの作りも丁寧で見事ですし、しっかり細部にまでこだわって作り込まれているのが感じられる WebGL 実装となっています。
途中でも書いたように、WebGL 以外の部分も注目すべきポイントがたくさん散りばめられています。
ぜひチェックしてみてください。