レイヤー構造が繋がっては離れる不思議な表現！ Natureboy Flako - Theme For a Dream のサイトが面白い
音楽とグラフィックスの親和性がステキ
今回ご紹介するのは、Natureboy Flako というアーティストの新しいアルバムを紹介する特設サイトです。
ダンス、あるいはエレクトロなどのジャンルで楽曲を配信しているアーティストの方みたいなのですが、その音楽性と今回のサイトで見ることのできるグラフィックスがなんともいい感じに馴染んでいて、すごくよい雰囲気に仕上がっていますね。
どこかアブストラクトな感じもする、独特な表現となっています。
インタラクティブに変化するグラフィックスを楽しもう
今回のサイトは、WebGL を使った演出としては個人的にはあまり見たことのない独特な演出がとても特徴的です。
ポストエフェクトなどを使ったフラグメントシェーダでの演出というよりは、どちらかというとジオメトリを利用して演出が組まれていて、その点も非常に面白いですね。
最初にサイトに訪れると、この記事のトップ画像にあるような、ひとの頭部の彫像のようなシーンが出てくるのですが、この時点ではまだ CG で描かれたシーンというわけではありません。
しかし Explore と書かれたリンクをクリックすると、突然世界観が一変します。
この上の画像を見ると、それが人間の手をモチーフにしていることは一目瞭然だと思います。
今回のサイトではいくつかの楽曲のイントロが実際に聴けるようになっているのですが、それぞれの曲に対してテーマが用意されており、不思議な世界観を演出しています。
上の画像ではちょっとわかりにくいかもしれませんが、このぼやけたようなビジュアルは、複数のレイヤー上に重ねられたポリゴンによって作られており、マウスカーソルの位置を動かしてやるとインタラクティブに描かれるシーンが変化します。
そして、カーソルの位置だけでなくクリック＆ホールドの操作でも、シーンに干渉が可能です。
ホールド操作を行った際には、レイヤー上に複数の層が重なったような状態だったジオメトリが、今度は全部つながったような状態になります。
これは言葉でうまく伝えるのが難しいのですが、多層構造だったものが、大きな一枚の薄膜で作られたジオメトリになったような感じで、なんとも不思議です。
ねじれたような状態になると、まるで貝殻かなにかのような……
無機質と有機質の中間みたいな印象の見た目になります。
今回のサイトはアーティストさんのサイトということもあって、独特な表現が用いられており非常に面白いですね。
薄い膜のようなポリゴンが重なる状態と、それらがすべてつながってしまったかのような、異なる複数の状態を上手にミックスしているのもまた面白いです。
あまり見たことのない演出なのですが、不思議と、嫌味もなく単純に目に楽しいです。
ぜひチェックしてみてください。
