Raspberlyのブログ

Raspberlyのブログ

Unityネタをメインとした技術系ブログです。にゃんこ大戦争や日常なども。そろそろブログタイトル決めたい

【アセット紹介】Advanced Dissolveでディゾルブエフェクトを作る 2【Unity】

今回はアセットの紹介をしていきます。
紹介するのはAdvanced Dissolve
オブジェクトのディゾルブエフェクト(消滅エフェクト)を実装できるアセットです。

f:id:Raspberly:20210427221909p:plain

 

過去に同アセットの紹介記事を投稿しています。この記事はそのアップデート記事です。

raspberly.hateblo.jp

アセットのアップデートによりいろいろ変化したので書き直しました。
一応前の記事は残したままにしておきます。

f:id:Raspberly:20210428033256p:plain

 

お得なセール情報 (終了しました)

現在アセットストアではUnity春のアセット大セールが開催中!
500以上のアセットが50%OFF! さらに日替わりで限定アセットが70%OFF!
今回紹介する「Advanced Dissolve」もセール対象アセットです。
詳細とアセットの一覧はこちらのバナーからどうぞ

f:id:Raspberly:20210423215510p:plain

「Unity春のアセット大セール」は、日本時間の2021年4月12日pm16:00に始まりました。なお、このセールは2021年5月1日pm15:59に終了いたします。 500を超える最も人気のあるアセットが50%オフになるだけでなく、その中から毎日1つづつのアセットが日替わりで24時間限定で70%オフになります。

 

どんなアセット?

オブジェクトやTextMeshProをディゾルブさせるアセットです。
ディゾルブとは融解を意味し、オブジェクトの消滅や出現を表現できます。
モバイルやVR、URP、HDRPに対応しています。

f:id:Raspberly:20210428023714g:plain

 

 

 

 

開発環境

Unity2020.3.0f1

Advanced Dissolve ver2021.2

 

 

 

インポートの確認

アセットインポート完了時はこんな感じです。
ビルトイン、URP、HDRP用のunitypackageがあります。

f:id:Raspberly:20210426222020p:plain

プロジェクトに合わせたものをインポートしましょう。
この記事ではBuilt-inをインポートします。

デモシーンの確認

Amazing Assets/Advanced Dissolve/Example Sceneにデモシーンがあります。
事前にさわっておくとイメージがつかみやすいかもしれませんね。

f:id:Raspberly:20210427004802g:plain

f:id:Raspberly:20210427004833g:plain

f:id:Raspberly:20210427004859g:plain

f:id:Raspberly:20210427005027g:plain

f:id:Raspberly:20210427005147g:plain

 

 

 

 

 

クイックスタート

付属のドキュメントに従って動かしてみます。
詳しい手順やパラメータについてはドキュメントを参照してください。

単純なディゾル

スフィアの作成

Sphereを作り、この後作るシェーダーをMesh Rendererに割り当てます。

f:id:Raspberly:20210427023527p:plain

マテリアルの作成

新しくマテリアルを作成します。
シェーダーは「Amazing Assets/Advanced Dissolve」です。

f:id:Raspberly:20210427005652p:plain

いくつか種類がありますが、今回は「Amazing Assets/Advanced Dissolve/Standard/Metallic」を使用します。

カットアウトの設定

パラメータから、Advanced DissolveのStateをEnabledに変更します。

f:id:Raspberly:20210427005809p:plain


Cutoutのオプションから、StandardのSourceをNoneからCustom Mapに変更。
Mapは付属のノイズテクスチャを割り当てます。(Cutout Map 1とか)
この状態でClipスライダーを動かすとディゾルブがされます。これが基本的なディゾルブの設定です。

f:id:Raspberly:20210427015641g:plain


カットアウトの色

EdgeパラメーターのBase SourceをNoneからCutout Standardに変えると、カットアウト時のエッジの色を設定できます。

f:id:Raspberly:20210427015708g:plain

2つのテクスチャマップ

さきほどテクスチャマップを1つ設定しましたが、これは2つ設定できます。
CutoutのSourceを「Two Custom Maps」に変更。Map#2に2つめのテクスチャを設定します。

f:id:Raspberly:20210427020150p:plain

組み合わせ次第でさまざまなカットアウトが作り出せますね。(1+19、2+16、1+17)

f:id:Raspberly:20210427023435g:plain

 

ジオメトリックカットアウト(Plane)

ジオメトリックカットアウトはジオメトリックな形状にディゾルブさせる機能です。
Planeオブジェクトを使ってみます。

オブジェクトの用意

AdvancedDissolveGeometricCutoutController」がアタッチされたオブジェクトがシーンに必要です。
このコンポーネントが計算を行います。

f:id:Raspberly:20210427025941p:plain

空のゲームオブジェクトを配置し、アタッチしておきましょう。
同時にPlaneも作成しておきます。PlaneのMesh Rendererは切っておきます。(ディゾルブが見やすいように)

AdvancedDissolveGeometricCutoutControllerの設定

TypeをPlaneに変えて、Planeと先ほど作ったDissolveマテリアルをアサインします。

f:id:Raspberly:20210427223315p:plain

 

マテリアルの設定

CutoutのGeometric TypeをPlaneに変更。
EdgeのBase SourceをCutout Geometric(Allでもよい)に変更

f:id:Raspberly:20210427223516p:plain

これでPlaneを動かすとその位置によりSphereがディゾルブされます。

f:id:Raspberly:20210428003638g:plain

 

 

 

その他のパラメータ

いろいろパラメータがありますがその中でも面白いものを紹介

 

マテリアルのEdge BaseからIntensityの値を上げるとエッジが光ります。
ブルームのポストプロセスをつけるとわかりやすい。

f:id:Raspberly:20210427234717p:plain

f:id:Raspberly:20210428003657g:plain

 

CutoutのNoiseの値を増やすと、エッジに揺らぎを与えることができます。

f:id:Raspberly:20210427234850p:plain

f:id:Raspberly:20210428003756g:plain

 

マテリアルのMap ScrollからUVスクロールができます。

f:id:Raspberly:20210427235307p:plain

f:id:Raspberly:20210428003845g:plain

 

 

Invertから反転させたりも。
あらかじめ2つ用意して、片方だけ反転させると2つの世界を切り替えるような演出ができます。

f:id:Raspberly:20210428031139p:plain

f:id:Raspberly:20210428003919g:plain

 

 

 

実際に試してみる

ユニティちゃんのモデルをディゾルブしてみます。

 

マテリアルの編集とアサイ

ユニティちゃん用のマテリアルを編集します。
万一のため元のマテリアルは残しておきたいので、事前にマテリアルを複製しておきます。

シェーダーを「Amazing Assets/Advanced Dissolve/Unlit」に変更。
パラメータをこんな感じに設定。

f:id:Raspberly:20210428000643p:plain

 

なんか薄暗い場合はAlbedoのカラーを見直します

f:id:Raspberly:20210428000604p:plain

 

Controllerの設定

空のゲームオブジェクトを作成し「AdvancedDissolveGeometricCutoutControllerコンポーネントをアタッチ。
TypeをPlaneにして、Planeとユニティちゃんのマテリアルをアサインします。

f:id:Raspberly:20210428000759p:plain



これで完成です。Planeの位置に合わせてディゾルブしました。

f:id:Raspberly:20210428003959g:plain

 

 

 

実際に試してみる2

前回の記事と同じく教室と保健室を切り替えるデモを作ってみました。
設定などは上で紹介した通りです。

unity-chan.com

 

教室のマテリアルを同じように設定して、「AdvancedDissolveGeometricCutoutController」にアサインすれば完成です。

f:id:Raspberly:20210428021058p:plain

 

Planeに合わせて「ユニティちゃんがいる教室」と「ゆっこがいる保健室」が切り替わります。

youtu.be

 

 

 

まとめ

・Advanced Dissolveでディゾルブエフェクトを簡単に作成できる
・使い方はマテリアルのシェーダーを置き換えるだけ

 

 

 

他のアセットの紹介記事はこちら↓

raspberly.hateblo.jp

 

 

 

※本記事にはAssetStoreアフィリエイトリンクが含まれています。

他、間違っている箇所、わかりにくい所がありましたらコメントにお願いします。