MouseEvent.MOUSE_DOWNの発生後にマウスを押したまま対象インスタンスの親インスタンスを変更した場合、つまり別のDisplayObjectContainerにaddChildし直した場合の挙動。

予想では、マウスダウン中に別の親にaddChildしてしまうとマウスを離してもMouseEvent.MOUSE_UPは発生しないと思っていたのだけど、普通にイベントが発生した。これを利用すると、たくさんのアイテムの中からドラッグ中のものを一時的に最前面に表示するなどの処理が実装しやすくなる。

//親コンテナ parentA, parentB を作る
var parentA:Sprite = addChild( new Sprite() ) as Sprite;
var parentB:Sprite = addChild( new Sprite() ) as Sprite;

//子オブジェクト child を作り、parentA に配置しておく
var child:Sprite = parentA.addChild( new Sprite() );
child.graphics.beginFill(0x0);
child.graphics.drawCircle(0, 0, 50);
child.graphics.endFill();
child.x = 100;
child.y = 100;

//子オブジェクトに対してイベントを登録する
child.addEventListener(MouseEvent.MOUSE_DOWN, function(e:MouseEvent):void {
  trace("down");
  //マウスダウンで parentB の子として addChild し直す
  parentB.addChild(child);
});

child.addEventListener(MouseEvent.MOUSE_UP, function(e:MouseEvent):void {
  //マウスを離すと、マウスダウン時と親が違っていてもちゃんと実行される
  trace("up");
});

トップページにコンテンツを追加しました。
» Cells

今回はボロノイ図とパーティクル操作を組み合わせたものとなっています。ボロノイ図のアルゴリズムには高速なFortuneのアルゴリズムを用いています。Fortuneのアルゴリズムは空間を上から下に走査していきながら、各々のボロノイ母点が作り出す放物線（beach line）同士が交わる点列をボロノイ境界とみなします。

» アルゴリズム解説
» C++版 by Matt Brubeck
» AS3版 by Controul

wonderflに投稿されているkndさんの『Fortuneのアルゴリズムの可視化』が直感的で分かりやすいです。

pbjファイルをローカルからアップロードすると、PixelBenderのコードを内部に埋め込んだActionScriptのクラスを生成します。pbjファイルがパラメータを含む場合は、各パラメータに対して自動的にgetter/setterも用意します。インプットに対しても自動でgetter/setterを生成します。

このツールの利点としては

• コンパイル時にPixelBenderのコードを含めることができるので、pbjファイルを外部読み込みする必要が無くなる
• pbjファイルにどのようなパラメータやインプットを設定すればいいのか分かる

といったことがあります。wonderflに投稿する際にメインのコードとPixelBenderをひとつのファイルにまとめたり、パラメータやインプットの指定ミスを減らせることができるかと思います。

エンコード/デコード処理はこのようになっています。

//pbjファイル → 埋め込みコード
function encode(bytes:ByteArray):Array {
    var code:Array = new Array();
    bytes.position = 0;
    while (bytes.bytesAvailable) {
        code.push(bytes.readByte());
    }
    return code;
}

encode(loader.data);

//埋め込みコード → Shaderインスタンス
function decode(code:Array):ByteArray {
    var bytes:ByteArray = new ByteArray();
    for (var i:uint = 0, l:uint = code.length; i < l; ++i) {
        bytes.writeByte(code[i]);
    }
    return bytes;
}

var shader:Shader = new Shader( decode(code) );

おまけ
結局使わなかったのですが、このツールを作るにあたりpbjファイルをディスアセンブルするクラスをC++からASに移植しました。
» Pixel Bender .pbj files （C++版のディスアセンブラ）

当初はpbjファイルをディスアセンブルしてパラメータのgetter/setterを自動生成ｓていたのですが、Shaderインスタンスのdataプロパティを列挙すれば必要な情報を取得できることに、移植完了後に気づきました。なのでディスアセンブラはお蔵入りとなってしまったのですが、せっかくなので置いておきます。使い方はクラスファイルの最初のほうを見てください。
» PBJDecoder.as

RunをクリックするとSource Codeに記述したコードが実行され、実行結果がOutputへ出力されます。場合によっては（というかPreset Codeでは Hello, World! 以外全て）入力待ち状態になるのでその際はInputに要求された文字列もしくは数値を入力してSendをクリックします。

Whitespace？なにそれおいしいの？
Whitespaceは簡単なプログラミング言語です。ただし見えないことを除いては。なぜならばWhitespaceのソースコードは半角スペース、タブ、改行のみで構成されているからです。それ以外の文字は全てコメントとして扱われます。

ちなみに、公式サイトに掲載されているHello Worldのソースです。なんだろうこのドヤ感。
» Hello World

スタックマシンとしての動作と文法
Whitespaceは記憶領域としてスタック、ヒープというものを使います。ASで言うならばスタックはArray、ヒープはObjectと言ったところでしょうか。スタックは値を一番上に積み上げるか、一番上から取り出すことしかできませんし、値を見るだけでもいちいち取り出さなければいけません。ヒープは任意のラベル（アドレス）に値を保存したり、保存しておいた値を取り出しすことができます。

//スタックのイメージ
stack.push(value);           //値の積み上げ
var value:int = stack.pop(); //値の取り出し

//ヒープのイメージ
heap[address] = value;         //値の保存
var value:int = heap[address]; //値の取り出し

ソースコードは処理命令の羅列となっているので、Whitespaceはソースコードの最初から順番に処理命令を読み取りながら、スタックとヒープを操作してプログラムを実行していきます。ひとつの処理命令は「IMP + コマンド + パラメータ」のセットになっています。それぞれの役割は次のようになっています。

• IMP ･･･ Instruction Modification Parameterの略で、処理命令の大まかなカテゴリを表します（AS的にはパッケージのようなものです）。
• コマンド ･･･ 処理命令の具体的な種類を表します（AS的にはメソッドのようなものです）。
• パラメータ ･･･ コマンドを実行するための引数です。コマンドによっては無い場合があります。

それぞれの具体的なコードは以下で解説されているので、心の目で見るといいと思います。
» Whitespace基礎文法最速マスター

ソースコード
こちらからダウンロードして自由に使ってください。496行目辺りからインタプリタのクラスが記述してあります。本当は正規表現でスマートにやりたかったんですけど、汚くなっちゃいました。

超マイペースでぼちぼち作っていた、AIで歩行動作を学習しようプロジェクト（１歩目、２歩目）なのですが、先日のイベントでお話したこともあり一段落したので、ひとまずトップページで正式公開することにしました。

» Earthwalker

今回のアップデートは遺伝的アルゴリズムの最適化、インターフェースの強化、そしてエディタ機能です。

今までは頑張るイモ虫君を見ているだけでしたが、これからは好きな構造の生き物を創って歩かせることができます。誰も見たことのない生き物たちが頑張って歩き方を覚えていく様子を、ほほえましく見守ってあげてください。

エディタ機能
生物の作り方をちょっと説明。真ん中の地球にマウスを持っていくとエディタ機能に入れます。その後、地球の下のほうの「HELP!」にマウスを合わせるとエディタの使い方を見ることができます。基本的には動きの軸となる関節を、棒の体で繋いであげれば完成です。左下のNODEやJOINTは身体構造をあらわしていて、それぞれ関節の数、棒の数になっています。

あまりにパーツの多い生物を作るとPCが重くなっちゃうし、たまに物理演算が崩壊して生き物が飛んでっちゃうので注意ですが、やっとコンテンツとして1ステップ進めることができたかなあ、といった感じです。

学習パラメータ
歩行動作のためのパラメータも少し変えました。
0.5秒ごとに各関節の速度が決められた数値に切り替わるようにして、それを5回繰り返します。1回関節の速度が切り替わる単位を1ステップとします。5ステップをまとめて、1回の歩行動作（＝1サイクル）とします。個体評価は3サイクルでおこないます。計測前の座標と、3サイクル経過後の座標を比べて、どれくらい進んだのかを評価値として遺伝的アルゴリズムを実行します。

左下のSTEPやCYCLEはこの値となっています。ちなみにAGEは世代数、SCOREはその世代の中での最高得点です。それぞれの生き物にくっついてる数字やグラフ表現は個人的な趣味で、中身は適当です、すみません、でも好きなんですこういうの。

今後の予定
このあとどうするかなのですが、まだノープラン。いろんな人の生き物を見れたりするビューアや、レースさせるバトル機能もおもしろそうですし、進化の系譜をまとめて図鑑にするのもいいかも。やりたいことは尽きないですけど、またマイペースに作っていきます。

今、自分が何を作りたいのか、恥ずかしながら模索中です。色々考えてはみるけど、いつも「たくさんの人に喜んでもらいたい」という結論にたどり着きます。僕にとってテクノロジーは大きなキャンバスであり、プログラムは絵筆なのかな。へっぽこプログラマな僕が言うのは何ともおこがましいのですが、音楽や文学や絵画やスポーツで世界中の人を感動させられるなら、プログラムにも何かきっとできるはず。

イベント会場でも、プロジェクタを使ってこいつを設置させてもらったのですが、多くの人に楽しんでいただき、僕が思いもかけないような生き物がたくさん生まれました。そんな生き物たちがだんだんと歩けるようになっていく様子がかわいくて、ただ感動していました（親心によるところも少なからずあると思いますが）。みなさま、どうもありがとうござました。

学習アルゴリズムというコアな技術の軸をぶらさずに、どう表現すればもっと多くの人に楽しんでもらえるのか。イモ虫君にとても勉強させてもらってます。感謝。

「GEEKs」は自由な発想でテクノロジーを駆使し、モノを作る楽しさと独創性を刺激するセミナーイベントです。
今回のテーマは、Flash ActionScriptによるモーショングラフィックスです。
Flashにおける、動きのデザイン、インタラクティブデザインには、見る人を魅了して驚かせる効果があります。制作者には、ビジュアルを表現するだけではなく、それを成り立たせる構造やしくみをデザインする技術が必要となります。
本イベントでは、ROXIK の城戸雅行（きどまさゆき）氏と alumican.net の奥田透也（おくだゆきや）氏をゲストに迎え、ActionScript 3.0で複雑なモーションプログラムを構築するための、考え方や手法をご紹介いただきます。

というわけでロクナナ様のイベントで喋ります。ご一緒させていただくもう一人の登壇者はあの『エコだ動物園』や『全日本バーベイタム選手権』を手がけられたROXIKの城戸さんです。こんなことってあるんですね、すごい。

肝心の話す内容なのですが『Flashを使って自由にやっていいですよ』とのことでしたので、僕は1時間半壇上でニヤニヤしていたいと思います。半分本当で半分冗談です。あまり仕事にすぐには使えないかもだけど、Flash使ったらこんなおもしろそうなことできるよね！そしたらこんなこともできちゃうよね！みたいなことをみんなと考えたいな！！もしよろしければ皆様もFlashを始めた頃の気持ちに戻って、ご一緒にニヤニヤしませんか。

なんと募集開始から1日で満席となってしまったようです、ごめんなさい。。。
チケットを逃された方々、もしかしたら今後キャンセル分の空きが出るかもしれないので引き続きチェックお願いしますm(_ _)m

# 最近告知ばかりですみません。
# 書くネタはいっぱいあるので、新しい職場が落ち着いたらまた再開します。

外部から読み込んだ画像をテクスチャとして球面上にマッピングしています。
パースはつけていません。

一応最適化ということで、頂点をなるべく重複点させないようにしています。ただし画像の端に対応する頂点が反対側の端と（極に関しては隣とも）うまくマージできずにほったらかしなので、頑張ればもうちょっと減らせると思います。

迷ったのが、多数の3次元座標を Matrix3D を使って一括投影するのに、
Utils3D.projectVectorsとMatrix3D.transformVectorsがあるということ。
前者は2次元座標に、後者は3次元座標に投影してくれる。投影後にzバッファしようと思ったら、projectVectorsは第3引数で渡したuvtのうちtに奥行きが入っているのでそれでソートしてやる。transformVectorsなら3次元座標のzを使えばよろし。

今回は球体ということで、z バッファは必要なかったので（視点と逆向きの法線ベクトルを持つポリゴンのみを描画すればよい）、drawTrianglesの第4引数であるcullingの値を適切に設定することでこっち側向いてるポリゴンだけ描画しました。

具体的にはポリゴンを形成する頂点を時計回りで指定して、球体の内側から外側に向かって面の法線ベクトルを伸ばしてます。このときcullingにTriangleCulling.NEGATIVEを設定すれば、あっち側（視点ベクトルと同じ方向）を向いてるポリゴンは描画されないのでいい感じ。球体を内側から見る場合にはTriangleCulling.POSITIVEにする。

話を戻すと、projectVectorsでもtransformVectorsでもどっちでも良かったので、両方やって速い方を使うことにしたのですけど、両者ほとんど差がない。一瞬transformVectorsのが速い気がしたんだけど多分気のせい。

やってる途中でハマったのが、projectVectorsで投影後のuvt値のうち、t値がどうしても全部1になってしまう問題。これはpsyarkさんに教えてもらって理解。多謝。

@alumican_net 全部1になるのは、第一引数のMatrix3DがProjection行ってないからではないかなー [link]

PerspectiveProjection#toMatrix3D使うと計算楽だよ [link]

Projection行ってるかどうかは、Vector3Dを変換してwが大きくなるかで分かります。もしくはMatrix3Dの4列目に0以外があるかどうか（これはあまり自信なし） [link]

普通はrawData[11]が1とかになる。z→wにするために。 [link]

Matrix3DにPerspectiveProjectionを設定しないとダメらしい。並行投影なのでその辺を端折ったのがいけなかったのか。

最後に、drawTrianglesは意外と重い、期待値が高かっただけに拍子抜け。
限定的な使い方に絞って最適化頑張って、やっとPapervision3Dに勝てるくらい。

描画する頂点を全部まとめて毎フレーム1回のdrawTrianglesに押さえてはいますが、それでも結構くる。しかも残念なことに描画頂点数というよりは、むしろ描画領域が速度に大きく影響している。見えてないポリゴンをdrawTrianglesに渡さないとか色々試してみたけど結果はほとんど変わらず（むしろVectorを作り直すのに時間が余計かかったくらい）。結局画質を落とすのが一番パフォーマンスを上げるという結果になって萎え～。

とはいえdrawTrianglesを使えば簡単にかなりトリッキーなことができるので、使いどころを考えればおもしろい表現ができるはず。まだ完全には理解してないので、もっといい最適化手法がありそう。

Flash界隈問わず、色んなクリエイターが色んなクリエイティブなことを話しましょうという素敵なイベントなのですが、そこで何故か僕がライブコーディングをすることになりました。

「秋だけに、おいしい素材をつくってください。」というお題で30分間のライブコーディングをするのはKAYAC道家さん、Clockmakerさん、BOW吉川さん、teamLab河北さんというそうそうたるメンツ、そして何故か僕という。ねえ、なんで？

人前でコーディングなんかしたことないし、なにより僕にはタッチタイピングが全くできないという笑撃の事実がございます。なので、ウルトラコーディングは他の人に任せて、僕はすみっこで小さい笑いを細かく取っていこうかな、と。

とはいいつつも、出るからにはなんかやろうという事で色々考えて行きますよ～。
さてどうなることやら。

そんなわけで、Flashに関わってる人、Flashに関わってる人に関わりたい人、僕の慌てふためく姿を見て安心応援したい人、神コーディングを見たい人などにおすすめの要注目イベントなのです。僕も、（主に僕以外の）著名人方が何を作るのかとても楽しみです。
定員までまだ若干の余裕があるそうなので、上記リンクから申し込んで、どうぞ気軽に遊びに来てください。

それでは会場で会いましょう。

スタイルメントは40人超の比較的大きなデザイン会社であるにもかかわらず、社員同士壁がなく、また社員の勉強を応援するアカデミックな面も持ち合わせている恵まれた環境の会社でした。

何も分からないまま新卒として入社し、一年半育てて頂いたご恩を十分にお返しできなかったという点が心残りではありますが、これからの自分と真剣に向き合った結果、まだ中学生だった自分がWebのコンテンツを見て感じたおもしろさや感動の原点を追求することにしました。

自分が感じたシンプルな感動を、自分なりに世の中に再発信できればと思います。

がんばります。

12月1日からはthaでお世話になります。
これからもどうぞよろしく御願いいたします。

どうも間が空いてしまってすいません。
前回の何も学習しなかったバージョンに脳みそを加えて、単純なGAを組み込んできました。ageが世代、fitnessがその世代の生物が記録した中で一番良かった成績です。この数値が上がっていけば学習が成功しているといえます。3匹しか見えていませんが、一応裏側で10匹ほど動いています。

» Earthwalker Prototype02

う～ん、学習してるような、してないような。なんとも微妙な感じです。まだまだ改良が必要です。
GAの基本設定としては、エリート（淘汰や突然変異を受けず、次世代にそのまま残される個体）は生成最優秀の一匹、交配は2点交叉が1ペア、パラメータ化と評価方法は前回に示したとおり。かなり勘です。

ちなみに、今回から描画をnutsuさん作のFrocessingでおこなっています。生物の体が曲線描画になっているところなんかそうですね。ありがたやありがたや。

見た目が貧相なので、エンジンをバージョンアップしていくと共に、次回はもうちょっとかっこよくなる予定です。思いっきり趣味に走ります。メーターとかグラフをいっぱいつけます。(*ﾟ∀ﾟ)=3 ﾑｯﾊｰ!!。ではまた。