今回はアセットの紹介をしていきます。
紹介するのはAdvanced Dissolveです。
オブジェクトのディゾルブエフェクト(消滅エフェクト)を実装できるアセットです。
有料アセットですが、頻繁に50%オフセールが行われています。
去年のUniteTokyo2018で電脳少女シロ様にも紹介いただいたアセットです。
2021/3/30追記
最新バージョンではこの記事の通りに動作させることはできません。
アップデート記事を投稿予定です。
2021/4/28追記
アップデート記事を投稿しました。
※この記事にはGifが多く使われています。軽量化していますが読み込みまで時間がかかる恐れがあります。
どんなアセット？
これはオブジェクトやTextMeshProをディゾルブさせるアセットです。
ディゾルブとは融解を意味し、オブジェクトの消滅や出現を表現できます。
モバイルやVR、LWRPにも対応しています。
サンプルシーンの確認
DemoとExampleが用意されています。
Demo
Demoシーンは別途インポートする必要があります。
アセットストアのイメージでも登場しているシーンを確認できます。
ちなみにUIのCanvasの設定で画面上に全て表示されません。
Sample
こちらもマスクを使ったディゾルブシーンがたくさんあります。
クイックスタート
付属のドキュメントに従ってとりあえず動かしてみます。
シーンを新しく作りましょう。
単純なディゾルブ
単純なディゾルブエフェクトから入ります。
スフィアの作成
CreateからSphereを作り、AdvancedDissolveShaderを使ったマテリアルを割り当てます。
この段階ではまだディゾルブエフェクトはでません。
マテリアルの作成
作るマテリアルはこんな感じ。シェーダーの種類はたくさんありますが、とりあえず今回は
VacuumShaders/Advanced Dissolve/Legacy Shaders/Bumped Diffuseを使います。
CutoutのSourceからCustom Mapを選択します。
Textureにはノイズの画像を設定します。
ノイズの画像は20種類ぐらいあるので好きなものを選びましょう。今回はD_1を使います。
これでディゾルブエフェクトがでます。
Mask/Dissolveのスライダーを動かすとシーンビューから確認できます。
テクスチャ、ブレンド、マッピングモードは複数あります。
また、RenderFaceオプションで、前面だけあるいは背面だけレンダリングといったこともできます。
デフォルトだと両面レンダリングです。
動的なマスクディゾルブ
Planeを使って動的なディゾルブエフェクトを使うことができます。
マテリアルの設定
MaskのTypeをPlaneに変更します。
この時、描画が変になりますが仕様です。問題ありません。
動的なマスクはマテリアルエディター内にパラメータを持ちません。(一部を除く)
そのため別のスクリプトから更新してあげる必要があります。
Planeの作成
Create/3D Object/PlaneからPlaneをシーンビューに配置します。
真っ白いPlaneが出来上がりますが、少し見た目を整えます。
PlaneのMeshRendererからマテリアルを変更します。
アセットに付属しているMaskマテリアルを使いましょう。
Maskコンポーネント
シーン内に空のゲームオブジェクトを作成し、Controller_Mask_Planeコンポーネントをアタッチします。
このコンポーネントはTutorial_PlaneMask_Controllerに似ていますが、
複数のマテリアルを最大4つのマスクオブジェクトで同時に更新できます。
コンポーネントのMaterialsには、最初に作ったディゾルブ用にマテリアルを、
Plane1には先ほど作ったPlaneをそれぞれ紐づけます。
これで完成です。
Planeの位置よってディゾルブされているのがわかります。
ポストプロセスでもっと見た目をきれいに
PostProcessingStakを使ってディゾルブをきれいにします。
カメラの設定
カメラにPostProcessingStakc v2を設定します。
詳しくはこちら
マテリアルの設定
EdgeからShapeをSmoothに、Intensityを2にします。
Shapeは好みでいいとおもいます。Intensityは値が大きければ大きいほど輝いて見えます。
これで完成です。
Colorから色を変えることもできます。
Invertでマスクを反転
重要な機能としてInvertがあります。これはマスク処理を反転させる機能です。
マスクの外側にいるとディゾルブする状態とマスクの内側にいるとディゾルブする状態の2つを作ることができます。
設定は非常に簡単です。
MaskコンポーネントのInvertにチェックを入れるだけです。
これによりマテリアルのInvertにも自動的にチェックが入ります
(というよりもマテリアルのチェックを手動で切り替えられなくなります)
試しに先ほど作ったディゾルブマテリアルを複製し、Maskコンポーネントももう一つ追加してInvertにチェックを入れます。
これでマスクの外側内側でディゾルブする対象を分けることができます。
これにより2つの世界を切り替えるといった表現も作れます。
実演 ユニティちゃんをディゾルブ
ここから実践です。
ユニティちゃんをディゾルブしてみます。
アセットストアから「SDこはくちゃんズモデル」をインポートします。
マテリアルの設定
こはくちゃんズのマテリアルを編集します。
編集前に複製してバックアップをとっておくといいかもしれません。
基本的な設定はクイックスタートのマテリアルと一緒です。
シェーダーをVacuumShaders/Advanced Dissolve/Legacy Shaders/Bumped Diffuseに変えます。
この時、マテリアル全体が少し灰色っぽくなることがあります。
これはSurfaceInputのMainColorを真っ白にすることで解決します。
コンポーネントの設定
こちらもクイックスタートと同様にします。
あとはシーン内にユニティちゃんのプレハブを置くだけ。
これで完成です。とても簡単。
ユニティちゃんの消滅/出現エフェクトを作ることができました。
他の使い道
キャラクターモデルだけでなく、ステージの3Dモデルにも当然使えます。
2つの世界
こちら、「保健室+冬服」と「教室+夏服」の2つの世界をディゾルブで切り替えています。
保健室にはトーコちゃんが、教室にはマリエちゃんがいます。
InvertマテリアルとInvertではないマテリアルを作り、それぞれを同じPlaneでディゾルブさせています。
教室と保健室のアセットはUTUTUYAさんのものを使わせていただいています。
少し前のほぼ半額セールの時に購入しました。
アセットによっては細かい設定が必要
物によってはマテリアルのシェーダーを差し替えるだけではうまくいかない場合もあります。
例えばThe Phantom Knowladgeのユニティちゃんのように元のマテリアルが少し複雑だと、
色がやテクスチャの設定が抜け落ちることがあります。↓の場合髪の色が白になっている。
こうなると手動でいろいろと設定しなければなりません。
描画を切る分軽くなるのか
ディゾルブされると画面上には描画されません。
オクルージョンカリングのように、軽くなっているように感じますが、
実はドローコールは普通に呼ばれています。プロファイラーを見ても軽くなっていません。
なのでディゾルブしたオブジェクトは、使わないのであればSetActiveなどで非アクティブ化したほうがいいでしょう。
まとめ
Advanced Dissolveを使うとノンコーディングでディゾルブエフェクトをつけることができる。
設定方法はマテリアルのシェーダーを差し替えるだけ。(ケースバイケース)
ただしドローコール自体は呼ばれている。
今回はPlaneのみでしたが、BoxやSphereなど特定のメッシュに合わせてディゾルブをかけることができます。
他のアセットの紹介記事はこちら↓
他間違っている箇所、わかりにくい所がありましたらコメントにお願いします。
© Unity Technologies Japan/UCL
この記事に含まれている画像はユニティちゃんライセンス条項の元に提供されています
