gihyo.jp連載「HTML5のCanvasでつくるダイナミックな表現―CreateJSを使う」
gihyo.jpで始まったCreateJSの連載は、第4回までの記事が公開されています。
Canvasの機能をCreateJSで駆使して,「Flashみたいな」表現をつくっていきます。初めにお題となるコンテンツを挙げ,数回にわたってそのスクリプティングを解説していく形式で進めていきます。
- 第1回「読み込んだ画像をトゥイーンアニメーションさせる」
読込んだ画像を水平にトゥイーンアニメーションさせます。トゥイーンにかける時間と垂直位置は、ランダムに定めます。 - 第2回「トゥイーンをランダムに定める」
CreateJSのTweenJSライブラリでつくった座標のトゥイーンに、ランダムな繰返しの動きを加えます。また、新CreateJSにコードを対応させました。 - 第3回「Canvasの四辺をランダムなイージングで移動する」
前回つくったトゥイーンアニメーションに、さらにふたつの要素を加えます。ひとつは、イージングをランダムに選びます。もうひとつは、行き先をCanvasの四辺に拡げます。 - 第4回「時間差をつけたトゥイーン」
TweenJSのデモ「TWEEN CIRCLES」をお題にします。同心円のリングが、ステージ上のクリックした位置に、時間差でトゥイーンします。
毎回書いたコードは、jsdo.itにも公開しています。
当スクールではCreateJSのハンズオン講座を開講しています。