平行投影で描画される 3D 表現とエッジの美しいスタイルを組み合わせた Roman Salakhov さんのポートフォリオ
個性がしっかりと体現されている
今回ご紹介するのは Roman Salakhov さんのポートフォリオサイトです。
主にウェブを中心としたデザイナーや開発者としての活動をされている方なのかなと思うのですが、なかなか個性のあるスタイリングで独自の世界観を表現しているウェブサイトですね。
WebGL を利用した 3D 表現はいくつか見られますが、いずれも平行投影をうまく活用しています。
リンク:
Roman Salakhov - Creative designer and webflow developer
あえての平行投影
3D にあまり明るくない人には、平行投影という言葉はやや聞き慣れない言葉かもしれません。
3DCG を描画するうえで定義するカメラには、遠近感のあるパースの掛かるタイプと、逆にパースの掛からないタイプとがあります。平行投影は後者の、パースなしでの描画が行える投影方法ですね。
今回のサイトの WebGL 表現では、あえてその「パースの掛からない状態」をうまく取り入れている感じがします。
ページの冒頭部分では、おそらく彼の独自のロゴマークだと思うのですが、R の文字を連想させるロゴマークが 3D で描かれています。
この描画もよく観察してみるとわかるのですが、手前と奥とで、パースが変化しない平行投影によって描画されています。
おそらくですが、サイト全体のデザインとも照らし合わせてみると、直線的なシルエットや質感、あるいは独自のバランス感覚でもって、あえて平行投影を選択しているのだと思います。
サイト内には、ビジュアルとしてはパースのかかったような雰囲気になっている場面もありますし、サイト内のデザインにも曲線が登場しないわけではありません。
ただ全体を俯瞰してみてみると、やっぱりなにか、こうバランスを取ろうとする力が働いている感じがあって、そういう意味ではパースの掛かった(見方によっては歪んだ)CG シーンよりも、平行投影のまっすぐに歪みなく描かれる CG のほうがマッチしているということなのでしょうね。
黒と赤、そして白との間を行き来するようなカラーリングも相まって、独特な風合いを持っているなと感じました。
最近は WebGL をワンポイントというか、キービジュアルなどの目立つ部分にだけ配置するようなサイトが多いなと感じることがあります。
一方で、今回のサイトでは小さなインターフェースのなかに固有の小さな 3D シーンが用意されていたりして、結構凝った作りだなと個人的には感じました。
こういうの、見た目以上に実装するのは面倒ですからね……
丁寧に作られた、シンプルだけど味わい深いポートフォリオサイトだと思います。
ぜひチェックしてみてください。