皆さんこんにちは、キャイDです。
前回に続いてエフェクト作成ツール「Pixel FX Designer」の使い方について解説していきたいと思います！
前回の記事はこちらから
Pixel FX Designerの使い方 ~基本編①~
1.COLOR
particleの色を変えてみましょう。
COLORのボタンをクリックします。
クリックすると以下のような編集画面へ切り替わります。
色を変えるためには以下の箇所を変更します。
Color欄の色のついたところをクリックしましょう。
Min…Lifeが半分になるまでの色
Death…Lifeがなくなるまでに変わる色
Alpha…透明度。0 ~ 1の値で変化します。
右の欄で色相を、左の欄で明度、彩度を変更して色を決めましょう。
色を決めたらパーティクルを生成してみましょう。
適宜調整を行いつつ決定するのがいいと思います。
■Outline
パーティクルには下図のようにアウトラインを付けることも可能です。
Outlineのボタンをクリックし、右箇所から色を選択します。
■Background
背景の色を変更することも可能です。
Backgroundを有効にし、色を選択しましょう。
■Palette
左のPaletteは色を限定することができ、パーティクルの雰囲気を変えることが可能です。
ここではPaletteをクリックし、GAMEBOYを選択しましょう。
使用される色が限定されました。
確かにGAMEBOYの雰囲気が出ていますね！
昔風のゲームを作成したい場合にGAMEBOYのPaletteは非常に活躍しそうです。
■Dithering
Ditheringの値は数値を変えることでパーティクルにジャギっとした感じを追加することが出来ます。
使用すると手間暇かけて作った感が増す気がきます。是非活用してみてください。
Colorの項目は以上になります。
2.EFFECTS
次はEFFECTSの項目を見ていきましょう。
EFFECTSをクリックし、下記の画面を表示させましょう。
CLS…有効にすると、舞フレーム毎にスクリーンを初期化する。
Sepia…有効にするとパーティクルがセピア調となる。
Chromatic Aberration…色彩収差の値。にじみ、像の流れ、歪みを付与します。
Blur Amount…ぼかし具合。
Glow…輝き具合。
■Black & White
有効にした場合は、以下のようになります。
お手軽にパーティクルを白黒にすることが出来ます。
■CLS
有効にした場合、常に毎フレームごとにスクリーンを初期化します。
デフォルトでは有効となっていて、Offにした場合は以下のようにパーティクルが残ります。
■Sepia
有効にした場合、パーティクルがセピア調で描画されます。
■Chromatic Aberration
色彩収差の値を付与します。にじみ、像の流れ、歪みを付与します。
■Blur Amount
パーティクルのぼかし具合を調整することが可能です。
■Glow
パーティクルの輝き具合を調整することが可能です。
宝石などのキラキラしたエフェクトに丁度良いかもしれないですね。
3.CUSTOM
次はCUSTOMの設定です。
CUSTOMをクリックし、設定画面を表示させましょう。
Amount…読み込んだ画像の生成位置の大きさ
Advanced パーティクルの描画表示の荒さに関する項目です
Scale…パーティクルの描画サイズを変更できます。
Canvas Width…描画するキャンバスそのものの横幅を変更できます。
Canvas Height…描画するキャンバスそのものの縦幅を変更できます。
Reference Image リファレンスとなる画像の設定です
Import Reference…読み込む画像を選択します
Scale…読み込んだリファレンス画像の大きさを変更します
Alpha…読み込んだリファレンス画像の透明度を変更できます。
Render…読み込んだリファレンス画像を最終的に出力するか選択できます。
Front読み込んだリファレンス画像を前面に表示するか指定できます。
■Custom Contour
パーティクルの生成位置を読み込んだ画像の輪郭に合わせることが可能です。
Load Imageから画像を読み込み、Amountで大きさを指定しましょう。
画像の輪郭に合わせるため、透明度の保存されている画像を選びましょう。
例では以下の円形の画像を使用しています。
■Advanced
パーティクルの描画サイズに関する項目です。
Scaleは描画サイズの倍率を表しています。
1では等倍で、デフォルトだと400 * 400pxとなっています。
数値を大きくするほど粗くすることが可能です。ドット絵感を出すにはここの値が重要になってきます。
Canvasの値は、横、縦それぞれの大きさを変更することが出来ます。
■Reference Image
参考となる画像についての項目です。
Import Referenceから画像を読み込みましょう。
Scaleで参考画像の大きさ、Alphaで透明度が変更できます。
Renderにチェックを入れると書き出し時に出力することも可能です。
Frontにチェックを入れた場合はパーティクルより前面に参考画像を表示することが出来ます。
4.RENDER
最後に、画像の書き出しについての項目について解説していきます。
RENDERボタンをクリックし、設定画面を表示しましょう。
RENDER…パーティクルのレンダリングを開始します。
Manual Rendering …チェックを入れるとマウス移動操作でのパーティクルレンダリングが可能になります。
Render Configuration
Frames…書き出し枚数の総数になります
Pre-Frames…指定した数のフレームに到達するまでレンダリングを行わないようにする設定です
Post-Frames…指定のフレーム数までレンダリングを止めないようにする設定得です
Loop Animation…ループアニメーションに適した設定自動で変更してくれます
Render FPS…レンダリングするパーティクルの速さになります。
■RENDER
RENDERボタンをクリックすることでレンダリングが開始されます。
このボタンを押さないと画像の書き出しが行われないので、最後はこのボタンをしっかりと押しておきましょう。
右側のSPRITE RENDER欄に表示されたパーティクルが最終的に描画された結果になります。
基本的に一度RENDERを押した後は再生しっぱなしなので、止めたい場合は上部にある停止ボタンをクリックしましょう。
■Render Configuration
レンダリングに関する設定項目です。
Frames…書き出しするフレーム数です。
この値に応じてパーティクルの生成時間が変動します。
Pre-Frames…指定した数のフレームに到達するまでレンダリングを行わないように出来ます。パーティクルの生成し始めが必要ではない場合に値を上げて調整します。
Post-Frames…指定のフレーム数までレンダリングを止めないようにする設定です。ループではなく、消滅時などのパーティクルも欲しい場合はこの値を上げておきましょう。
Loop Animation…ループアニメーションに適した設定自動で変更してくれます。あくまで自動での設定なので、様子をみて微調整しましょう。
レンダリングに関する様子は動画の方がわかりやすいかと思いますので、是非こちらの方参照してみてください。
5.EXPORT
レンダリングが完了したら、画像の書き出しを行いましょう。
上部メニューからEXPORTを選択します。
.PNG
.png形式として一枚の画像として書き出されます。
Unityなどのゲームエンジン上でスライスして扱う形式となります。
.GIF
.gif画像として書き出しされます。
.JSON
.json形式で書き出しが行われます。
.PNG(by frames)
.png形式として連番で画像が書き出しされます。
1フレームに対して1枚の画像で書き出しされるため、書き出す際はフォルダを指定おきましょう。
任意の形式を選び、書き出しが行われればエフェクトの作成終了となります。
終わりに
以上で、「Pixel FX Designer」の基本的な使い方に関する解説は終了です。
是非オリジナルのエフェクトを作成し、ゲームのクオリティを上げましょう！
基本編は終わりですがこのツールにはまだまだたくさんの機能が存在しています。次回以降は応用編とし、更にエフェクト作成に役立つ使い方を解説していきたいと思います！
ここまで見て頂きありがとうございました、
それではまた次回！
