ただ派手なだけではない独自性のある表現に思わず心奪われる Jorge Toloza さんのポートフォリオサイト

doxas : 2022-06-21 12:53:33

シンプルなのに印象は強い

今回ご紹介するのは Jorge Toloza さんのポートフォリオサイトです。

過去に、氏の実装された実験的なデモサイトを紹介したことがあったのですが、今回はご本人のポートフォリオになります。

文字を変形させることで立体的な構造を思わず脳内で補完してしまう絶妙な表現がなされており、シンプルですごくかっこいいウェブサイトとなっています。

今回のサイトは、最初に画面が表示されたときから思いっきり文字が歪んだ状態で描画されるので、ひと目でなにかこのサイトは違うぞという雰囲気が漂っていますよね。

さらに、そこからスクロール操作を行ってやると歪んだままの文字がスクロールし、得も言われぬ立体感が浮かび上がってきます。

このあたりは良い意味でサプライズ的というか、単純に見ていて楽しい演出ですよね。

さらに、表示されているタイトルの部分にマウスカーソルをホバーさせてやると、状況がまた一変します。

背景の色が変化するのと同時に、カード状のオブジェクトがスッとフェードするように現れます。

パッと見ただけではもしかしたら気が付かないかもしれないですが、このときカーソルが重なっているタイトル文字の部分は微妙に揺らぐように変形したりもしていて、１つの演出（エフェクト）に対しての小さなこだわりというか、作り込みがすごいですね……

画像と文字が重なった部分がネガティブ反転のように描画されるのも、すごくおもしろいですよね。

また、これもザッと全体を俯瞰して見ただけだともしかしたら気が付かないケースがあるかもしれませんが、このサイトのトップページ部分は、下にスクロールしているときと上にスクロールしているときで、変形のルールが逆転するように作られています。

要はバレルディストーションの向きが反転するようになってるのですよね。

このあたりもすごく工夫が凝らされていますし、他では見かけないような演出なのですごく見ていて楽しいです。

下層ページも凝ったデザインになっていて、とにかく端から端まで、抜かりなく実装されていると感じます。

技術的に面白い部分がいろいろあり、デザインやスタイリングだけでなく、技術面でも応用できそうな、参考になる部分がいろいろ見つかるサイトだと個人的には感じました。

なんというか、見る人によってはただ文字が立体的に歪んでるだけだな～みたいな感想で終わってしまう場合もありそうですが、今回のサイトの細部に宿っているこだわりみたいなものが見えてくると、本当に味わい深いサイトだと思いました。