センサーを活用した防犯機器やスマートホームデバイスを販売している Nova のウェブサイトがなんとも楽しい!
まるでおもちゃの世界のような雰囲気が秀逸
今回ご紹介するのは、アイスランドの企業でいわゆる「スマートホーム」を実現するための様々なデバイスを販売している Nova という企業です。
カメラや、センサーなどを搭載し、ネットワークで相互に連携しながら動作するスマートホームの仕組みを手軽に実現するための、様々な機器を販売しています。
今回のサイトでは選択した内容に応じてシーン全体の時間軸が変化するなど、かなり細かいところまでしっかりと作り込みがされています。
リンク:
アニメーションやシーンの雰囲気の変化に注目してみよう
今回のサイトは、まるでおもちゃの世界のようなポップで可愛らしい雰囲気が最も大きな特徴となっています。
スマートホーム製品を扱うメーカーだけに、これらが現実の生活のなかでどのように活用できるのかを具体的に示したかったのだと思いますが、この目的は今回のサイトで見事に実現できていますね。
若干のデフォルメがされているとは言っても、シーン全体に配置されているオブジェクトは細部までしっかりと作り込まれていて、日常生活をうまく連想させつつ、製品の特徴を紹介することに成功していると思います。
ご覧のとおり、たくさんの部屋がある大きな家が今回のサイトの舞台です。
様々な色の壁紙が貼られた部屋があり、それぞれに日常生活のなんらかのシーンを想定した作りになっています。部屋のなかを見てみると、どの部屋にもいろいろなオブジェクトが細かく配置されていて、本当にすごいですよね。
シーンのなかには、白く浮き上がって目立つように見えるいくつかのスマートホーム製品が紛れ込んでおり、これをクリックすることで詳細を見ることができるようになっています。
詳細は 3D シーンの半分を覆うような感じで DOM がスライドして表示されるようになっていて、すごく見やすいレイアウトですね。
窓のところに不審な泥棒さんが……!(芸が細かい)
画面の左下のところを見ると、プラスとマイナスのマークが書かれたボタンが配置されているのがわかるかと思いますが、俯瞰の視点で見ることもできますし、少しズームした状態で見ることもできます。
俯瞰した視点では、かなりオブジェクトまでの距離が遠いのでどれがスマートホームに関連した製品なのかちょっとわかりにくい部分もあると思うのですが……
そういうときは、画面の上部にあるリンク文字をクリックしてやると、これが製品をグループごとにフィルタするボタンになっているので、対象となる製品だけをピックアップして強調表示することができます。
グループによっては、シーンが夜になったりもするのですが、これがまたライティングの仕方などよくできています。
全体的に 3D シーンとしての品質が高く、また DOM と連動して「ウェブのコンテンツ」として振る舞わせることについても非常によく考えられており、かなりレベルの高いサイトだと感じました。
特に、利用シーンをしっかりユーザーにイメージさせつつ、スマートホームがいかに便利かということがかなり具体的に(ビジュアルでも)訴求できていて、本当に見事ですね……
時間帯の変化を表現するのも上手で、昼間と夜とでは、全然違った雰囲気になりますね。
ぜひチェックしてみてください。