
斬新すぎる立体表現がこれまでにない不思議な質感を醸し出す REALIZER のウェブサイト
まだまだ初めて見る表現はあるんだな
今回ご紹介するのは REALIZER という企業のウェブサイトです。
どうやらスイスの企業みたいなのですが、イベント設営やそれに関連するブランディングなども手掛けるチームのようです。
今回のサイトでは、わたしも初めて見る不思議な表現が使われていてすごく驚きました。
リンク:
空間よりも意匠を意識させる
今回のサイトでは WebGL 実装もかなり変わった表現となっていますが、トップページ部分もちょっと変わった構造になっています。
まずページが表示されると大きく文字が表示されるのですが、特にスクロールとかはできません。
余白部分でカーソルを動かしたりクリックしたりしても特に変化は起こりませんが、文字の部分をクリックするとガバッと(?)文字が動いて、下層ページへのリンクが現れる仕組みになっています。

REALIZE と書かれた項目から、彼らが手掛けている事業についての詳細を見ることができます。
この詳細ページの表現がすごくおもしろい WebGL 実装となっています。
言葉で説明するの非常に難しいのですが、画像の上にグリッド状の波紋が拡がるような不思議な演出になっています。
ページが表示された直後に自動的にアニメーションするので、実物を見てもらえればどういったことかはすぐにわかると思います。

この波紋が拡がるような演出、カーソルを動かすことでインタラクティブに発生させることもできます。
たぶんですが、モノクロっぽい風景の部分は画像なんですよね。
その画像の上に、立体的に見えるような別のレイヤーが被さっているかたちだと思うのですがすごく不思議なビジュアルです。
視差などを使ってカーソルに連動してカメラを動かし、それで立体感を演出することはよくあります。それとは全然違う感触の表現になっていて本当にすごいです。

これは完全に想像ですが、カーソルに連動して視差が生まれるような立体表現では、その立体的な構造そのものに意識が行ってしまいますよね。
それに対して今回のサイトのような演出方法であれば、立体的な構造よりも、その表面に施された装飾や、全体としての演出内容に意識が向かいます。
これは本当に…… すごくよく考えられた見せ方だなと感動しました。
ぜひチェックしてみてください。