個性あふれるスタイル・テキスト・表現の数々にこちらの意識も揺さぶられる Studio Brot のウェブサイト
こいつは尖りまくってるＺＥ✨
今回ご紹介するのは、フランス・パリで事業を展開している Studio Brot のウェブサイトです。
個性が溢れて流れ出してしまっており、とにかく一見した印象はかなりぶっ飛んでいます。
大きめのフォントや大胆なレイアウト、個性的な画像・写真の数々に圧倒されそうになりますが、反面実装としては細かいところにまでしっかりと丁寧な仕込みがされており、見ていて非常に面白いサイトとなっています。
リンク：
個性を表現するための WebGL
今回のサイトでは、WebGL を使っている部分もそうでない部分も、かなり個性的な表現を行っている箇所がたくさんあります。
個性的な演出がたくさんあるなかで、その一部が WebGL で実装されている、という感じですね。
とにかく見た目のインパクトが強いウェブサイトですが、トップページの画面下あたり、白い水平線はカーソルを添わせると持ち上げることができるようになっていて、こういうちょっとクスッとなるような仕込みが随所に見られます。
スタジオの名称にある Brot というのはフランス語ではパンを意味する言葉のようで、パンをモチーフにした言い回し、演出、動画や画像などがたくさん登場します。
パン生地をこね、寝かして発酵させ、そしてふっくら焼き上げる。その一連の手順が彼らの手掛けるブランドデザインやプロモーション、制作などのワークフローと重なってくるイメージで、それらの演出が作られているように感じます。
WebGL を使った演出としては、たとえば事例を紹介するセクションで、黒い背景の一部がマスクで抜かれたような感じに見える場所などがありますね。
サイト内を徘徊してみるとわかるのですが、画面が切り替わる際のシーン遷移などもすごく凝っていて、とにかく彼らのイメージする世界観がそのまま直球でウェブ上に再現されているように感じられると思います。
ただ単におもしろおかしく演出するだけに留まらず、WebGL や物理現象っぽい手触りのインタラクティブな要素もふんだんに用いられており、技術的にもかなり挑戦的な内容になっていますね。
一見ふざけているようで、実際にはめちゃくちゃ計算されたうえで構築された完成度の高いウェブサイトだなと個人的には感じました。
こういうちょっと不思議な世界観を前面に押し出したようなウェブサイトって、反面、実は技術力・実装力がハンパないというケースが多い気がします。
なんというかある程度の高みに到達しているからこそ、こうやってちょっとふざけたような演出をしても嫌味がなく心地よく閲覧できるウェブサイトを作ることができるんでしょうね。
めちゃくちゃ尖ってて、すごく見ていて楽しいウェブサイトです。
ぜひチェックしてみてください。
