ハロウィンセール:−40% 11月4日まで、itch.ioでPixorが$19.99 $11.99 →

ピクセルアートの爆発スプライトシート

爆発は手でアニメーションを付けるのがいちばん難しいエフェクトの1つです。閃光、膨らんで冷えていく火球、転がり出る煙。Pixorは3Dパーティクルから、スプライトと同じルックで爆発を描くので、同じゲームにそのままなじみます。

アニメーションするピクセルアートの爆発。淡い閃光が膨らんでオレンジと赤の火球になり、冷えて灰色の煙になる
pxr effect explosion:12

爆発が伝わる条件

ゲームの速度でもしっかり伝わるピクセルアートの爆発には、順番に並ぶいくつかの要素があります。

  1. 閃光。パレットのいちばん明るい色で1~2フレーム、小さく明るく。ヒットした場所をプレイヤーに知らせます。
  2. 火球は急に膨らみ、冷えるにつれて黄色からオレンジ、赤へ変わります。
  3. 煙は転がり出て暗くなり、最後の炎が透けて見えます。
  4. 火花や破片は最初に飛び散り、1つが1~2ピクセルです。

手で描くと、跳ばずに大きくなり、重なり、色を変えていく形を十数フレーム描くことになります。手描きの爆発の多くは、フレーム数を減らし平らな形でごまかします。パーティクルツールで作って縮小した爆発の多くは、何百色もあるぼんやりした塊になり、ピクセルアートのゲームが求めるものとは正反対です。

Pixorで作る

モデルが何もなくても、1行でシートができます。

pxr effect explosion:12 --preset selout --size 64 --export gif,json -o explosion.png

同じ爆発を、閃光から煙まで64ピクセルの12フレームのスプライトシートにしたもの

これでexplosion.png(12枚の64×64フレームのシート)、各フレームの位置とタイミングを記したJSON、確認用のGIFが書き出されます。アプリでは、空のプロジェクトの画面にエフェクトを作成があり、読み込み…と無料モデルを見るの隣に並んでいます。

爆発は3Dパーティクルでできていて、モデルと同じパイプライン、つまり明暗の帯、色ごとの色相シフトしたランプ、パレット、線を通してレンダリングされます。だから与えたルックがそのまま反映されます。--preset seloutはselout風の色付きアウトラインを描き、--palette my-game.hexは自分のパレットに載せ、プロジェクト自身のスタイルを使えばスプライトと完全に一致します。

調整する

爆発には、Pixorのどのエフェクトとも同じ設定があります。

  • フレーム数:コロンの後の数字で、explosion:8ならさっと弾け、explosion:16ならゆっくりです。
  • サイズ:--sizeはフレームのピクセル数です。上の爆発は64で、ほとんどの敵には32か48が合います。
  • エネルギー(--effect-energy)は強さ、シーン内のエフェクト自体の大きさ(--effect-size)、位置(--effect-at X,Y,Z)も指定できます。
  • シード(--effect-seed):同じシードなら必ず同じピクセルになります。シード1、2、3でレンダリングすれば、互いにコピーでない3種類の爆発ができます。

敵の上で

爆発はたいてい何かに起こります。モデルに独立したアクションとして追加します。

pxr render spaceship.glb --view top-down --size 64 --clip none \
  --effect explosion:12 --effect-hit 2 --export json -o ship.png

アプリでは、シーンのステップで、アウトライナーの+からエフェクトの下に追加します。シーングラフのエフェクトノードと、fx-explosionという名前のアクションになり、シートに専用の行ができます。3Dビューでそのダイヤ形をドラッグして位置を決められます。

次の3つの設定で、場面に合わせられます。

  • ボーンに追従:銃口の先のマズルフラッシュ、手から放つ爆風。
  • クリップに重ねて再生(--effect-clip):モデルが何かをしている間に爆発を再生します。たとえば船が砕けるとき。
  • エフェクトのみ(--effect-alone):モデルなしで爆発だけを、キャラクターのシートと位置をそろえた独立レイヤーとして描きます。ゲームは、そこにあるどのスプライトの上にも重ねて再生します。

ヒットフレーム(--effect-hit 2)は、ヒットが決まるフレームに印を付けます。JSONではmeta.pixor.hitsに載るので、ゲームはちょうどそのフレームでカメラを揺らし、ダメージを与え、音を鳴らせます。

シミュレーションの煙

Pixor自身の爆発は軽快で、ほかに何も要りません。もっと重い爆発には、爆発のエミッターに乗せた煙のボリュームを足します。--effect explosion --volume puff:1.5@effect:1。Blender、EmberGen、Houdiniの.vdbシミュレーションも同じ場所で使え、同じ帯で描かれます。VDBからの火、煙、水を参照してください。

そのほかのエフェクト

同じコマンドで、ゲームのほかのエフェクトも作れます。hit-spark、slash、magic-burst、heal、portal、smoke-puff、dust、fire-loop、rain、snow、fireflies、falling-leavesです。fire-loopは松明や燃える残骸向けのループで、hit-sparkとslashは戦闘の一撃ごとに使う短いものです。爆発ではなく、壊れたり燃え尽きたりする敵には、死亡エフェクトのチュートリアルを参照してください。すべてのオプションはマニュアルにあります。

よくある質問

ピクセルアートの爆発は何フレーム必要ですか?

通常のヒットなら毎秒12フレームで8~12フレームです。弾の着弾のような小さなものは4~6フレーム、ボスの死亡はもっと長くてかまいません。Pixorの爆発は、explosion:10のように数を指定しなければ12フレームです。

爆発に自分のゲームのパレットは使えますか?

はい。モデルと同じスタイルを通してレンダリングされるので、--paletteに.hex、.gpl、.pngファイルを渡すか、プロジェクト自身のルックを使えば、爆発のすべてのピクセルがその色になります。

同じコマンドなら毎回同じ爆発になりますか?

はい。パーティクルはシードから生まれ、同じシードと設定なら必ず同じピクセルになります。バリエーションには--effect-seedを変えれば、互いにコピーでない3種類の爆発をゲームに入れられます。

次に読む

自分のモデルをブラウザーで無料で試すか、製品版を入手しましょう。

ブラウザーで試す Pixorを入手