ITエンジニア/デザイナ向けにオープンソースを毎日紹介

Real Shadowはマウスを動かすとオブジェクトの影が動く、そんな目を引くアクションができるJavaScriptライブラリです。

マウスを追従する仕組みは目を引きやすいです。そんな仕組みの一つとしてReal Shadowを紹介します。マウスを動かすと影が動く仕組みです。


多数のオブジェクトが並び、その影が描かれています。ライトはマウスがある場所になります。


マウスを動かせば影もリアルタイムに動きます。

Real Shadowでは5つの形に対応しており、そのオブジェクトの影が描画されます。意味もなくマウスをぐりぐりと動かしてみたくなる、そんな面白さがあります。

Real ShadowはjQuery/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。


MOONGIFTはこう見る

GitHubの404ページやルパン三世の最新作「峰不二子という女」の公式サイトでもマウスによってオブジェクトを動かす処理が行われています。奥行きが感じられ、非常に面白い機能になっています。

Webページは一般的に一度描画された後は静的になってしまいます。ユーザがボタンを押したり入力をしなければずっとそのままというのはすぐに飽きてしまいます。かといってFlashで派手なアクションというのもまた面倒です。マウスを動かすと何かアクションが起きるというのは今後のトレンドになるかも知れません。

Real Shadow: jQuery Plugin that casts photorealistic shadows

Indamix/real-shadow

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2