物理的なレンズで起こる現象を再現しつつデフォルメも活かした Univerzita Tomáše Bati のウェブサイト

doxas : 2026-07-08 12:05:49

バランスが素晴らしいビジュアル

今回ご紹介するのは Univerzita Tomáše Bati というチェコにある大学のウェブサイトです。

どうやら、この大学の２５周年を記念するスペシャルサイトとして作られたもののようで、大学のさまざまな活動や歩みを２５個選出して 3D コンテンツにまとめたもの、ということのようです。

非常に美しいウェブサイトで、リアル志向の表現とデフォルメ表現が見事に融合しています。

今回のサイトでは、3D 表現はインタラクティブでリアルタイムな WebGL として描画されているのですが、フォトリアルな感じとも、デフォルメされたいかにも CG という感じとも、どちらとも言えないようなバランスの取れたビジュアルです。

もっと言えば、いいとこ取りをしている、と言ったほうが適切かもしれません。

ポリゴンの質感が残った 3DCG 的な質感に、レンズの効果のようなフォトリアルな演出が組み合わされています。

このスクリーンショットを見ても、なんかこう…… 眩しい光がフレアとしてシーン全体に掛かっているような、そういった質感があるのがわかると思います。

動いている様子をじっくり観察すると、レンズの収差っぽい色味が足されていたりして、けして物理的に正しい効果ということはないのですが、なんとなくそれっぽいと見ている人が感じるように演出されているんですよね。

3D シーンのなかには数字のラベルが浮かんでおり、そのラベルからまっすぐ下に伸びるラインが、なにかしらの施設や空間と連動しています。

クリックすることで、それぞれの施設などにフォーカスすることができます。

いずれかの番号や施設にフォーカスした状態になると、いわゆる下層ページ的な感じで場面が変化します。

ここではまず 3D シーンの視点が大きく変化し、ダイナミックなカメラワークのアニメーションを伴いつつ、各事例のタイトルと数字が表示されたビジュアルが現れます。更にスクロールすれば、より詳細なコンテンツがテキストと写真を使って構成されている場面へと移っていきます。

この場面では背景部分が微妙にボヤッとしたボケた状態で描かれ、まるでレンズで実際に起こる被写界深度エフェクトのような感じになるのですがこれがまたいい感じです。

サイト内に書かれていることを見ると、どうやらこのサイトの制作には同大学の卒業生なども関わっているらしく、そういった意味でも非常に素晴らしい取り組みだなと感じました。

ビジュアルがすごくいいのはもちろん、本当に細かく各種コンテンツが組み立てられており、3D シーンのレスポンスも適度なスピード感で心地よいです。

背景がボケるような演出があるおかげで、いまフォーカスしている施設が浮かび上がってくるように見えて、すごく印象的なビジュアルになっています。