大阪てら子 13

大阪てら子 13 「忘れたい過去を燃やし尽くす会」

に、行ってきました。
てら子3回目。

忘れないうちにメモしておきます。

分からない人がわからない感じで書いてますので、悪しからず。

（いままでのてら子のまとめはこちらから）

今回は、「忘れたい過去を燃やし尽くす会」ということで、
火、がテーマ。
（結局だれも忘れたい過去は燃やしてなかった気が、、）

各人がそれぞれのアプローチで炎を作ってきていました。

archangさん

事の発端であるというarchangさんから。
過去の卒制が、燃やす事をテーマにしていたのに、全くといい程燃やせていなかったので、今回、再度挑戦。

基本はタイムラインベースでしたが、炎の部分のみASで書かかれていました。
どこかのサンプルサイトのを使った、ということでしたが、上手く燃えていました。

グローフィルターで作られているらしいです。
それをランダムな大きさ、位置でduplicateして、ゆらゆらさせているそうです。（これが炎の表現の基本形？）

理想はこれだそうです。

れんさん

テーマは消したくても消せない、Flashに対する情熱の炎、だそうです。

やっている内容的には、archangさんと同じ感じみたいですが、それを全てタイムラインでやっていました。レイヤーの数がすごい事になっていました。

作りとしては、赤の円を描く→その円を加算で重ねる→それをぼかしてゆらゆらさせる（この辺はよくわかりません。要検証）

さらにこれプラス、スクリプトでも炎をかいておられました。
そしてそれをwebCamの映像と連動させて、画面上にある炎をつかまえようとするけど逃げられる→消したくても消せない、という事をされていました。

卓袱台次郎さん

なんとIEやら、デスクトップのアイコンが燃える。

タネを明かせばIEに見えたのはIEではなく、mProjectorで作ったデスクトップアプリだそうで、単なる静止画を燃やしているだけ、だそうです。
アイコンも、燃えてるアニメーションと、燃えたあとの焦げた画像を上から重ねているだけで、実際は透過しているフルスクリーンのデスクトップアプリ上で燃えている感じ。
僕を含め、みなさん見事に騙されていました。

このmProjectorは、ちょっとしたデスクトップアプリを作るのにはすごく便利だそう。
AIRに押されてあまり認知はされなかったようですが。
炎のアニメーションはAfter Effectsを使ってられました。
実際に５分程で炎をライブコーディングさながらに作ってくれました。かなり手際が良かったです。
ここを参考にされたそうです。

03/25:追記 – ご本人のブログで詳しく紹介されています。
アプリのダウンロードも出来ます！

シナチクさん

タイムライン。
小さい炎から大きい炎になり、最後は煙になる、という流れを3パターン作り、それを、大きさ位置、透明度をランダムにして発生させ、炎の表現を作っていました。

単に白バックで燃やすだけでは味気ない、ということで、淀川河川敷の写真に炎をのせて、たき火のようにしていました。
さらにその炎は対岸に飛ばせたり、と、アイデアが面白かったです。

もう一つの作品でもトーマス（？）が煙をあげて走ったり、とかなり変わった内容ながら、今回の中で一番笑いを取っていたのではないでしょうか。

ご本人さんのブログに作品がアップされています。

アイデアリソースはこちらだそうです。
技術ばかりを追求するアプローチもいいが、こういうアイデアありきのものもいいのでは（違う？）、とおっしゃってました。

teraさん

東京から創始者が来てくれました！

今回はwiiとの連動で、ロウソクの炎（実際の炎）で、画面上の地図を照らす、という事をされていました。

基本的な仕組みは、こちら、だそうです。
要するに、wiiの赤外線通信してるコントローラーの赤外線を操って、パソコンのマウスを動かしてしまおう、という事（かな？）。

で、ロウソクの火からは赤外線が出てるので（知らなかった！）、それをマウス代わりに使える、という事みたい。

で、もう一つ、炎の表現もスクリプトで書かれていました。
このサイトのをFlashに移植したそうです。
（このサイトのはFlexベースだそうです。）

詳しくは後日teraさん自身がブログの方でビデオチュートリアルとしてまとめてくださる予定、だそうです。期待。

記念に赤外線LEDを頂きました。ゲイナーでも使えますよね？

3/30:追記 – ブログで詳しい解説がアップされました！

なぎまぐさん

スクリプトで。
webcamの映像を動体検知して、動いているところを燃やす、ということをされていました。
燃やしている部分は前回発表されていた、DisplacementMapFilterを使用。
色はColorTransformクラスで。
赤の色の部分にsinをかけることによって、赤みに変化をつけていたり、と、理系な感じでした。

DisplacementMapFilterのPerlin Noiseを使っているようです。

03/26：追記 – ご本人さんのブログにアップされました！

hoehoeさん

Nintendo DSとFlashの連携、という（僕は）聞いた事のない事をされていました。

DSのタッチパネルをごしごしとこすると、画面上に火が起こる！、、予定が、時間がなく、煙までになってしまったようです。
（炎を出すと落ちてしまった、と後でおっしゃってもいました。）

あと、DSには音声入力もついているので、マイクに息を吹きかけると煙が風に吹かれたり、
DSに加速度センサーをつけて、本体を振ると、風が起こせたりしてました。

内部的には、DSで自作ソフトを走らせ、Wi-Fi(Wikipedia)接続でPCに飛ばし、それをJAVAで作ったチャットサーバに読み込ませ、それをFlashで解析、という感じ（だと思います）。
もはやFlashの範疇を超えていると思われます。
が、ご本人は全く難しい事はしてない、とおっしゃってました。すごい。

ご本人さんの解説が詳しいです。

さくーしゃさん

ここの考え方を基本に（かなり昔からある考え方のようです）、スクリプトでガリガリとされていました。

ここで僕が説明するよりも、ご本人のブログを見た方が、確実でわかりやすいと思われます。

[Saq.]大阪てら子 13 でつくったやつ。

発表中、話題になっていた、「ペロリンノイズ」ですが、カタカナ表記だと、「パーリンノイズ」になるようです。
辞書にない英語
WikiPedia

けど、いいです、ペロリンw
２ペロリン（パーリンノイズを二枚重ねること）とか使っていきます。

今回のてら子のまとめ記事も書いてくれてます。
こっち見たほうが早いかも、、。

Idoさん

これを、Flashに移植、AIRアプリにする、、、予定だったそうですが、
AIRに移植する段階でつまずいたそうです。

FlashのコンポーネントがFlexで動かない？とかなんとか、だそうで、解決方法はもちろん、問題点すら理解していません、、。

まとめとか

今回は火を使ってなんか、というようにテーマがあったのですが、
本当に皆さんそれぞれのアプローチをされていて、Flashの幅の広さ、楽しさ、面白さといったところを再認識させられた勉強会でした。
自分もなにかしらでもいいから発表したらよかったかな、とちょっと後悔したり。

二次会以降も、貴重のお話の数々、楽しかったです。
teraさんがガンダムネタで急に元気になったのには笑いました。
ファンネルの動きをイーズアウトって言う人なんて初めてみたw

最後に、冒頭にも書いた通り、わからない人がわからないなりに書いていますので、
間違っているところ等が多々あると思われます。
そんな場合は指摘してもらえればうれしいです。
また、これはいっちゃいかんよ！とかいうようなのがあればそれも言って下さい。