📘

Unityで3DのParticleを2DのSpriteSheetに無理やり変換して表示する

2023/01/23に公開

1行まとめ

新規プロジェクトでParticleを再生し、毎フレーム透過PNGとしてScreenshotして、ImageMagickでSpriteSheetにしました。

環境

  • Mac Unity 2021.3.9f1 LTS (x86)
  • ImageMagick 7.1.0-57

背景

2Dのゲームを開発しているとき、AssetStoreなどで購入した3DのParticleエフェクトを使おうとすると問題がよく起きます。特にURPなどを使用していると、独自で書かれたシェーダーがURPに対応していなかったり、2DLightが反映されなかったり、地道に想定通りの表示に直していくのが結構大変だったりします。

そこで、どうせ2D視点では毎回同じエフェクトを表示するんだから、Spriteアニメーションで問題ないなら変換しちゃってもいいだろうという発想です。少し試行錯誤したので、メモも兼ねてまとめます。

Unity Recorder(失敗)

Unity Recorderの最新版

Unity RegistryにあるUnity RecorderではGameViewやCameraなどを様々な形式で録画できるようになっていて非常に便利そうに見えるのですが、なぜか背景を透過しようとすると途端に失敗してしまいます。

ググっても動いている人と動いてない人がいて原因を特定できず、Recorderのダウングレードなど色々な方法を試しましたが結局この方法は断念しました。

透過で画面をスクショする

そこで当初の透過画像を連結する方法を思いついたので、まずはUnity Recorderを使わずに透過画像をスクショする方法を探しました。結果、このスクリプトが非常によくできており、スクリプト先頭のusageの通りに実行したらあっさりと動作しました。
https://gist.github.com/bitbutter/302da1c840b7c93bc789

なお、画像のファイル名の通し番号が連番ではなく1つ飛ばしで出力されて少し管理しづらかったので、2で割って無理やり連番にしました。

ImageMagickでスクショをSpriteSheetに変換

あとは出力された画像たちをSpriteSheetに変換するだけですが、ImageMagickを使えば一発です。この記事のコマンドがズバリです。
https://qiita.com/sa-k0/items/87cfc13fc6068406b89e

montage *.png -tile 7x10 -geometry 512x512 -background transparent hogehoge.png

-tileや-geometryのパラメータを必要とする画像数やサイズに合わせてうまく調整しましょう。

Unityで取り込み

SpriteSheetが完成したら、あとは任意の方法で画像を表示するだけです。3DのParticleと比べたら、比較的簡単に2Dプロジェクトで使えるでしょう。

メジャーな方法としてはAnimationClipを使用してアニメーションするようですが、個人的にはスクリプトで切り替える方が手軽で好みです。
https://qiita.com/ELIXIR/items/e58fa48680e0ebbde0ea
https://unity-yuji.xyz/simple-sprite-animation-script/

まとめ

以上が、3DのParticleを2DのSpriteSheetに無理やり変換して表示する方法です。3Dのまま表示できるに越したことはないですが、プロジェクト設定も多様化してきているしアセットを直す手間も削減したいので、たまには役立つかもしれません。

Discussion