
高い完成度の WebGL を駆使して1つの世界を創造した Hubtown Limited のウェブサイト
不動産開発の会社のウェブサイトです
今回ご紹介するのは Hubtown Limited という不動産開発を行っている企業のウェブサイトです。
どうやらインドで活動されている企業さんみたいなのですが、今回のサイトだけを見て不動産開発をしている企業は思い浮かばないですよね……(個人の感想)
ビジュアルにすごくこだわったウェブサイトとなっており、WebGL の実装としての完成度は非常に高いです。
リンク:
Hubtown Limited | Leading Real Estate Developer in India
とにかく WebGL がモリモリ
今回のサイトは、いい意味で WebGL 実装があちらこちらに散りばめられています。
トップページはもとより、下層ページに至るまで、本当にたくさんの WebGL を使ったシーンが用意されています。
またビジュアルのトーンや方向性にもしっかりとした一貫性があり、とても説得力のある視覚的効果を生んでいます。

この上のスクリーンショット、3D シーンが切り替わる際のトランジションの瞬間をキャプチャしたものなのですが、静止画で見てもちょっとなにが起こっているのかわかりにくいかもしれません。
実際に動いている様子は本当に見事なので、ぜひ実物を見てみることをおすすめします。
無理矢理言葉で説明するなら、2つのシーンがタイル状にディストーションしながら切り替わる、という感じで非常にかっこいいトランジション演出となっています。

サイト内にはさまざまな WebGL を用いた演出がありますが、全体に徹底して「青いネオンのような光」の質感が用いられています。
露骨に光るパーティクルやラインとして描かれているものはわかりやすい例ですが、マップが表示されるコンテンツなどにもその質感が採用されていて、本当に手が込んでいます。
タイル状のディストーション効果も随所で使われており、本当にどこを見ても丁寧な実装で完成度が高いです。

今回のサイトは WebGL 実装もすごいのですが、それ以前にサイト全体の実装がまずすごく完成度が高いように感じます。
技術からデザインまで、能力の高いメンバーがそろったチームで作ったんだろうなという感じがしました。
ビジュアルに限らず、効果音の使い方なんかもかなり洗練されたものを感じますが、個人的にはとにかくこれが不動産開発を事業とする企業のウェブサイトだ、ということがなんとも驚きでした。
不動産業界というと、もっと現実感のあるビジュアルや見せ方を採用することが多い気がするので、こういう方向でステータスを振ってくるのって本当に珍しい事例なのではないでしょうか。
ぜひチェックしてみてください。