
ルネサンス風の世界観を自身のウェブサイトに落とし込んだ Yogi Suria さんのポートフォリオ
すごく個性的です
今回ご紹介するのは Yogi Suria さんという方のポートフォリオサイトです。
WebGL などを駆使したウェブ制作にも携わっているようで、今回のサイトも立体的なエフェクトを用いた演出がキービジュアルとして配置されています。
なんというかちょっと不思議な世界観のウェブサイトになっていて、個性が強いというか、こういう変わったスタイルが好きな方なんでしょうね。
リンク:
Shopify のあのサイトを参考に
今回のサイト、まず最初に見たときに感じたのは「去年見たあのサイトと似てるな~」でした。
実際、Shopify が公開したウェブサイトですごく話題になったものが去年の年末にありましたが、あれにインスピレーションを得たとご本人が X 上で書いてらっしゃいました。
本人がインスピレーションを得たと書いてらっしゃるので忖度しないでここでも書いてしまいますが、昨年の Shopify のあの事例を基準に考えてしまうと、そこまでの完成度に達しているわけではありません。
あの Shopify のやつは完全にやりすぎ案件でしたからね……

見た目の雰囲気、すごく似ていますよね。
上の画像はキービジュアルというかサイトの冒頭部分のスクリーンショットですが、おそらくご本人を模していると思われる人物の部分は 3D です。
単なる平面的な画像ではなく立体的な構造のあるメッシュになっていて、それによりいい意味で人物の部分がより際立って見えますね。
手前にあらかじめボカしておいた柱のようなイメージを配置することで、より立体感を強調したような見た目になっています。

カーソルを動かすと、その動いた軌跡にたくさんのスプライトがパラパラと現れるようになっていて、ルネサンスの時代を彷彿とさせるような仕込みがいくつかされています。
スクロールしてサイトを読み進めていくと WebGL 実装になっているのは冒頭だけになっていて、オリジナルの Shopify のサイトとは全然違う構造で作られている感じですね。
サイト内には有名な絵画とその作者を紐づけるミニゲームみたいなものもあって、いろんな意味で個性的なウェブサイトだなと感じました。

今回のこの記事内で、ご本人がインスピレーションを得たとおっしゃっている Shopify の事例の話を何度もしてしまいましたが、正直あれと同じものを実装できるのは相当な技術と時間と予算を持つひとたちだけだと思います。
今回のサイトを紹介する上では、けしてそれと比較して劣っているということが言いたいのではなくて、あれを見てインスピレーションを得て、それを短期間でこうやって自分なりの形で表出できることのすごさです。
わたし個人の感覚からすると、あの Shopify のサイトはすごいなと思いましたが真似してみようとかって発想は一切出てきませんでした。そういう意味でも、そのフットワークの軽さとアグレッシブさにすごく驚きました。
ぜひチェックしてみてください。