さまざまな質感を WebGL を用いてリッチに表現した Changer Capital ANRI のウェブサイトがすごい
スイスイ動く様子はお見事
今回ご紹介するのは、佐俣アンリ氏が率いるベンチャーキャピタル Changer Capital ANRI のウェブサイトです。
いきなりすごい個人的な話をしてしまうのですが、佐俣アンリ氏は最近ご自身で新しく写真賞を新設するなど、ビジネスだけではないさまざまな方面で活動されているのを個人的には拝見していました。
その活動の背景にある考えや思想みたいなものがサイト上にうまく取り込まれていて見応えのあるウェブサイトになっています。
リンク：
個性的なロゴと多彩な質感
これをロゴと呼んでいいのかわからないのですが、今回のサイトではトップページのファーストビューから、個性的なロゴが大きな存在感を放っています。
ロゴと言ってもどちらかというと立体的な構造物みたいなところがあって、それが回転することでさまざまな見え方、捉え方ができるような含みを感じます。
形という意味でも個性的ですが、さらに今回のサイトではその表面に付与される質感も多彩で本当に見ていて圧倒されます。
中央に配置された立体的な構造を持つロゴ部分が、時にはメタリックになったり、時には透明（のように見える状態）になったり、質感のバリエーションが豊かです。
スクロール操作を行うと質感が次々と変化するようになっていて、下層ページに移動するにはあらためてボタンを押したりメニューを経由したりする感じですね。
ロゴの形もそうですが、こういう多彩な質感を持つビジュアルで多様性やあるいは変化に柔軟に対応したりする姿勢、これからも変わり続けていくという思想なんかを表現しているのかもしれません。
下層ページ部分では、一時的に 3D シーンの手前にすりガラスのようなレイヤーが重なって表示される部分があったり、それが外れて再び 3D シーンが現れたりと見せ方も多種多様です。
文字を見せたい場面と、動画を見せたい場面と、ロゴを見せたい場面、それぞれに見せ方に工夫が凝らされておりデザインとしてもおもしろい部分がたくさんあるように感じます。
付与されているアニメーションやインタラクションもすごく丁寧で、スイスイと心地よく閲覧することができます。
今回のサイトを見ると、わたし自身もそうでしたけれどもまずは CG の質感にグッと心を掴まれます。
思わずそのビジュアルに、リアルな質感に、視線を奪われてしまうわけですね。
でも実際にサイトをじっくりと見ていくと、そのウェブサイトとしての操作性や場面転換の違和感の無さ、あるいは通底するモーションに対する考え方や味付けなど、実装のレベルの高さに気が付きます。
デザインから実装まで、プロジェクト全体としての完成度の高さが光る、そんな事例だと思いました。
ぜひチェックしてみてください。
