巨大な建造物の存在感とシェーダによるエフェクト表現が面白い！ 高松伸建築設計事務所のウェブサイト
静かで、しかしどこか荘厳な雰囲気
今回ご紹介するのは高松伸建築設計事務所のコーポレートサイトです。
事務所にも名前が含まれている高松伸さんは、本当に大量の建築物に携わっている著名な建築家で、国内だけでなく海外にも多くの実績がある方みたいです。
今回のサイトにはもちろんそういった数々の実績、執筆された大量の著書の情報などが網羅されておりかなり見ごたえがありますね。
さらには WebGL を利用してドラマチックな 3D シーンの演出がなされていたり、シェーダを利用した印象的なエフェクト表現があったりと、本当に素晴らしい出来栄えとなっています。
リンク：
細かいところにもこだわった作り
今回のサイトは、最初に表示された直後はイントロ演出が自動的に再生されます。
こちらは動画ではなく WebGL を使ったリアルタイムな CG で描かれ、巧みなカメラワークと文章でとてもメッセージ性の強い演出になっていますね。
メニューなどから Philosophy の項目を選択することでも再度閲覧することができるようになっており、独特な構造の建造物が様々な表情を見せてくれます。
これ、実際に実在する建物なのかな～ と思って事例のページをじっくり見ていくと、兵庫県にある能勢妙見山の星嶺という、実際に一般にも公開されている建物みたいです。
鋭いエッジが特徴的な建物で、こうやって CG で見ても迫力がありますよね。
もちろん、この私が感じている「迫力」は 3D シーンの作り方によって演出されているものでもあると思います。上に下にと目まぐるしく変化するカメラワークはとてもよく考えられており、建物の光沢や光の反射など、すごく印象的にシーンが演出されていると思います。
ガラスへの映り込みなども美しく表現される。
また、各事例を紹介する下層ページや、それぞれのセクションへ移動する際など、特定のタイミングでは画像に対して歪んだようなエフェクトを掛けるシェーダテクニックが使われています。
いわゆる UV と呼ばれるテクスチャ座標をずらすようなエフェクトで、ほんの一瞬の僅かなエフェクトなんですがメリハリの効いた表現に一役買っていると思います。
サイト全体の雰囲気はやや暗めの背景色で、どこか静謐な感じというか…… 静かな迫力みたいなものが感じられるのですが、各種事例のページでは明度や彩度の高い写真が使われているので、そのコントラストの美しさも際立って感じますね。
ほんの一瞬の歪むようなエフェクトが思わず視線を引きつける。
私は建築はもちろんド素人なので、その構造物自体を解説・言及したりすることはできないのですが……
とは言え素人目に見ても、本当に様々な建造物を手がけられているということはその事例の多さを見てもわかりますし、とにかくすごく説得力のあるコーポレートサイトになっているなと思いました。これもしかしたら CMS みたいなものも同時に実装されているのかなと想像しますが、本当に全体としての完成度が高いウェブサイトになっていますね。
WebGL の表現としては比較的シンプルな方向性かなとは思いますが、建築物という立体的な構造がとても重要な概念を、あえて直球勝負といいますか、3D でその美しい造形を表現しようと挑戦した軌跡がうかがえて個人的にはめちゃくちゃ痺れました。
建築のプロが目にするサイトに立体的な構造がモロに感じられる 3D 表現を盛り込むっていうのは、たぶん言うほど簡単なことではないというか、すごく勇気と度胸の必要な決断のような気がします。
2D から 3D まで、各種表現に工夫の感じられる完成度高い事例だと思います。
ぜひチェックしてみてください。
