BraveWorkzコーディング担当のその2、『アンコはこし餡の方が好き！』pon_zuです。
さて、今回の開発日誌のテーマはズバリ「パーティクル」です。
パーティクルというのは、こんなのです。
js.doit - パーティクル
以前から色んな人が作ったパーティクルを見て「うおー、キレーだなー」と、憧れていたのですが、やっぱり見てるだけじゃつまらない！自分でも作ってみたい！！
ということで、いつもはゲーム作りに使用しているenchant.jsを使って作ってみました。
パーティクルを描画するのに必要なもの
enchant.jsで一番良く使われるのはSpriteクラスですが、今回のパーティクルの描画にはSurfaceクラスを使用します。SurfaceクラスはHTML5で実装されたcanvas要素をラッピングしたクラスで、Surfaceクラスを経由することで、enchant.jsからcanvas要素を操作することができます。enchant.jsを使ったcanvas要素の操作に関しては、phiさんが以下の記事に分かりやすくまとめてくださっています。
enchant.js 怒涛の 100 tips
完成品
jsdo.itに投稿されてるパーティクルのコードを参考に、早速作ってみました。Surfaceクラスをあまり使ったことがなかったのでちょっと手間取りましたが、勉強しながらでも2時間位で形になりました。さすがenchant.js！！
マウスクリックした場所に流れていくだけの単純な動きですが、結構綺麗で満足です。
え？何か黒いのが見えてる？いやいや、気のせいですよー？
さて、次は何して遊ぼうかなー。
次回作について
次回作も鋭意開発中です。
こっそり作業状況を覗いてみたところ、brave作のドット絵も大分力入っていたので、ゲームの内容はもちろんグラフィック面でも前作よりも更にパワーアップしたものをお見せできると思います！
どうぞお楽しみに！
0 comments:
コメントを投稿