![見出し画像](https://assets.st-note.com/production/uploads/images/122143339/rectangle_large_type_2_75c0b65250b0b13f0073aaa905923420.png?width=800)
パーティクルシステム パーフェクトガイド01 虹色の球を作る:前編
よおみんな。
稲妻の戦士 イレブザンダーだ。みんな元気か?
俺は日々、かっこよさとは何かってのを追求して、よりかっこいいヒーローになるために特訓中だ。
さて、かっこよさを演出するにあたってかなり重要になるもの、何だかわかるか?そう、エフェクトだ。
つまり、パーティクルシステムだな。
パーティクルシステムを制すれば、かっこよさを制したも同然!
ということで、このnoteで複数回に渡り、実際にパーティクルを組みながら色んなことを教えていこうと思う。これでみんなも、パーティクルマスターだ!
ぜひ実際にUnityを開いて、一緒に触ってみてくれ。
作業環境
Unity 2019.4.31f1
最終目標
このnoteで作っていくパーティクルの完成形は、これだ。
虹色に輝くエナジーオーブ!手のひらに乗せてもよし、身体を覆うように配置してもよし。こいつを一緒に作っていこう!
![](https://assets.st-note.com/production/uploads/images/119740352/picture_pc_2c19d5c3e8d23b0d2fb5071b2c0a7d20.gif?width=800)
![](https://assets.st-note.com/img/1698408420119-EHAvJC5IkA.png?width=800)
第一回では、素材選定・マテリアル作成と、外側のリング部分を作っていこうと思う。
![](https://assets.st-note.com/img/1698281016685-4xZWQ8M5Hd.png?width=800)
素材集め
パーティクルの完成度は、テクスチャの時点で7割は決まると言っても過言じゃない。
自分で作れるのがベストだが、そうはいかない人が大半だと思う。どこかで無料配布されている素材を持ってこよう。
今回は↓のサイトの素材を使わせていただくことにする。
このサイトから、この4つの素材をダウンロードしてこよう。
![](https://assets.st-note.com/img/1698117865425-gbEvmPrvUu.png)
これを、Unityに取り込んでいく。
画像取り込みとマテリアル作成
画像取り込み
Assetsタブに、さっきダウンロードした4つの画像をドラッグ&ドロップ。
すると…
![](https://assets.st-note.com/img/1698118185542-mPrOoJFTc8.png)
なんだか、透過素材が変な感じになる。
これを解消していこう。
まずはCtrlキーを押しながら4つの画像を順番にクリックし、選択する。
![](https://assets.st-note.com/img/1698374252951-2bnHKxpiQf.png)
その状態で、「Alpha Is Transparency」のチェックボックスを押す。
その後、Applyで変更を確定。すると…
![](https://assets.st-note.com/img/1698374338249-fTeapdCgRK.png)
透過素材がきちんと見えるようになった。
![](https://assets.st-note.com/img/1698118514314-a5BS3R2rxE.png)
ではこの画像を使い、次はマテリアルを作っていく。
マテリアル作成
Assetタブの上で右クリックし、Create→Material。
![](https://assets.st-note.com/img/1698118765972-mVWagu8nlY.png)
その後、作成できたマテリアルのシェーダーを変更。
particles→Standard Unit
![](https://assets.st-note.com/img/1698119009609-2ucPV48vxM.png)
![](https://assets.st-note.com/img/1698119029751-OPXRe6bf4J.png)
そうしたら、Mapsの下の四角に、ダウンロードしてきた画像をドラッグ&ドロップ。
![](https://assets.st-note.com/production/uploads/images/119744254/picture_pc_272825043dc8d8e1ed398ffc6ed48344.gif?width=800)
その後、Building Optionsを両方ともAddtiveに。
![](https://assets.st-note.com/img/1698120258914-CGdQBwSXpn.png)
そしたら、次はEmissionにチェックを入れ、メインカラーをR:0 G:0 B:0に
発光カラーをR:125 G:125 B:125に。
これを、残りの画像分繰り返し、4つのマテリアルを作ろう。
![](https://assets.st-note.com/img/1698120469219-nGEnFi6Z7Y.png)
なお、今回はRendering ModeとColor ModeどちらもAddtiveにしたが、これは今回作るものに合わせた設定。他の設定の組み合わせ次第で様々な表現ができるため、試してみるのもいいだろう。
マテリアルも用意できたところで、いよいよパーティクル本体の作成に取り掛かる。
パーティクル作成:外側のリングを作る
システム作成
まずはパーティクルシステムをHierarchyに作る。
Hierarchyタブ上で右クリック。Effects→Particle Systemを選択。
![](https://assets.st-note.com/img/1698120904629-H0bVQUFZwF.png)
![](https://assets.st-note.com/production/uploads/images/119745188/picture_pc_cedc66a8f373699313f580db8240a8b8.gif?width=800)
まずは、このパーティクルの粒子を変更してみよう。
放出される粒子を変更
particle SystemのInspectorをスクロールし下の方を見る。
そして、一番下にあるRendererタブを開く。
その中にあるMaterialに、さっき作ったマテリアルの中の、リング状のものをドラック&ドロップする。
![](https://assets.st-note.com/img/1698121306784-E6m3EnDeuN.png)
![](https://assets.st-note.com/production/uploads/images/119745941/picture_pc_38f05dc74e43f634ffd42138715d61b6.gif?width=800)
これを整えて外側のリングにしていこう。
大きさと寿命とスピードと頻度
Particle SystemのInspectorを設定していく。
Start Lifetime:1.3
Start Size:5
Start Speed:0
![](https://assets.st-note.com/img/1698122796712-wfuCGWNjMk.png)
![](https://assets.st-note.com/production/uploads/images/119746337/picture_pc_756e0067cdbca8bad90025a295caced1.gif?width=800)
Emissionタブを開き、Rate over Timeを5に。
これはパーティクルの出現頻度を決める設定で、0になると生成されなくなる。
![](https://assets.st-note.com/img/1698124880902-WpVQCWXVd4.png)
放出方法
次に、Shapeタブを開き、設定を以下のようにする。
Shape:Sphere
Radius:0(自動で0.0001になる)
Shapeは、パーティクルの放出方法を決める設定。
Shape:Sphereは、パーティクルが球形に放出される設定。
Radiusは、放出位置の大きさを決める。今回はこの値を0にし、一点から出現するようにした。
![](https://assets.st-note.com/img/1698374872945-aQfs2afbLo.png)
![](https://assets.st-note.com/img/1698122267522-8BYxCT4Wcb.png)
すると、全てのパーティクルが一点に集まって動かなくなっていると思う。
![](https://assets.st-note.com/production/uploads/images/119746669/picture_pc_ec21dcd1b04d410b6bea2857f5ae3db9.gif?width=800)
粒子の角度の調整、値のランダム化
再び上の方に戻り、今度はStart Rotationという項目をいじる。
これはパーティクル出現時の角度を調整するものなのだが、このまま値をいじっても、ただ全てのパーティクルが、同じように変わるだけ。
全てのパーティクルにランダムに角度を与えていこうと思う。
Start Rotationの値を入れるボックスの右にある▼を押し、メニューを表示、その中から、Random Betweem Two Constantsを選択。
![](https://assets.st-note.com/img/1698122939415-JGAy1qDgW7.png)
![](https://assets.st-note.com/img/1698123006572-i5rZIzsJbl.png)
これは、「設定した2つの値の間の中でランダムな数値を与える」という設定。
片方には0、もう片方には360を入れてみよう。
![](https://assets.st-note.com/production/uploads/images/119749621/picture_pc_a7fcd5c40a0db37b584f01845d5313d0.gif?width=800)
この設定により、パーティクルの角度が0~360度の間でランダムに生成されるようになった。
じわっと現れ、じわっと消える
次に、Collar over Lifetimeを有効化し、開く。
![](https://assets.st-note.com/img/1698375935572-fShz72wZir.png)
Colorと書いてある右にある、白い横長の四角をクリック。すると、このような画面が現れる。
![](https://assets.st-note.com/img/1698123979533-6EuXcdj6H2.png)
Color over Lifetimeはその名の通り、パーティクルの寿命に応じて色を変えるという設定。上の矢印が透明度、下の矢印は色を指定する。
今回は、透明度を変えていこうと思う。
↓の画像の赤丸のあたりをクリックし、透明度を決める矢印を1つ増やす。
その後、右端と左端の矢印を選択し、下にあるAlphaのスライダーを0にする。
![](https://assets.st-note.com/img/1698124553445-g3Nrp1zoq4.png)
![](https://assets.st-note.com/img/1698124627223-59yXteRL2X.png)
これによって、「透明な状態から出現し、透明になりながら消える」というパーティクルになった。
一時的に出現頻度を下げたものが下のGIF。この設定の効果がよくわかると思う。
これを応用すれば、「色が変わりながら消えていくパーティクル」なんかも作成可能だ。
例:出現時はオレンジ、消える際は黒色に変わっていく炎のパーティクルなど
![](https://assets.st-note.com/production/uploads/images/119749986/picture_pc_50a162541650193a342d9778edd3166e.gif?width=800)
![](https://assets.st-note.com/production/uploads/images/119750119/picture_pc_0e6c84b5badd749df0d5bc83af64864e.gif?width=800)
拡大しながら現れる
次に、Size over Lifetimeを有効化する。
![](https://assets.st-note.com/img/1698376016669-uOFIICdcds.png)
すると、こうなる。
![](https://assets.st-note.com/production/uploads/images/119750573/picture_pc_bc6cc0a09f77ff8ec70ec3d168065d57.gif?width=800)
Size over Lifetimeはその名の通り、パーティクルの寿命に応じてサイズを変更するという設定。
初期設定が「最小から元の大きさに戻る」という設定のため、こんなことになった。
この設定を変えていこう。
Sizeの右にあるグラフをクリックすると、下にそのグラフが大きく表示される。これが、大きさの推移を表している。
![](https://assets.st-note.com/img/1698125922819-hALr2tO4NK.png)
これを、下の画像のように変更する。
やり方は、グラフの左端の赤い丸をつかんで、上に動かすだけ。
遠目から見るとまっすぐに見えるが、左側に傾いている。
![](https://assets.st-note.com/img/1698125986049-6YDc1kfJqr.png)
すると、こうなる。
![](https://assets.st-note.com/production/uploads/images/119750883/picture_pc_ccf2cf324b3510f9bb3386173ca4f5ba.gif?width=800)
これを応用すると、逆に「小さくなりながら消えるパーティクル」なんかも作成することが出来る。
回転を与える
次に、Rotation over Lifetimeを有効化する。
![](https://assets.st-note.com/img/1698376069963-G6wW3cbVse.png)
![](https://assets.st-note.com/production/uploads/images/119751143/picture_pc_67e2c15ba5b211b57b3413f6ac19e12b.gif?width=800)
この設定も文字通り、パーティクルの寿命に応じて角度を変更するというもの。初期値は45なので、すべてのパーティクルが、「1.3秒で45度傾く」という同じ動きをする。
これをランダム化し、いい感じにする。やり方はStart Rotaionの時と同じ。
値を入れるボックスの右にある▼を押し、メニューを表示、その中から、Random Betweem Two Constantsを選択。
一方には10を、もう一方には-10を入れよう。
![](https://assets.st-note.com/img/1698126496791-AzAo9sfREa.png)
![](https://assets.st-note.com/production/uploads/images/119751512/picture_pc_dea1c906aed27cf0b8ae275b4a3517a5.gif?width=800)
ランダムな色で出現させる
ここまで来たら、この外側のリング最後の仕上げ。色を変えていく。
Inspectorの上のほうに戻り、Start Colorの右側の▼をクリック。
メニューの一番下のRandom Colorをクリック。
![](https://assets.st-note.com/img/1698126736502-X736t574su.png)
その後、Start Colorの右にある、白い横長の四角をクリック。すると、このような画面が現れる。
![](https://assets.st-note.com/img/1698126857780-z0fP3M2LGn.png)
今度は透明度ではなく色を変更したいので、下側の矢印を増やす。
下の画像の赤丸のあたりをクリック。
その後、矢印を選択し、Colorの部分で色を変えていく。
![](https://assets.st-note.com/img/1698126936570-MsyoCM0lOS.png)
![](https://assets.st-note.com/img/1698126993518-7UUFprEKiz.png)
そうすると、こうなる。
![](https://assets.st-note.com/production/uploads/images/119752096/picture_pc_fd10b01163a8df922bab3c765db5de7b.gif?width=800)
重なっているので、効果が分かりづらいかもしれない。Start Speedを少し入れてみたものが↓になる。
![](https://assets.st-note.com/production/uploads/images/119919257/picture_pc_21a8eda43481df1a255f0c2eba53e18c.gif?width=800)
パーティクル1つ1つが、完全ランダムな別の色になっているのが分かると思う。
おわり
さて、みんなのUnityにも、虹色に光り輝くリングが出来たと思う。
第一回はこれでおわり!かなり色々な設定に詳しくなれたんじゃないか?
記事を読んでいて「これが出来るなら、あんなことも出来るな!」と、色々なパーティクル演出を思いついた人も多いと思う。パーティクルマスターに近づいた証拠だ!
それじゃあ、また次回会おうぜ!
この記事が気に入ったらサポートをしてみませんか?