さまざまなタイプのディストーションエフェクトで多彩な場面を演出! サンテFX with you. 特設サイトがすごい!
複数の映像が重なったような表現が面白い
今回ご紹介するのは、サンテFX のスペシャルサイトです。
今回のサイトでは歪み(ディストーション)を活用した多くのエフェクトが実装されており、インタラクティブ性のある表現として非常に個性的に仕上がっています。
単に全体を歪めるだけ、というのとは違う独特な味付けがなされており見ごたえがあります。
リンク:
「サンテFX with you.」特設サイト|見ようとする世界が、君が行ける明日だ。
スクロール操作やマウスカーソルの移動時に注目
今回のサイトでは、サイトの冒頭から最後まで、いくつかの場所でエフェクトが盛り込まれたビジュアルのインパクトが強いセクションが設けられています。
まず最初にユーザーが目にするイントロの演出では、残像が重なっていくようなエフェクトに加え、水面に落ちた水滴によって波紋が広がるかのような、滑らかなアニメーションを見ることができます。
残像が重なるような表現も、けして単調な歪みではなくてどこか有機的なものを感じさせる複雑な制御がされているように見えます。
使われている素材がモノクロなので、それがまたこれらのディストーション演出にマッチしているのかもしれません。
もしこれらの素材がカラフルでビビットな色合いだったとするとやや騒がしい感じになってしまっていたかもしれませんが、素材がもともとモノクロなので、大胆なディストーションによってまた違った印象に演出されているように感じます。
どこか不穏な感じの雰囲気もすごくかっこいいです。
よくよく観察してみるとわかるのですが、単一の動画や画像がディストーションするような感じではなく、複数のレイヤー構造があるような感じに見えるんですよね。
またスクロール操作を行った瞬間や、カーソルを動かした瞬間など、見えている映像に変化が起こるタイミングがわかりやすいものもあれば……
一方で、こちらが予測していないタイミングで大胆にシーンが転換するような部分もあり、予測できる(思ったとおりに反応してくれる)気持ちよさと、予測できない驚き・面白さみたいなものが絶妙に共存しているのは本当にすごいなと感じました。
このウェブサイト、実装としてのすごさはもちろんなのですが、いったいどんな思考回路があれば「そもそもこういう演出にしよう」というアイデアが出てくるんですかね……
こういうものを生み出せる感性と技術、月並みな言い方ですが、自分では逆立ちしても生み出せるような気がしませんし本当にすごいと思いました。
イージングの掛け方や、ディストーションの味付けなど、参考にできる技術が随所に見られる完成度の高い実装だと思います。
ぜひチェックしてみてください。