個性的でちょっとおかしな様々なインタラクティブ表現がふんだんに盛り込まれた Bornfight Studio のウェブサイト
どれも一風変わった演出ばかり
今回ご紹介するのは、Bornfight Studio というウェブ制作などを行うスタジオのウェブサイトです。
WebGL を使った表現を含め、様々なインタラクティブな表現が用いられていて、そのいずれもがちょっと変わった演出になっておりすごく面白いですね。
普通のプロモーション系のウェブサイトではあまり用いないような表現が多いので、いろんな意味で刺激をもらえるウェブサイトとなっています。
リンク:
カーソルの動きに対して様々な反応がある
今回のサイトでは、立体的な動きをするオブジェクトがいろいろ用意されている他、平面的な表現でもかなりオブジェクトが大きく動いたり変化したりするものが多いです。
それら全体を俯瞰して見てみるとインタラクティブな要素がすごく多い、みたいな雑な表現になってしまうのですが、細かく1つ1つを観察してみると、すごく丁寧に作り込まれているのがわかります。
ちょっとしたディレイ、なめらかで心地よいイージングなど、手触りにはかなりこだわりが感じられます。
トップページを含む多くのページで、カーソルの軌跡を赤いラインで描画するという演出がなされています。
この演出がいったい何を意図して実装されているのかは想像するしかありませんが、思わずカーソルをブンブンと大きく動かしてみたくなることは間違いないですね……
カーソルを大きくぶん回していると、あっちもこっちもいろんなところでカーソルの動きに対するインタラクションが発生するので、視覚的な情報量がとても多いです。
なかには、この上の2枚の画像にあるように立体的なオブジェクトを WebGL で描画している場面もあります。
こういった 3D 表現と平面的な表現とが絶妙に混在しながらコンテンツを形成しているのも、今回のサイトの大きな特徴と言えるかもしれません。
平面的なオブジェクトを立体的に配置することで迫力ある演出を行っているセクションもありますし、トップページから下層ページにいたるまで、あらゆる場面で思わずニヤリとしてしまうようなちょっと変わった演出が目白押しです。
バリバリの 3D 表現で技術力をアピールするのではなく、彼らの持つ感性や個性がちょっと変わったインタラクションによって色濃く表現されていて、コーポレートサイトとして非常に完成度が高いなと感じました。
カーソルの軌跡を赤いラインで表示されるだけで、なんとも言えない違和感と言いますか……
不思議な感慨が心のうちに湧き上がってくるから不思議です。
いろいろなアプローチで見る人の心をくすぐってくる、興味深い事例だと思います。
ぜひチェックしてみてください。