« 「そんな言い方誰もしない」から、何を主張したいのかについて決め付けるのはどうよ? « » 子供の話でおけぐわさんに返信 »

2007年01月26日

 Flashで炎のエフェクトこのエントリーを含むはてなブックマーク

こんなの作りました。

(クリックでFlashに飛びます。)

以下解説

作り方

Flashは最近こんなこともできるようになってきました。
これ、実はASを使わずにオーサリングだけでも再現できるので、そのやり方を簡単に解説しておきます。

まずこういうものを作ります。

丸いのがボコボコ出てくるようなFlashで、AS得意な人はASで、アニメーション得意な人はアニメーションで実装すればいいと思います。
ただしムービークリップ使ってください。
これは分かりやすく半透明にしましたが、本来は不透明で、赤にほんの少しオレンジが混ざった色で作ってください。
ちなみに根元の部分にはこの円を4つ重ねています。

ブラーをかけるとこうなります

ASだと、blurフィルタ、アニメーションだとぼかしってやつですね。

さらにブレンドモードを加算に

ASだと、blendMode="add"; アニメーションだとプロパティパネルの右下あたりで加算を選択します。
これだけで炎っぽいものが作れちゃうわけです。

弱点としては、白い背景では色が飛んでしまって見えなくなります。
裏に赤いオブジェクトを配置するなど、ある程度配慮すればなんとかなりそうな気もしますし、使うときは画面を暗くするって方法でもいいかもしれませんね。

バリエーション

青い炎
緑の炎
紫の炎
ダークな炎(加算ではなく減算を使っています。)

追記

ズサさんが実用性の高いものを作ってくれました。
Phinox.BLOG | Flashで炎のエフェクト・改
炎は、実際その後ろにある光をある程度は遮断するため、この方式は自然に近いと思われます。
アルファと加算の組み合わせは、描画面積に比例して重くなる割合が高いので、大きな画像にするときは注意してください。

他の人もいろいろな方式で試してみて、公開してもらうと、とても面白いと思います。

トラックバックURL

トラックバック

» from 覚え書き
しっぽのブログさんの炎を参考に。というより、そんままだけど。 炎てすと code on 2009-1-18 - wonderfl build fl... [Read More]

» 高機能ステップメールCGIならペリカン君 from ブログSNS情報商材
この情報の内容を今すぐ見たい方はこちらペリカン君 - 高機能ステップメールCGI,月額費無料で使い放題,携帯対応,一斉配信,自動配信,格安,オート... [Read More]

コメント

1160   投稿者: しっぽ ◆fdGP2uSVfg (2007年01月26日 00:45)

ちなみにこれを作っていて
「どうして炎は赤の中に黄色が入っているんだろう?」
という積年の疑問が解けました。

1165   投稿者: ナナシアター (2007年01月26日 15:58)

これは・・・実用価値が高そうですね・・・

1167   投稿者: しっぽ ◆fdGP2uSVfg (2007年01月26日 18:54)

そうですね、多少品質を落とせば通常のアニメーションに組み込んで支障の無い重さです。

1180   投稿者: 龍 (2007年01月28日 14:55)

初めて見ると魂に見えました。

1230   投稿者: やんぼう (2007年02月09日 01:23)

うおお、火事とか戦争の炎ってどうやって作るんだろうと疑問におもって
「炎 エフェクト flash」でググったら一発ででてきました。

すばらしいです。参考にさせていただきますぅ!