高機能なモーション制作用JSライブラリGSAP/TweenMaxを使ったタイムリマップ表現 | ICS MEDIA
皆さんはHTMLでモーションを作るときにどのトゥイーンライブラリを使用していますか？ GSAP（グリーン・ソック・アニメーション・プラットフォーム）は、Flash全盛時代から存在する歴史あるトゥイーンライブラリです。 GSAPはCSS/HTML Canvas/WebGLなどさまざまなアニメーション作成に利用できます。類似トゥイーンライブラリよりも高機能であり、かつ実行パフォーマンスも優れているのが魅力的です。GSAPの詳しい使い方は次の記事で解説しているので、使い方を知りたい方は以下の記事から参照ください。 GSAP入門（前編） - 基本的な使い方 GSAP入門（後編） - タイムライン機能など この記事では、GSAPのタイムスケールという機能を中心に解説します。 作成したモーションデモを紹介 今回はGSAPの機能の1つ「タイムスケール」を使って、3Dの表現を試してみました。まずは次の2つ
HTML5で複雑なアニメーションを実現する最適な方法とは？ CreateJSを使って容量もパフォーマンスも最適化しよう - ICS MEDIA
HTML5で複雑なアニメーションを実現する最適な方法とは？ CreateJSを使って容量もパフォーマンスも最適化しよう HTML5で複雑なアニメーションを実現する方法にはいつか方法がありますが、それぞれの手法について容量とパフォーマンスのメリット・デメリットを検証してみたいと思います。 スプライトシートを使う方法 ベクターアニメーションを使う方法 スプライトシートビルダーを使う方法 おまけ：GIFアニメーションを使う方法 おまけ：Flashアニメーションを使う方法 スプライトシートを使う スプライトシートとは映画のコマのようにアニメーションの全コマを画像として用意しておいて、順番に高速に切り替えることでアニメーションを実現する方法です。enchant.jsやCreateJSなど多くのJavaScriptのフレームワークで採用されており、もっともスタンダードな方法です。 表現の再現性が高いう
HTML5 Canvasでパーティクル表現！パーティクルエンジンParticleEmitterJS | ClockMaker Blog
にゃあプロジェクトさんに教えてもらったのですが、HTML5用のパーティクルエンジン「ParticleEmitterJS」が面白そうだったので試してみました。次のような表現がビジュアルエディターを使ってHTML5で簡単に作ることができます。 Demo (Require the browser supported HTML5 Canvas) Demo (Require the browser supported HTML5 Canvas) ParticleEmitterJS は CreateJS のフリーの拡張ライブラリで、簡単にパーティクルエフェクトを作ることができます。パーティクルエフェクトはゲームやコンテンツ表現の演出強化や、雲や炎などのシミュレーションにも利用できます。パーティクルは基本的に数値演算を利用するためプログラマの領分という印象が強いですが、ParticleEmitterJS
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
