2万パーティクルが飛び交う背景が見事! 東大などが主導するとあるプロジェクトのサイトがすごい!
変形するパーティクルに要注目!
今回ご紹介するのは、なんと日本のサイトです。しかも、東大などが主導するかなり真面目なプロジェクトの公式サイトで、そのページの背景には実に 2 万個ものパーティクルが飛び交うという面白いものになっています。
動的にパーティクルが動く様子や、パーティクルが集合し、変形し、様々な形状を作り出す様子は見ていてとても気持ちがよいですね。
スクロールやマウスカーソルの動きに連動して生き生きと動くパーティクルをぜひご覧になってみてください。
モバイルにも対応した力作
今回のサイトは、結構縦に長いサイトです。しかし、背景に見えている WebGL で描かれるシーンは常に画面いっぱいに広がった状態で固定されており、ページをスクロールするとコンテンツの内容に合わせて背景も変化するという仕組みになっています。
実際のページに掲載されているコンテンツの内容だけを見れば、とても真面目な 3D プリンターを利用したスポーツ用の義足に関連したプロジェクトのサイトなんですが、背景が目まぐるしく変化するので、思わずそちらに目が行ってしまいますね(笑)
画面をスクロールしたり、あるいはマウスカーソルを上下左右に動かしたりすることで、背景のパーティクルの集合が影響を受けます。
スクロールすると高速でパーティクルの集合体が回転するので、思わずホイールをぐるぐる動かしたくなります。いや、人によると思いますけどw
また、パーティクルは常に鼓動のようなリズムで収縮を繰り返すような動きをしていますが、コンテンツをスクロールしていくと次々とその姿を変えるのが、とても興味深いですね。
アルファベットの形になったりするのは、とても面白いなあと思いました。
また、こちらのサイトはモバイル端末でも動作することを念頭に置いて作られているとのことらしく、パーティクルの数は少々多めですがユーザー体験を損なわないようにかなりしっかり手が入れられているようです。
モバイル端末で見る場合には、ジャイロセンサーにより背景が動く様子がとても臨場感があり、いい感じです。
ウェブサイトのコンテンツとしては、上の画像でパーティクルが形作っているスポーツ用の義足の開発と研究がメインテーマです。
私のような WebGL マニアからするとどうしても背景の実装が気になってしまいますが、3D プリンターを活用することでよりよい製品を生み出そうとする研究として、サイトに掲載されているコンテンツのほうも非常に見応えのあるものになっています。
東大や多数の企業、団体などが協力して行う大きなプロジェクトのようですし、気になる方はぜひチェックしてみてください。