PV3D演出サンプルNo.07:クリスマスメッセージ

2009年10月21日 (水)
Tweet

PV3D演出サンプルNo.07:クリスマスメッセージ

ひさびさに Papervision3D のネタ。ActionScript 3.0の天下一武道会「checkmate (チェックメイト)」の今月分のお題に対して、クリスマスイルミネーションな作品を投稿してみました。ネットを介して投稿されたメッセージが、クリスマスの夜空に投影されるという作品です。

demo (改良版)
demo & src (wonderfl版)

作品について

夜空のキラキラが集まりだし、

それらは文字となり、

また夜空に戻っていきます。

前回、wonderflでtwitterと連携したデモを投稿しましたが、今回もTwitterと連動しており、wonderfl版では加えてはてなブックマークを通して、メッセージを投稿できるようにしています。

投稿方法

画面の下側に配置されているボタンをクリックします。

091021-xmas1

Twitterユーザーであれば、自分のつぶやきの入力欄に以下のように文字が入っています。括弧[]の中にメッセージをいれて投稿しましょう。

091021-xmas2

すると時間がしばらく経つと表示されます。

※はてなブックマークのコメントも対応してますので、wonderflのページをブックマークしてコメントを投稿することもできます。

参考にしたwonderflの様々な手法

今回はwonderflに投稿された様々な手法を組み込ませて頂きました。元のwonderflのコードは以下の通りです。

Ascii Art Hanabi (Twitter連動)
キラキラPixel3D！(3Dのキラキラ部分)
TextFieldから文字の輪郭を取得して3Dにして砂の落下アニ・・以下省略(文字のパーティクル化)
Random Green Tree (smaller flowers) (木を作る再帰関数)
１行でArrayをシャッフルする
BetweenAS3の時間調整

別の人が生み出した手法をフォークして新しい表現に開発し、それが別の人のフォークに繋がるというループ。wonderflならではの現象ですが、それによってFlashの様々な新しい表現手法が生まれるというのは素晴らしいことですね。

利用しているAS3ライブラリ

また、今回もAS3ライブラリの恩恵が大いにありました。3Dの表現はPapervision3Dですが、大量のパーティクルのトゥイーンにはBetweenAS3を、データの読み込みにはProgression4を利用しています。そもそもライブラリがなければ自分だと全く組めませんので、こういった表現に挑戦できるきっかけとなったライブラリの存在には感謝するばかりです。

追記：改良版ではライブラリのコア部分を弄り高速化

091022-kairyou

もう少し速度がでても良さそうだったので、ライブラリに手を入れたり、不要なロジックを整理したりして高速化してみました。すると改良前に比べて、1.5〜2倍ほどFPSが向上し、メモリも半分程度で動作するようになりました。

特に効果が大きかったのは、PV3DのRenderPixelsクラスの走査の改良。

PV3DのPixels3DはBitmapDataに直接ピクセルを描画する処理系統なので非常に高速ですが、BitmapData高速化の常套手段であるlock/unlockが適用されていなかったので、次のようにライブラリに手を入れています。

クラス org.papervision3d.core.render.command.RenderPixels

canvas.lock(); // 追加部分
for each(var p:Pixel3D in pixels.pixels){
	v3d = p.vertex3D.vertex3DInstance;
	if(v3d.visible){
		canvas.setPixel32(v3d.x+offsetX, v3d.y+offsetY, p.color);
		screenZ += v3d.z;
	}
}
canvas.unlock(); // 追加部分

またBetweenAS3は高速とはいえ大量のパーティクルを動かすため数千個のトゥイーンを作るとやや重たいため、nutsuさんの資料をもとに、専用のPixel3DUpdaterというものを作成し高速化しています。こちらは資料の通り、若干のFPS改善と結構なメモリ使用量の改善に効果がありました。