今回は、jQuery spritely の紹介。
当サイトでは、フッターの紙飛行機がグルグル廻っている部分に使用しています。
別にこのスクリプトじゃなくてもいいのですが、何となく…
フッターを見てもらうのが早いかも知れませんが、一応サンプルも…
仕方がないと思いますが、線の太さが Flash と比べると違いますね。
それと、フレームレートは同じ 15fps なのですが、徐々にズレていきます。
Spritely.net のドキュメントをご覧いただくとわかると思いますが、当サイトの使用例は本来の使い方とはちょっと違うかも知れません。
背景をいくつかのレイヤーに分けて、近景、中景、遠景なとでスクロールする速度を変えるという、アニメーションの基本手法の jQuery プラグインというとわかりやすいかも。
各レイヤーのスクロール速度や方向、深度などがコントロールできます。
これに遠景がボケてくれるような設定があると面白いかも知れませんね。
でも、ボカした画像を用意すればいいだけか…
そういえば、『ボケ』って英語でも『Bokeh』というようになってきたようですね。
上記の様に、遠近感のある背景をスクロールするアニメーションを表現したい場合には最適なスクリプトだと思います。
当サイトでは、あまり効果的な使い方をしておりませんが、最近の案件にこのスクリプトを使用したサイトがありますので、興味のある方はご覧ください。
私が担当したのは、コーディングや WordPress のテンプレート作成、およびスクリプトです。
デザインやイラスト、レイアウトなどは他のデザイナーが担当しております。
アニメーションのイラストも味があっていい感じに仕上がっていると思います。
これくらいのアニメーションが、iPad でも見られるとちょっとインパクトがあるかも知れませんね。
他にも jQuery を使ったアニメーションが色々とありますので、機会があればまた紹介したいと思います。
