Adobe Max 2009 レポート part2

2009.02.16

max2.jpg
2009年1月29日、30日で開催されたAdobe主催のイベントAdobe Max 2009。Adobeの新製品、今後のビジョンのPRと、各種講演会で構成されるかなり大きなイベントです。
今回はAdobe Max 2009 レポート part1に続き、 Adobe Max 2009の2日目から下記のセッションの様子をお届け致します。

  • FLASH OOP Flashと外部機器をつかってアレを作ってみました。
  • スピーカー ロクナナ取締役 野中文雄氏
  • Flashタイムラインで作る3D


FLASH OOP Flashと外部機器をつかってアレを作ってみました。
スピーカー Flash OOP

FlashにおけるOOP(オブジェクト指向プログラミング)の普及を目指す団体Flash OOPさんによる講演です。Flash OOPさんは本の出版、勉強会の開催等勢力的に活動されています。今回の講演では、外部デバイスとFlashを使って色々な物を作成されていました。

Flash+Wii 姿勢が悪い人を救う座布団

長時間勤務により姿勢の悪い人が多いFlash開発者に向けて作ったデバイスだそうです。姿勢の悪い人を直すにはと考えたとき、「姿勢が悪い」=「かっこが悪い」とすればいいのではと、発想されたそうです。一見なんの変哲もない座布団なんですが、それに座った人が一度姿勢を悪くすると聞いた事のある「ぷぅ〜」という音が流れます。つまり姿勢がわるいとおならが出るという。発想もおもしろいですが、技術的にも興味深いものでした。WiiのバランスボードとFlashのアプリケーションの組み合わせでできてて、Wiiのバランスボードは、重心や加重の情報を簡単に取る事ができるので、その情報をFlash側で解析しているそうです。PCとの接続はBlootoothで行われていて、PCに"Wii Flash"というフリーのアプリケーションをインストールすることで、バランスボードからの信号をFlashで受けとれるそうです。

フラモデル 子供の頭の中で起きている事をFlashで具現化

子供がプラモデルの車で遊んでる様子をみて、「彼の中では何が起きてるか再現してみよう」ということから発想した、プラモデルとFlashの連携です。プラモデル(モータで駆動するキャタピラ車)が段差を乗り越えたりして振動すると、Flash上に描かれたコックピットのキャラクターに「大変だ!」「ちきしょう」などの吹き出しが表示されます。加速度センサーの情報をFlashに送り実現していて、加速度センサーの情報をPCに送信する仕組みはFunnel I/Oという無線送受信が可能なデバイスを使っているそうです。具体的には加速度センサー→Funnel I/O→Xbee(無線受信機)→Funnelサーバー(アプリケーション)→Flashという仕組みで、全部で1万円ぐらいでそろえる事が可能ということです。Flashから情報を送信する事もできるので、発想によってはいろいろな面白いデバイスがつくれそうです。

マルチタッチディスプレイ自作

最後に紹介されたのはマルチタッチディスプレイ自作というものでした。私にはどう考えたらあれほど複雑そうなものを自作できるのか検討もつかないです。FT-IRという技術(Wikipediaによると「測定対象の物質に赤外線を照射し、透過(あるいは反射)光を分光することでスペクトルを得て、対象物の特性を知る方法のことをいう。対象物の分子構造や状態を知るために使用される。」。。。難しいです。)を使って作ったもので、具体的には、厚さ1cmのアクリル板に赤外線を照射して、アクリル板に触れた時に変化する赤外線の状態を分析しているとのことです。

必要な部品は
・アクリル板
・赤外線LED×100個ほど
・各種電子部品
・Webカメラ
・赤外線フィルタ
・プロジェクタ ・土台 プロジェクタと土台を抜かして総計4万円ほどで制作できたとおっしゃってました。

自作することに意味があるかは別として、あんな複雑なデバイスを自作してしまおうという心意気に感激しました。



AS3.0におけるパフォーマンス向上のヒント
スピーカー ロクナナ取締役 野中文雄氏

max4.jpg

AS3.0におけるパフォーマンス向上のヒント
弊社ともおつきあいのあるロクナナの取締役野中文雄氏の講演です。野中氏はFlash ActionScriptでは多くの実績を持つ方です。トレーニングにも力を入れていて、たくさんの講演を行い、著書もかなりの量になります。
野中氏は今回ActionScript3.0でプログラムの実行速度を早くするTipsを紹介されていました。少々マニアックな内容ですが、ActionScript使いの私としては大変参考になるお話でした。

1.型指定がAS3.0では重要である。
ActionScript2.0でも変数に型指定は出来たましたが、コンパイル時にはその型指定が破棄されていました。AS3.0では型指定をする事により強い参照が行われるので、実行速度がはやくなるそうです。

2. "."シンタクスを使う
ActionScriptではオブジェクトのプロパティをmyObject.property1もしくはmyObject["property1"]と指定できますが、前者のシンタクスの方が強い参照が使われるので、実行速度が早くなるそうです。

3 型指定した変数を活用する
配列の数値の数だけ処理を行うようなスクリプトはよく使われます。前者の場合は繰り返しの度に配列の個数というプロパティにアクセスする。後者の場合は型指定した変数に予め代入されているので、後者の方が実行速度は速くなります。


--------------

for(var i:int=0;i<myarray.length;i++) {
myfunction(myarray[i])
}

--------------

var limit:Number = myArray.length;
for(var i:int=0;i<limit;i++)
{
myFunction(myArray[i])
}
--------------

またTextFieldに文字列を繰り返しで足す様な処理を考えたとき、前者の場合TextFieldに文字列を設定するというそもそも重い処理が繰り返されてしまいます。後者のように一度変数に設定する文字列を格納してから、TextFieldに設定した方が速いそうです。

--------------
for (var i:int = 0; i<10; i++) {
test_txt.appendText(String(i));
}
--------------

var myString:String;
for (var i:int = 0; i<10; i++) {
myString +=String(i);
}
test_txt.appendText(myString);


--------------


04 条件判定を考える

条件判定のような基本的なアルゴリズムを最適化することが一番確実であるとおっしゃってました。

閏年の判定を考えたとき判定条件は

1. 4で割り切れる年はうるう年。
2. ただし例外として、100で割り切れる年は普通の年。
3. さらに例外の例外として、400で割り切れる年はうるう年。

となります。これをスクリプトで記述すると

--------------
function isLeapYear(nYear:int):Boolean

{
if ((nYear%4 == 0 && nYear%100 != 0) || nYear%400 == 0) {
return true;
} else {
return false;
}
}

--------------

と書く事が出来ます。しかしこれは可読性に優れたスクリプトとはいえず、最適化の為の分析もしにくいスクリプトとです。これをいくつかの条件判定に分けることで可読性を確保します。基本は例外から処理する事でだ分かり易いスクリプトになるそうです。

--------------

function isLeapYear(nYear:int):Boolean
{
if(nYear%400 == 0) return true;
else if(nYear%100 == 0) return false;
else if(nYear%4 == 0) return true;
else return false;
}

--------------



条件判定は一つでも当てはまれば、後のスクリプトは処理されません。この事を利用して、なるべく多くのものが最初の条件で当てはまるようにすれば実行速度が速くなります。

--------------
function isLeapYear(nYear:int):Boolean
{
if(nYear%4 != 0) return false;
else if(nYear%100 != 0) return true;
else if(nYear%400 != 0) return false;
else return true;
}
--------------

細かいTipsは多くありますが、このようにアルゴリズムを最適化することが、最も確実な手段だそうです。



Flashタイムラインで作る3D 
スピーカー 森巧尚氏
FlashCS4では簡易的な3Dアニメーションが作成できる機能が追加されました。このセッションではその3D機能について解説されていました。

CS4では3D機能が新しく追加されました。今までの外部のASライブラリを使えば実現できた機能ですが、それがCS4からFlashのインターフェスの中に組み込まれ、タイムライン上でも3Dのアニメーションが作成する事ができます。

具体的にはステージ、ムービークリップに対して下記のプロパティを持ちます。

ステージに対して
・消失点
・画角

個別のムービークリップに対して
・x位置
・y位置
・z位置
・x軸を回転軸とした角度
・y軸を回転軸とした角度
・z軸を回転軸とした角度

"z位置"、"x軸を回転軸とした角度"、"y軸を回転軸とした角度"が追加されたことにより、例えば"回転しながら、近づいてくる看板"のようなアニメーションが作成できるようになりました。
しかし、CS4で追加された3D機能は専用の3Dソフトで作るような複雑なアニメーションではありません。立体をFlashの中で作成できるわけではないですし、ライティングやシャドウのような機能もありません。

さらにはFlash特有の問題として、表示順序の問題があります。例えば図の様にクリップが並んでいる場合ClipAがClipBの前にあるので、ClipAの後ろのClipBは一部ClipAに隠れています。この状況でClipAが後ろに、ClipBが前に移動して来た場合、ClipAの一部はClipBの後ろに隠れるはずです。しかし、Flashではそうはなりません。ClipBの一部はClipAの後ろに隠れています。
これはFlashの表示順序が、リストの順番通り(リストの一番最後のムービークリップが一番前に表示される)という仕様によるものです。

adobe1.png
adobe2.png


これを解決するにはActionScriptでzの位置を監視し、zが大きいもの(前方にあるもの)を常にリストの最後に移動してあげなければならないそうです。逆にいえば、そうすれば矛盾のない3Dアニメーションが作成できるということです。

さらに、オブジェクト自体はムービークリップなのでドロップシャドウ、ブラーなどのエフェクトが簡単にかけられます。

旨くやれば非常におもしろいアニメーションが作成できる新機能だとおもいます。

この記事をシェアする