ゲームでよくある画面エフェクトを作ってみた

最近ゲームのことを考えてて思ったのがエフェクト・演出です。自分のゲームにもっと演出が欲しいな、とちょっと思ったので作ってみることにしました。

で、とりあえず何から作ろうかなと考えて、簡単そうなやつから作ってみました。enchant.jsには拡大・縮小・回転のプログラムが最初から入っているのでそれを利用したものを考えてつくってみました。

それで出来上がったものがこちら

▷▷▷画面エフェクトのサンプル

各クマさんをタッチするとそれぞれのエフェクトが作動します。

やっぱゲームって見た目の演出が大事やと思うんですよね。演出がちゃんとあるだけでペラペラのカスみたいな内容のゲームでも面白いと感じさせることができるんやないかと思うんですよ(^^;)逆にストーリーとかシステムとか超凝ってても演出なかったら絶対クソゲーやろうし。ゲームプログラムで一番大事なのはこういう演出やなかろうかと思うわけですよ(´ー`*)ウンウン

RPGの敵出現風エフェクト

左のクマさんを押すと拡大縮小を利用したRPGの敵に遭遇した時の演出みたいなものが起こります。音と組み合わせればなんとなくそんな感じしなくもないでしょ?

クマのイベントリスナーにstart()を入れといて触るとスタート、メインループ内のdo()がisPlayがtrueで作動って感じです。dataはSceneオブジェクトです。Groupでやってみたら拡大の中心点が違って位置が思いっきりずれます(;’∀’)

※GroupのoriginX、originYを変更すると大丈夫です。Groupは初期設定で左上が原点になってるようです。

ダメージ演出みたいなやつ

真ん中のクマさんを押すと何か衝撃を受けて画面が揺れてる感じになります。ダメージを受けたときなんかに使えます。

シーンをランダムに一定時間動かしてるだけです。イージーですね(´∀`)

画面全体を回転

今回難しかったのがこれ。どうやらenchant.jsにはspriteにあるrotate()関数はGroupやSceneにはついていないみたいです。なのでいくつもの画像を同時に回転させようとすると自分でプログラムを組まないといけないみたいです( ;∀;)

で、右のクマさんをタッチすると背景とクマさんが回転します。クマさんが背景の定位置にくっついて回ることがこのプログラムの重要なポイントです。

先に言っときますが、私高校時代全く勉強しなかったのでサインコサインて実はよくわかっていない(;’∀’)しかしプログラムなら読めば何とかなる!円の動きのプログラムを検索していくつか読めば何とかなるもんですよ(笑)

まぁ簡単に説明するとinitialize()で原点を設定してクマさんまでの半径を取得して謎の数学関数を使えば動きます(適当)


コメントを残す

メールアドレスが公開されることはありません。