アブストラクトな世界観にリアルな質感を見事に組み合わせた Thibaut Foussard さんのポートフォリオサイト
明暗や彩度の変化などメリハリの効いたビジュアル
今回ご紹介するのは、フランスのクリエイティブ・デベロッパー Thibaut Foussard さんのポートフォリオサイトです。
About を見ると、光、色、数学などに興味が強いとのことですが、まさにその言葉のとおりの独特な世界観が今回のサイトでも表現されています。
美しい光沢を持つメタボール風の表現や、3D 空間の背後の様子など、注目しながら見てみると面白いかなと思います。
リンク：
Thibaut Foussard - Creative Developer
スクロールやマウスボタンのホールドでシーンが変化
今回のサイトではメタボール風のオブジェクトが表現の中心的役割を務めています。
シーンの中央にやや大きめのサイズのものが置かれている他、その周辺には上の方向に絶えず移動し続ける小さなメタボールも登場します。
水中で気泡が水面に向かって進んでいく…… というのともちょっと違って、どちらかというと粘性の強いオイルやタールのような物体をイメージさせる動きになっています。
なお、このトップページ部分で中心に浮かんでいるメタボール上でマウスボタンをホールドすると、ちょっと質感が変化します。
まるでシャボン玉の表面の模様、あるいはオイルの表面の模様ような、独特な虹色が表れているのがわかるでしょうか。
マウスボタンをホールドしている間は、メタボールがうごめくスピードなども変化しますし、一気に様子が変わるので見ていて面白いんじゃないかなと思います。
なんとなくの見た印象に過ぎないのでもしかしたら間違っているかもしれませんが、なんか UV も動いている感じもしますね……
なんか不思議な質感ですよね。
ちなみに、スクロールしていくと事例のタイトルが一覧で出てくるのですが、それに伴って背景の様子が変化します。
うっすらとフォグの掛かった背景部分には、ワイヤーフレーム状のライン描画もいくつかされており、全体として不思議で幻想的な空気感を演出しています。
各事例を選択した際はメタボールが大きくクローズアップされますが、このときはメタボールに色が塗られ、また違ったテイストになりますね。
静と動、白と黒、あるいはモノクロとカラーといったように、シーンの雰囲気が一気に変化する演出が多く、メリハリのある上手な見せ方が多いなと個人的には感じました。
今回のサイトのように、3D シーンに登場するオブジェクトの種別が少ない場合、下手をするとシンプルになりすぎて味気なくなってしまったりもしますよね。
その点、今回のサイトはウェブサイトとしてのデザインも、3D シーンとしてのデザインも、いずれも極めてシンプルなのですが外見的な変化が随所に盛り込まれているためか、寂しい感じはありません。
3D シーンに限っていうと、基本的なことではあるのですがフォグを使って奥行きのある空間を表現していたり、微妙にズームイン・アウトするようにトランジションが組み込まれていたり、あらゆる場面で丁寧に実装してあるなと感じました。
ぜひチェックしてみてください。
