ベイクしたテクスチャで高品質に仕上げた箱庭的 WebGL がめちゃくちゃおもしろい Leroy merlin のウェブサイト
平行投影でより強調される箱庭感
今回ご紹介するのは Leroy merlin というフランス（？）の企業のスペシャルサイトです。
この企業自体は、どうやら日本でいうところのホームセンターのように、日用品やガーデニング用品、家財道具などを扱う小売業っぽい感じに見えるのですが、今回のスペシャルサイトはいくつかのコンセプトイメージを 3D 化したもの、ということなのかな？
3D シーンの出来栄えが非常に良くて、見ているだけでめちゃくちゃ楽しいです。
リンク：
よく見るとかなり芸が細かい
今回のサイトでは、まず最初にロード時間がありますが、一度ロードが完了するとすぐに 3D のシーンが描画された状態になります。
今回のサイトの 3D シーンはいわゆる平行投影（正射影）のシーンなので、遠近感のあるパースは掛かっていません。
これにより、より箱庭っぽい感じというか……
まるで模型やおもちゃを見ているような、独特な空気感のある CG に仕上がっています。
ご覧の通り、パッと見た印象がすごくいいですね。
ちょっとだけ技術的な話をすると、陰影の付き方とかがめちゃくちゃリアルに見えると思うのですが、これらはあらかじめテクスチャに陰影を焼き付けておくいわゆる「ベイクした影」なので、レンダリング自体の負荷もけして高くはなく、サクサクと動作します。
加えて、とにかく用意されているデータがめちゃくちゃ多く……
しかもそれらのいずれもが、高いレベルで品質を維持しており、１つ１つ順番に見ていくだけでも本当に楽しいです。
このサイトのコンセプトというかやろうとしていることって、要はモデルルームというか、こういう内装にしたらどうでしょうというような、ライフスタイルの提案だと思うんですよね。
実際にこういった内装にするための家具やインテリア製品なんかを、同社で扱っているということなんでしょうね。
それにしても本当に１つ１つの 3D シーンの完成度が高く、よく見るとそれぞれの物件に合わせた細かい演出がされていたりもします。
たとえば以下の部屋のシーンでは、コンロに置かれた鍋から湯気が立ち昇っていたりするんですが、こういうところも非常によくできています。
平行投影は、パースが掛からないため遠近感があまり強調されず、ある特定の演出を行いたい場合に重宝することがあります。
まるでおもちゃの世界を覗き込んだような独特のテイストが今回のケースでは実にうまく作用していて、写実的なのに模型的で、その違和感もあってすごく面白いビジュアルに仕上がっていますよね。
用意されている 3D データの種類も多く、また部屋を切り替える際のアニメーションもとても工夫されていて面白いです。
ぜひチェックしてみてください。
