HTML5 Canvasを始めよう：EaselJSを使った流体パーティクル入門 | ClockMaker Blog
HTML5のCanvasをFlashライクに使えるようにするJavaScriptライブラリ「EaselJS」で流体パーティクルのデモを作ってみました。 demo source EaselJSを使えばFlashのようにHTML5 Canvasを使うことができるので、ActionScriptから概念だけではなくコードの再利用性が高まります。今回は流体パーティクルの表現を通して、EaselJSとCanvasのテクニックを紹介していきます。 デモの作り方 冒頭のデモですが、私が以前作成したFlashの作品「Flashの高速化を試す、BitmapDataを配列に格納することで2〜3倍の高速化」から移植したものです。 さて、このデモをHTML5 Canvasに展開するにあたり、特に抑えておきたいのは次の点だと思いました。 フォースマップの作成 パーティクル情報を付与した表示クラスの作成 フォースマップ
Stage3D対応のAway3D 4.0 – 3次元空間におけるパーティクル表現 | ClockMaker Blog
Flash Player 11の新機能Stage3Dに対応した3Dライブラリ「Away3D ver 4.0」の作例紹介。前回紹介したパーティクル表現とフィルター表現を組み合わせて作ってみました。 demo (Require Flash Player 11.1) source (FlashDevelop用ファイル一式) 旧来のFlash Playerとのパフォーマンスの違い こちらの作例、どこかで見たことがあるかもしれませんが、これは1年前にFlash Player 10で実装したPV3D演出サンプルNo.09:Spiral Particlesのデモ(記事の後半のデモ)を移植したものです。前回のFlash Player 10のものと今回のFlash Player 11で作った両者のデモを比較してみると、フレームワークの機能の充実度もありますが、Flash PlayerがGPUに対応したことで
Starling Framework 演出サンプル No.01: パーティクル | ClockMaker Blog
前回に引き続きGPUを活用したFlash 2Dフレームワーク「Starling (スターリン)」を使って、サンプルを作成しました。某ゲーム機のホーム画面っぽい感じと言われそう!? demo (Require Flash Player 11) source (zip) 波のグラフィックはFrocessingのサンプルを使って、パーティクル部分にStarlingを使いました。こういうものをAndroidのライブ壁紙にしたいなぁと思いつつ、Adobe AIRではライブ壁紙が作れないので、せめてAIRアプリにしてAndroidやiPhoneに載せて自己満足でもしようと考え中。Stage3Dに対応したAIR 3.xの登場が待ち遠しいです。 なお、サンプルを試す場合はADC (Adobe Developer Connection)のStage3Dコンテンツ制作入門を参考くださいませ。 使用したライブラ
たった数行のコードでクールなパーティクル表現を実現！ Flash Player 11対応の2Dフレームワーク「Starling Framework」 | ClockMaker Blog
たった数行のコードでクールなパーティクル表現を実現！ Flash Player 11対応の2Dフレームワーク「Starling Framework」 Flash Player 11の新機能Stage3Dですが、上条さんのブログでも紹介されているとおりStage3Dは3Dだけでなく2DでもGPUを使って描画できます。2DにおいてはStarling(スターリン)というフレームワークが存在し、これを使うことで2次元表現でもGPUの圧倒的なパフォーマンスを得ることができます。Adobe MAX 2011で受講したセッションのまとめでも紹介しましたが、Starling FrameworkはAdobe側もフィーチャーしており、今後が期待できるフレームワークの一つと考えて間違いなさそうです。ちなみStarlingについては次の記事が参考になります。 Starling （新しい ActionScript
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
