実践
CreateJSでHTML5 Canvasを操る
9

TweenJSで使用頻度の高いメソッドの使い方を解説します。また、単純なトゥイーンを組み合わせて使うことで、より複雑なアニメーションが実現できることも紹介します。

小山田 晃浩
小山田 晃浩 | フロントエンド・エンジニア

今回はTweenJSに備わっている機能のひとつ、イージングの使い方を解説します。執筆現在(2013年7月)最新のTweenJS 0.4.1のイージング機能を網羅しています。

小山田 晃浩
小山田 晃浩 | フロントエンド・エンジニア

トゥイーンをコントロールするさまざまなプロパティを、デモを交えて解説します。今回はdisplayObjectを取得するget()に設定できるプロパティが中心です。

小山田 晃浩
小山田 晃浩 | フロントエンド・エンジニア

今回はEaselJSと組み合わせて使うTweenJSを紹介します。EaselJSで表示されたDisplayObjectを動かしてアニメーションを実現するライブラリです。

小山田 晃浩
小山田 晃浩 | フロントエンド・エンジニア

第5回目はEaselJSのフィルタ機能について解説しています。フィルタ効果を使えば、ひとつの静止画像に対して、JavaScriptでさまざまフィルタ効果を付与することができます。

小山田 晃浩
小山田 晃浩 | フロントエンド・エンジニア

第4回目はEaselJSのeventとそれに関連する機能を紹介します。一見、DOMのイベントと同じような仕組みですが、それとは異なる特長もあります。そのポイントをおさえましょう。

小山田 晃浩
小山田 晃浩 | フロントエンド・エンジニア

第3回目はEaselJSのスプライトシートとそのアニメーションの利用方法を解説します。EaselJSのスプライトシート機能を用いて静止画像から数種類のコマ送りアニメーションを再生します。

小山田 晃浩
小山田 晃浩 | フロントエンド・エンジニア

今回はCreateJSのcanvas要素の描画を担当するEaselJSの基礎をおさえます。

小山田 晃浩
小山田 晃浩 | フロントエンド・エンジニア

第1回目はCreateJSの概要と、おおまかな機能、またCreateJSの理解に必要な概念を解説します。簡単なデモを多く用意したので、まずはどんな表現ができるのかを実感してもらえるといいと思います。

小山田 晃浩
小山田 晃浩 | フロントエンド・エンジニア