ニートが頑張るブログ

ニートが現実逃避するために創作活動など色々とカオスに頑張ってみる
ニートが頑張るブログ TOP  >  作ったFlash >  エフェクトメーカー

エフェクトメーカー

カスタマイズした物理法則に従ってスプライトを出力・変形させ、
エフェクトアニメを作成・撮影する「エフェクトメーカー」です。

(主に自作ゲーム用の素材作りに役立つと思われます)



全画面とか (最新版とか、サイズ640版自ページにあります)

Zキー 「玉」発射
Xキー 一時停止・再生
Cキー コマ送り
(方向キーやシフトキーで移動もできます)



とりあえずは典型パターンのサンプルを再生出来るようにしましたので
かなり弄りやすくなったと思います。

エフェクトメーカーエフェクトメーカー
エフェクトメーカーエフェクトメーカー

エフェクトメーカー

↓続きは細かいマニュアルです。 超長いです。




 

エフェクトメーカー マニュアル
まずは各メニューの見方から。

◆メインメニュー
マニュアル

 玉メニューを開くボタンです。

 3種類のエフェクトメニューを開くボタンです。

 背景色を変更するためのRGBバーです。

 地面の表示をオン・オフするボタンです。

 撮影ガイド用青い枠線の表示をオン・オフするボタンです。
  ドラッグすることで大きさと高さを変更できます。

 現在のアニメの進行フレームが表示されます。

 現在のフレームレート(主に処理の重さ)が表示されます。

 発射されたエフェクトの数がカウントされます。

 カメラの角度が表示されます。

 メインメニューの表示をオン・オフするボタンです。

 発射ボタンです。「玉」を発射してアニメをスタートさせます。

 再生・停止ボタンです。

 コマ送りボタンです。



◆エフェクトメニュー
マニュアル
アニメの基本となる「エフェクト」の物理挙動を制御するためのメニューです。


 エフェクトの「タイプ」(後述)を変更するボタンです。

 エフェクトの「加算モード」を変更するチャンネルです。
  加算:発光します。すべての光が足し算で重なります。
  乗算:乗算モードです。背景が黒いと見えないだけです。
  減算:ネガです。背景が黒いと見えないだけです。
  透明:半透明です。
  なし:なにもせず、エフェクトは遠近感に従って重なります。


 エフェクトの「明暗モード」を変更するチャンネルです。
  明暗:明るい状態から暗い状態へとフェードアウトします。
       加算モードと相性が良いです。
  暗明:暗い状態から明るい状態へとフェードアウトします。
       殆ど逆再生用です、
  暗明暗:暗い状態から明るい状態を経て、
       再び暗い状態へとフェードアウトします。
  消滅:透明度の変化によってフェードアウトします。
       明暗の色の変化が際どい場合などに使います。
  点滅:点滅しながら消えていきます。
  なし:なにも変化しません。


 エフェクトの「大きさ変化モード」を変更するチャンネルです。
  小大:小さい状態から大きい状態へと拡大します。
  大小:大きい状態から小さい状態へと縮小します。
  小大小:小さい状態から大きい状態を経て、
       再び小さい状態へと縮小します。
  縦長:エフェクトが向いている方向に縦長に伸びていきます。
  横長:エフェクトが向いている方向に横長に伸びていきます。
  回転:一回転します。
       反転状態で、煙のようなエフェクトに使います。
  なし:なにも変化しません。


 エフェクトの「素材」を選ぶボタンです。
  矢印ボタンをドラッグすることでダイヤル式に素材を選ぶことができます。
  
  このボタン自体をドラッグすることで、エフェクトの大きさと角度を
  変えることも出来ます。

  このボタン自体をドラッグせずにクリックすることで、
  エフェクトにかける「効果」を変えることも出来ます。
  効果は、「グロー」「ブラー」「何も無し」の3種類です。

  グロー効果:エフェクトの縁に光のような効果が現れます。
  ブラー効果:エフェクトの輪郭を全体的にボヤかせます。
  何も無し:何も効果をかけません。


 エフェクトの「色相」を変えるダイヤルです。

 エフェクトのアニメーションの「フレーム数」を増減するチャンエルです。
  フレーム数が0だと、何も表示されないまま消滅します。

 エフェクトの「ランダム値」を増減するチャンネルです。
  ランダム値は、エフェクトが出力される角度、速度、
  さらにエフェクトアニメの大きさ、角度にも影響(ノイズ)を与えます。
  ランダム値の絶対値が大きければ大きいほど、ノイズの激しいエフェクトになります。

  ランダム値をマイナスにすると
  エフェクトアニメの角度にだけ影響を与えないようにすることもできます。

 エフェクトの「横分割数」を増減するチャンネルです。
  横分割数×縦分割数の値だけ、エフェクトは出力されます。
  横分割数はその数だけ横角度を横に分割します。

 エフェクトの「横角度」を増減するチャンネルです。
  横角度は0~360までの値を取ります。
  この値に従ってエフェクトは横方向に広がる角度を決めます。

 エフェクトの「縦分割数」を増減するチャンネルです。
  縦分割数はその数だけ縦角度を縦に分割します。

 エフェクトの「縦角度」を増減するチャンネルです。
  縦角度は-180~360までの値を取ります。
  この値に従ってエフェクトは縦方向に広がる角度を決めます。
  
 エフェクトの「初速度」を増減するチャンネルです。

  エフェクトは、縦角度、横角度に応じて割り当てられた角度を向き、
  この初速度に応じたスピードで撃ち出されます。

  この初速度はマイナスの値を取ることも出来ますが
  単に逆方向に進んでいくだけです。

 エフェクトの「加速度」を増減するチャンネルです。

  加速度と言っても等加速度運動ではありません。
  例えばこの値がだった場合、
  エフェクトは進む速度を毎フレームごとに5%ずつ増しながら加速していきます。

  つまり、速度に関しては等比級数的な挙動を取るということです。

  この値はマイナスの値を取ることも出来ます。
  その場合も、等比級数的に0に収束していきます。
  「速度がマイナスに反転してバックする」ということはありません。

 エフェクトの「打ち上げ速度」を増減するチャンネルです。

  エフェクトは初速度だけで既に、
  X軸、Y軸、Z軸ベクトルのスピードを持っていますが、
  さらにそれとは別口で、Y軸ベクトルのスピードを持っています。
  それがこの打ち上げ速度です。

  これの打ち上げ速度が正の値のとき、とりあえずエフェクトは
  上に向かって上昇していきます。

 エフェクトの「重力加速度」を増減するチャンネルです。

  エフェクトの打ち上げ速度に常にかかっている力です。
  エフェクトはY軸方向に関しては等加速度運動を行います。
  この値がマイナスの時、下方向にエフェクトは加速されます。

 ※なぜ初速度には等比級数的な力が働き、
  打ち上げ速度には等加速度的な力が働くかというと、
  実際の花火の挙動に近づける為です。


  つまり、空気抵抗とは等比級数的、
  重力加速度とは等加速度的だからです。


 エフェクトの「角速度」を増減するチャンネルです。
  
  エフェクトが持つX-Z平面上の速度ベクトルにこの値だけ回転をかけます。
  つねに一定角速度でエフェクトは曲がって行きます。
  
 エフェクトの「初速度」を増減するチャンネルです。

  エフェクトの角速度を加速する加速度です。
  


◆玉メニュー
マニュアル
最初に打ち上げられ、
エフェクトを撃ち出す元となる「玉」の物理挙動を制御するメニューです。

※基本的にエフェクトメニューと同じところは同じなので説明は省きます。

 「反転設定」を変更するためのチャンネルです。

この「反転設定」とは、
●や◆のエフェクトを補助するための設定です。

角度や裏表が一意に定まる▲エフェクトと違って、
それらのエフェクトは「どのように見せるか」を設定する必要があるのです。


反転設定
「無し」

回転も反転もさせない、という設定です。
●エフェクトは、その角度を維持したまま空中に浮かびます。

キラキラとした星のようなエフェクトを綺麗に並んだまま空中にばらまく時などに
このように設定します。
サンプルエフェクト:「キラキラ」

反転設定
「回転反転」

エフェクトは自身が進む方向に応じて回転させるし、
その方向が左が右かに従って反転もします。

反転させる設定が特に重要になってくるのは
煙のようなエフェクトを回転させながら立ち上らせる時などです。

右に進むエフェクトは時計回り、
左に進むエフェクトは反時計回り、のような事も出来ます。
サンプルエフェクト:「煙」

反転設定
「回転無反転」

エフェクトは自身の進む方向に応じて回転するが、
反転はしない、という設定です。

これは、角度の変化が大きい時、
イチイチ反転しているとチープに見える場合があるからです。
サンプルエフェクト:「羽」

反転設定
「無回転反転」

反転はするが回転はしないというよく分からない設定です。
単に組み合わせの結果生まれただけの設定です。


 「エフェクト出力フレーム数」を増減するためのチャンネルです。

エフェクトを何フレームかけながら打ち出していくかの設定をします。

例えば、エフェクト1が
横数10、縦数10のエフェクトだった場合、
エフェクト1は合計100個撃ち出すことになります。

そこで、例えばここのフレーム数をにした場合、
1フレーム毎にエフェクト1を20個ずつ撃ち出しながら
玉は動いていくことになります。

(※ちなみに数が綺麗に割り切れない場合は削られます)

 「エフェクト出力設定」を変更するためのチャンネルです。

  一括A:そのエフェクトを上から順番に打ち出していきます。
     エフェクト出力数がの場合、単に1フレームで全部撃ち出すだけです。
     その場合は、一括Aと一括Bに違いはありません。
  一括B:そのエフェクトを下から順番に打ち出していきます。
  ランダム:エフェクトをランダムな角度に打ち出していきます。
     合計は同じですが、横数や縦数による「濃度」はなくなります。
  撃たない:そのエフェクトを撃たないようにします。



以上で
メインメニュー、エフェクトメニュー、玉メニューの見方は終わりです。


これ以降は、更に細かく
エフェクトのタイプの説明
横角度、縦角度の説明をしていきます。


エフェクトの3つのタイプについて

三角
三角

「▲タイプ」
 エフェクトの、過去、現在、未来の3つの座標から、
 3角ポリゴン状にスプライトを変形させて表示するタイプです。

長所:重力や角速度を持ったエフェクトの形に自然にフィットします。
    エフェクトの「厚み」も表現できます。

短所:逆に重力も角速度も持たないエフェクトの場合、
    ポリゴンがペッタンコなので見えなくなってしまいます。
    また、「厚み」のために、手前に来るエフェクトも
    ペッタンコになる場合は見えなくなってしまいます。


菱形
菱形

「◆タイプ」
 エフェクトの、過去、現在の2つの座標から、
 直線状にスプライトを変形させて表示するタイプです。

長所:▲タイプと違って、厚みによって見えなくなる場合がありません。
    エフェクトのスピードと方向によって長さを、
    エフェクトの遠近感によって太さを変形させます。

短所:重力や角速度によってエフェクトの曲がる方向や
    表裏を表現することはできません。
    玉メニュー「反転設定」
    反転するようにすることで、多少の裏表表現をサポートできます。


丸
丸

「●タイプ」
 エフェクトの現在の座標から、
 点状にスプライトを表示するタイプです。

長所:とにかくシンプル
    エフェクトの角度や、伸び縮みを変化させずに
    出力したいときはこのタイプです。
    「大きさ変化モード」「縦長」にすることで
    ◆タイプと同じような挙動をさせることも出来ます。

短所:当然ですが長さも角度変化も表現できません。
    玉メニュー「反転設定」
    エフェクトの向かっている方向に向かって角度を回転させるかどうか設定できます。





縦角度の説明

「横角度」は分かりやすいと思いますが、
「縦角度」は結構変なことになっているのでちゃんと説明します。

縦角度は-180度~360度までという変な値を取れるのですが
それぞれの領域で3つのパターンに別れています。


まず縦角度を0度~180度までの間に設定した場合、
エフェクトはこのように広がります。
(↓これは60度に設定した場合)
縦数

180度で完全な球を描く状態から、0度で完全に平べったくなるまで
水平方向を基準にして狭まっていく感じです。

これによって、ドーナツのようなエフェクトも作れるということです。
実際には、跳ね上がる水しぶきのようなエフェクトを作るための設定です。

サンプルエフェクト:「水しぶき」


次に縦角度を190度~360度までの間に設定した場合、
エフェクトはこのように広がります。
(↓これは240度に設定した場合)
縦数

値から180を引いて、
その数字だけ逆三角錐状にばらまくという感じです。


まぁ、単に上方に上がるエフェクトに揃えたいのであれば
別に打ち上げ速度を上げれば良いのですが
やはりある程度狭まった方向で打ち上げたい状況はあるのです。

サンプルエフェクト:「煙」


最後に、縦角度を-10度~-180度までの間に設定した場合、
エフェクトはこのように広がります。
(↓これは-60度に設定した場合)
縦数

マイナスの値の絶対値の分だけ、
三角錐状にばらまくという感じです。




まぁそんな感じで、打ち上げる範囲設定が3種類あるということです。

↓つまり作ろうと思えばこういうのも作れるということです。

3色エフェクト


以上、糞長いマニュアルでした。

関連記事
[ 2011/11/26 19:27 ] 作ったFlash | TB(0) | CM(10)
PNGで書き出せますか?
[ 2013/02/21 12:08 ] [ 編集 ]
コメ返信
> PNGで書き出せますか?

いえ、このフラッシュは誠にふざけたことに

「自分でスクリーンショットを撮って保存してくれ」という仕様なのです。



「⑤ 撮影ガイド用の青い枠線」

↑これを見ながら、ただひたすらにスクショの画像を保存して、トリミングして、
それを主に加算のエフェクトにして使ってくれ、という話なのです。


保存したスクリーンショットを
どのような形式で保存してもらうかは、
MSペイントなどに貼り付けてから、ご自分で自由に考えてください、ということなのです。



なんでこんなふざけた仕様になっているかというと、
自分にはどうやってFLASHから画像を出力させたらいいのか分からないからです。

[ 2013/02/24 20:33 ] [ 編集 ]
自由に利用してよいのでしょうか?
面白いので自信の制作したイラストに利用したいのですが可能でしょうか?
使用制限(商用利用やエフェクトを土台にして画像加工して弄りまくるなど)などございましたら明示いただけますと有難いです。
[ 2013/11/07 22:44 ] [ 編集 ]
Re: 自由に利用してよいのでしょうか?
> 通りすがりの名無し さん


> 面白いので自信の制作したイラストに利用したいのですが可能でしょうか?
> 使用制限(商用利用やエフェクトを土台にして画像加工して弄りまくるなど)などございましたら明示いただけますと有難いです。


自分がこのブログ上で作ってるものは、全て、何してくれても結構ですよ。多分。

「無断転載、無断使用されて怒る」なんてことは、自分はしないと思います。


でも、「それがどの程度の度合いを超えたら自分は怒るようになるのか」というのは、
よくよく考えてみると、ちゃんと吟味してみたことは無かったですね。


例えば「あらゆる画像加工を許可する」と一度言ってしまうと、
「『←この絵ドヘタクソwww』みたいな文字を上から描く行為」だって、
「広義の画像加工」には入るわけですから、そういうことをされる覚悟もしないといけないわけですね。


・・・みたいなことを考えだすとキリがないのですが、
やっぱりどうでもいいと思います。


自分は何をどう使われても気にしませんし構いません。

商用利用とかも、
このニートが作ったものが商用になるのならどうぞご自由に、という感じでございます。

[ 2013/11/11 09:51 ] [ 編集 ]
コメント
すみません。「無断転載ニート」の名前に笑いました。
画像検索でエフェクトの画像を見つけて、いいなと思ったんですが

>自分がこのブログ上で作ってるものは、全て、何してくれても結構ですよ。多分。
と書いてあるので、是非使用させていただきます。

それと質問?です。
使うときにリンクなどはした方が良いでしょうか?
それともしない方が良いですか?
[ 2013/12/20 01:07 ] [ 編集 ]
コメント返信
> コメント さん


> それと質問?です。
> 使うときにリンクなどはした方が良いでしょうか?
> それともしない方が良いですか?


これもご自由に、という感じなのですねー。

リンクされると困る、なんてことはありませんね。

リンクされると嬉しいかもしれません。

そして当然ですが、リンクしなければならないなんてこともありませんよ。

それくらいのフリーダムです。
[ 2013/12/22 23:05 ] [ 編集 ]
エフェクトメーカーお借りしました
こんにちは、Inrayと申します。
今春発売予定のR18同人ゲーム「あまこい」内でエフェクトメーカーで作成した画像を使わせて頂きました。
使用に際して問題がありましたら、
お手数ですが下記の問い合わせフォームにてご連絡お願いいたします。
ttp://form1.fc2.com/form/?id=952048

・告知サイトおよびゲーム内でリンクを貼らせて頂きます
告知サイトURL※R18:amakoi.x.fc2.com/

あと、せっかくの透過が再現し辛いので出力モードがあると嬉しいです。
更に言うと、じぶんで描いた絵やアイテムを追加してレンダリングできるようになったらお金出してでも買いたいです^^
エンコード方法はこのあたりが参考になるかと
http://zapanet.info/blog/item/969
ソース公開などでお借りできればAS使いなので自分で追加します^^;
[ 2015/03/28 14:56 ] [ 編集 ]
Re: エフェクトメーカーお借りしました

> Inray さん


> 今春発売予定のR18同人ゲーム「あまこい」内でエフェクトメーカーで作成した画像を使わせて頂きました。
> ・告知サイトおよびゲーム内でリンクを貼らせて頂きます
> 告知サイトURL※R18:amakoi.x.fc2.com/

どうもです。
おお凄いですね。
使用に関する問題は無いと思います。なんでも使ってやって下さい。


> あと、せっかくの透過が再現し辛いので出力モードがあると嬉しいです。
> 更に言うと、じぶんで描いた絵やアイテムを追加してレンダリングできるようになったらお金出してでも買いたいです^^
> ソース公開などでお借りできればAS使いなので自分で追加します^^;


確かにこれは問題です。
でもやっぱFlashで画像保存させるのは大変そうですね。

ちなみにこれ、ASといってもパラフラ製です。

だからソース公開となるとパラフラのプロジェクトファイルの公開ということになりますが
それはイミフだろうし恥ずかしいなぁという感覚があります。
AS2.0で、やれることもかなり限られてくると思います。
(なんかそちらのリンクの画像変換の話はAS3.0の話のようですし)

パラフラの撮影ボタンなら透過pngで保存できるかなと思ったのですが
なんか実行時エラーとか言われて保存できそうにないです。どうなっているのやらです。


というわけで、どうもそこんとこは出来なさげな気がしています。スイマセン

[ 2015/04/02 17:16 ] [ 編集 ]
エフェクトメーカー 楽しめました。
作るの大変だったと思います。

webで存在しているというのが、とても意味のある事だと
思います。
これからも、ちょくちょく見に来ます。
ブログ楽しみにしています。
[ 2015/10/06 03:26 ] [ 編集 ]
コメント返信

> 名無しさん

どうもです。

> webで存在しているというのが、とても意味のある事だと
> 思います。

こういうとこを評価して頂けると有り難いものですね。
デスクトップ上のプログラムじゃないのでアレな所もあるのですが。

[ 2015/10/12 09:47 ] [ 編集 ]
コメントの投稿












管理者にだけ表示を許可する
トラックバック
この記事のトラックバックURL

月別カレンダー
04 ≪│2017/05│≫ 06
- 1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31 - - -