ニートが頑張るブログ

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

波紋メーカー

なんか一段落ついたので。

上下左右に繋がる、
ループアニメーションしている水面のマップチップ
を作るためのなにかです。




使い方

クリックすると、その場所に波紋が発生します。
(正確には「その場所%96」という位置に)

そんな感じで波紋を合成しまくった結果を
コマ送りしながら撮影すれば、最大60コマでループする画像群が得られます。
(無理やりすぎる)

糞重いので、時間を止めながらとか、
画質を「低」にしながら配置して、
その後、画質を「高」にしてコマ送りしながらスクショとると良いです。



やってることは超原始的です。

前回の作ったようにクリックしたところに発生する波紋を
9字方向に複製して、ループさせているだけです。


ちなみに波紋は全部で180個(20*9)しか出せないようになってます。
(つまり20回クリックしたら最初のヤツから消えていきます)


でも、そんな風にループする円形の波紋の合成だけではショボかろうということで
結局、普通の直線的な波グラデをスライドさせて、全体のベースとしています。

で、その一次波を作るのが意外と面倒でした。

波

まずはこんな感じで、
#000000から#FFFFFFまでの間を「サインカーブ」してる素材を作りました、

で、これをすぐ使ってもいいんだけど、それも味気ないだろうから
次はコイツを縦方向に揺らすようにしました。

サインカーブ

で、その結果こんな風なワケのわからないモノができたので
こいつを良い感じに縮小させて、スライドする波の素材として使っています。
(こんなデカくてもサイズは軽い)
(こんなでも、手作りのドット絵みたいなモノだから)
縦横明暗


ちなみにこのスライドしている波は、ちょっと斜めっていますが、
その波の角度だってちゃんと考えています。

26.5度
つまりtan( 90°-26.5°)= およそ2となるような角度にしています。
この角度のお陰で、斜めを向いているクセに、波のループが常につながっているのです。

(そりゃ、45度とか90度まっすぐに配置すれば、どうやろうが繋がります)
(でも自分はどうしても斜めを向かせたかったのです)
(それも、できるだけ22.5度に近い角度が良いのです)
(そうすれば、一つの素材でも回転させれば8方向に波を向かせることが出来るのです)
(45度とか90度を向いた素材では、4方向しか向けない)


で、これを使えば、まずはこういう風な素材が手に入ります。

loop animated water texture

実際にループしています。
loop animated water textureloop animated water textureloop animated water texture

で、これを色々加工すると、
最終的にこんな感じなものが得られます。

loop animated water texture

loop animated water textureloop animated water textureloop animated water texture

は、どうやって↑これを↓こうするのか、の話。

関連記事
[ 2013/04/14 23:07 ] 作ったFlash | TB(0) | CM(0)
コメントの投稿












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

月別カレンダー
02 ≪│2017/03│≫ 03
- - - 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 -