Google Chrome または Safari を使用される事を強くお薦めしますw
他のブラウザでは Javascript の処理が重いです(汗)


2010/12/21

モーションブラー

MMD でモーションブラーやってみたという動画を見て おお と思ったのでやってみました。
とはいえ、2D の画像のスライドなので見てもちっとも面白くないです^^;;;

方法は馬鹿みたいでして、通常の描画をした後に1テンポ遅れた位置に薄い絵を描画してやれば良いわけです。下のサンプルでは2テンポ遅れた絵も表示しています(都合3枚の絵)。
シャッター速度が遅ければ遅いほど(あるいは物体の移動速度が速ければ速いほど)絵の枚数を増やせば良い、と。

本当に厳密にモーションブラーやろうと思ったらもっと面倒な計算をやらんといかんですが、別にこんなんでも十分ではなかろうかと。



絵は一定速で動いているので、ブレ具合(テンポの遅れ具合)も決め打ちで 5 pixel としています。

別窓で見たい方は→こちら

3D のポリゴンの描画とかでブラーするのも理屈は同じです。
canvas 使って 3D ポリゴン描画とかめっちゃ面倒くさいんでw、そのサンプルはまたやる気になったときにwww
webGL みたいなのが浸透したらもっと簡単にいろいろできるんでしょうけどね。

2 件のコメント:

oz さんのコメント...

ブラーがOFFなのにかかってるように見えるんですけど、
しばらく休んだ方がいいですか?w
っていうか、その画像見てたら目が…w

(●ω●)AJ さんのコメント...

休んでくださいwww

コメントを投稿