
個性的なポストエフェクトとダイナミックなアニメーションがかっこいい Marius Remy さんのポートフォリオ
シンプルなのに滲み出してくるかっこよさ
今回ご紹介するのは Marius Remy さんのポートフォリオサイトです。
いわゆるウェブのフロントエンドの実装者さんなのかなと思いますが、シンプルにまとまったスマートなポートフォリオサイトでなんともかっこいいビジュアルをしています。
インタラクティブな要素も含め、多くのオブジェクトが動いたり変化したりする様子はなかなか見事です。
リンク:
若干負荷が高くなる瞬間も?
今回のサイトでは、手掛けた事例のイメージが立体的に動くことで迫力のある 3D 表現を行っています。
サイトのロードが終わった直後も、ただ単にパッとイメージが出てくるのではなく、アニメーションを伴って三次元的な演出としてシーンが構成されています。
スピード感や疾走感もあり、なんとも迫力のある演出が多いです。
そして、画面内に現れた画像の上にカーソルを持っていくと、不思議なエフェクトが発生することにも気がつくでしょう。
このエフェクトはなんと説明したらいいか難しいのですが、いわゆるディストーション系のエフェクトで、カーソルが動いた軌道上はまるで透明な氷の塊があるかのように歪んで描かれます。
スクロール操作を行うと、それに連動して事例が切り替わり、ローディング直後に起こったような高速アニメーションが発生します。
個人的に気になったのは、なんか妙に描画が重いというか、瞬間的に負荷が高くなる感じがあったことです。たまたま、わたしの環境が悪かっただけかもしれませんが……
カーソルが一切動いていない場合はすごくスルスル動いて気持ちがよいのですが、スペックが十分でないマシンの場合、カーソルを動かしている最中だけ若干カクつくようなケースがもしかしたらあるかもしれません。
とはいえ、全然問題のあるような負荷の感じではなくてたまたま環境の相性が悪いみたいなところもあるかもしれないので、実装が悪いとか不備があるとかそういうことではありませんので、あしからず。
いい意味で、すごくミニマルかつシンプルにまとまったかっこいいポートフォリオサイトです。
若干負荷が高い瞬間があると書きましたが、たぶん相当古いマシンとかでなければ、それほど気にならない場合が多いんじゃないかなという気はします。
最新の MacBook とか使っていると大抵のサイトは普通にスルスル動いちゃうので、こういうのって意外と気がつくの難しいですよね。そういう意味で、自戒も込めて。
なんかちょっとネガティブなことを書いてしまいましたが、こういう見せ方は個人のポートフォリオとしては真似しやすく多くの方にとって参考になりそうな事例のようにも感じます。
ぜひチェックしてみてください。