若きデベロッパー作のサウンドビジュアライザはシンプルだからこそ良さが引き立つ一品

doxas : 2017-10-25 14:39:10

Gobelins が輩出した若いデベロッパー

今回ご紹介するのは、フランスでクリエイターをたくさん輩出していることで有名な Gobelins 出身のフロントエンドデベロッパー、Nikita Skargovskii さんの作品です。

彼のポートフォリオを見ると、この作品は特にリンクされたりしていないので、習作的な位置付けの作品なのかもしれないのですが……

非常にシンプルな造形と、センスを感じさせる配色がなんとも言えない良い雰囲気になっていて、個人的にはそのシンプルさが逆に作品全体の良さを引き出しているように感じました。

当サイトでは久しぶりのオーディオビジュアライズ系作品ですね。

こういう作品にこそセンスが現れる

今回の作品は、良くも悪くも、サウンドビジュアライザです。

要するに、再生されている音に反応してオブジェクトが動く、という可視化系の作品で、見た目はとてもシンプル。

ページがロードされた直後は、自動でサウンド再生が始まるわけではありませんので、画面の左側にある「Play」の文字をクリックしましょう。

画面の下のほうにちょっと小さめの文字でスペースキーを押すと作品に変化が起こるということが示されています。

実際にそのような操作を行ってやると、シーンに浮かんでいるパーティクルたちの構造が変化して、球体状に配置されていた点たちが、渦を巻くように配置されたり、雫の形になったりします。

また、同時にカラーリングが変化する場合もあって、形と色の組み合わせによって様々な印象を見せてくれます。

こういう言い方をするとちょっと誤解を招くかもしれませんが、サウンドビジュアライザはそれほど実装が難しいわけではありません。

ちょっとだけ WebAudio を勉強して、再生されているオーディオデータからリアルタイムになにかしらの値さえ引っ張ってこれれば、それを WebGL のシーンにアタッチするだけなので結構簡単なんですよね。

つまりなにが言いたいのかというと、今回の作品のような比較的シンプルな WebGL 作品は、3D 表現や WebGL を利用した実装の初心者向けの課題としてちょうどいいボリュームである場合が多いです。

世の中には、オーディオ周りをシンプルにサポートしてくれるライブラリもたくさんあるので、それらを利用しながら実装すれば、本当に簡単に、WebGL 初心者でもこういった作品を作ることができてしまうと思います。

しかし、サウンドビジュアライザが比較的簡単とは言っても、そこにどのような表現を持ち込むのかは、それぞれの実装者のセンスが問われる部分だと思います。

今回の作品では、いくつかの形状に変化しながらパーティクルが動くという動作になっていますが……

利用されている形状が、いずれもサウンドに応じたパーティクルの拡大縮小をダイレクトに表現してくれる形状になっていて、それがたぶん意図的なものなんじゃないかなと思いました。

実際にはたとえばキューブとか、あるいは正六面体とか、別にそういった形状でもサウンドビジュアライザに向いていないということではないのですが、今回のデモに使われている形状はいずれも曲線が非常に美しいフォルムになっているので、その分スケール感が強く演出できているのではないかな、と個人的に感じたのでした。

ここ数年、WebGL が徐々に一般化してくるにつれて、フランスでは Gobelins 出身の若いクリエイターが猛威を振るっているなあと感じることが個人的には結構あります。

なんというか、結構大胆な感じでどんどん作品を公開してくる人が多いので、そういうふうに Gobelins で指導したりしているんですかねえ。単に Gobelins の出身者が絶対数として多いから猛威を振るっているように見えるだけなのかもしれないですけど……

日本でも、一部の教育機関や民間のスクールなどで、もしかしたら WebGL とかを教えているところがあるのかもしれませんが、学生さんのアウトプットを見かけることは少ないような気もします。

個人的には若い人たちの表現したものを少しでも多く、このサイトで紹介できたらなと思っています。若い人たちはどんどんアピールしてほしいですね。

シンプルなサウンドビジュアライザ作品ですが、シンプルさが逆に良い意味で作品の味になっていると思います。ぜひチェックしてみてください。

リンク:

Shapeshifter

NikitaS-Portfolio

share

follow us in feedly

search

search

monthly

sponsor

social