
パーティクルを使ってさまざまな状況を表現・再現した Slap Apps のスペシャルサイト
なんだかとっても不思議です
今回ご紹介するのは Slap Apps というチームのウェブサイトです。
Apps と入っていますが、なにか固有のアプリのことを言っているのではなくてそういう社名? っぽいですね。ドイツを拠点とするチームのようなんですが、開発からブランディングまで広く手掛けているようです。
サイト内にはパーティクルを駆使した表現が WebGL を利用して構築されています。
リンク:
Slap Apps - Top-class web experiences
独特な空気感
今回のサイトのトップページ、および下層ページに至るまで、あらゆるシーンは 3D シーンといくつかのテキストで構成されています。
たぶん、なにかスペシャルサイト的な位置づけのウェブサイトという感じで、いわゆるコーポレートサイトとは別に公開されているページみたいです。
トップページの冒頭から、パーティクルを用いた 3D 表現が訪問者を出迎えます。
ちなみにトップページの場面ではスクロール等の操作ができず、クリックでゲートのようなシルエットをクリックすることで下層ページへ移動する仕組みになっています。

今回のサイトのパーティクルの特徴、と言ってもいいと思うのですが、全体的にパーティクル1つ1つの粒の大きさが結構小さいですね。
おそらく、スクリーンショットで見るとほとんど見えないというか、なにが描画されているのかちょっとわかりにくいかなと想像してしまいますが、実際に動いている様子を見てもシーン全体が若干暗く感じます。
これは単に、パーティクルがすごく小さいため画面全体の照度が低く感じてしまうと言いますか、黒い部分の面積が単純に広いから暗く感じるのだろうなと思います。

それとこれはけして今回の実装を貶めたりする意図ではないのですが、時折縦横比が崩れているように感じるようなシーンがあったりもします。
本来は真円や真球として描かれてほしかったのではないか? と思うような楕円状の形状とかが出てくるんですよね。これはいったいなんでなのか……
と、いろいろ気になる部分はあるのですがそういったことも含めてすごく味があるというか、個性的なビジュアルで攻めてるな~というふうに個人的には感じました。
いやけして悪く言いたいわけじゃないのですが、変わった質感・手触りのウェブサイトだと思います。

もしかしたら、わたしがウェブサイトを見ていた環境などの要因で描画が崩れている(縦横比がおかしくなっている)だけかもしれず、だとしたら申し訳ありません。
パーティクルを使っていろんな状況を描こうとしていて、さらにそれらがスクロール等の操作に応じてインタラクティブに変化する様子はなかなか見ていておもしろいのですが、いかんせん、なんか微妙に不思議な挙動をする場面があっていろいろ気になってしまいます。
たとえばトップページも、イルカのようなクジラのようなシルエットが悠然と泳いでいる様子はすごくかっこいいのですがスクロール等の操作が一切できないのはどうしてなんでしょうね…… なにか狙いがあるのかもしれませんが、ちょっと不思議に感じました。
とても個性的なウェブサイトという感じがします。
ぜひチェックしてみてください。