ちょっと古めかしいテイストをあえて WebGL を利用して表現した BlueBox Design のウェブサイトがおもしろい

doxas : 2024-10-22 12:38:32

ヨーロッパの大航海時代を連想させる

今回ご紹介するのは、BlueBox Design というスタジオのウェブサイトです。

いわゆるオフィシャルなウェブサイトとは別に、特別に用意されたスペシャルサイト的な位置づけなのかなと想像してますが、全編が WebGL による 3D 表現となっており、内容も結構手が込んでいます。

いい意味でかなり個性のあるビジュアルをしていて、あまりほかでは見たことがないウェブサイトだなと思います。

今回のサイトのビジュアルのなかで、最も目を引くのは枠線的な表現を行っている部分かなと思います。

いわゆる、トゥーンレンダリングなどで用いられるエッジの表現と同質のものだと思いますが、なんかこういうの久々に見たなという感じが個人的にはしますね。

技術やアイデアという意味ではかなり昔からあるテクニックなのですが、やっぱりなんか雰囲気が独特で目を引きます。

ご覧のとおり、画面の半分以上を台座のようなものが占めていて、その台座が波打つように動きながら、時には海に、時には地図になったりと表情を変えます。

この台座の上には一隻の船（帆船）が絶えず浮かんでおり、この船がトゥーンレンダリング風に枠線を強調したような質感で描かれます。

あえてこのような質感にしているのだと思いますが、ストーリーを感じさせるビジュアルで非常に見事だなと感じました。

台座の部分は本当に時と場合によってまったく違った姿になるので、こういうところも工夫が凝らされているなと感心してしまいます。

場面によっては、地面がニョキニョキと生えてくるところもあり、これ考えた人ほんとうにすごいですね……

3D 表現としても奇をてらったようでいて、ある意味では基本的なテクニックの組み合わせだけでこれを実装している感じがあり、職人技的なすごさを感じます。

3D シーンの雰囲気にマッチしたフォントやカラーリングで、まるで１つのストーリー、物語を見せられているかのような気分になりますね。

WebGL という技術も含め、ウェブって結局テクノロジー的な側面が強いプラットフォーム・メディアだと思うので、見せ方としてサイバーパンクな感じや宇宙っぽい感じがマッチしやすく、こういう懐古的なビジュアルって逆に珍しいですよね。

スクロールに連動して次々にシーンが切り替わっていく様子も見事で、付けられているモーションやそのスピード感など、とにかく完成度が高いなと個人的には感じました。