0.相変わらず結果から見る
ピクセル化して消えたり現れたりするね。シェーダー? pic.twitter.com/LkKHija8Ev
— 雙山 (@DrunkSouzan) December 24, 2023
1.事前準備
いきなりだけど、新しいマテリアルを作って、このテクスチャー表面の座標を全部手に入れる、単位化する
((0,0,0)はモデルの中心)
UEのノードは以下の通り
2.ピクセル化する
今のアニメーションは先の単位座標全部8倍で乗算して、Ceil算法で計算して
8に割る(ここの8は自由に変わって大丈夫です)
上手く行けばこんな感じになれる
でも今だと横行と立行は別々な感じで完全にピクセル化されてない
それの対策として
テクスチャーのX座標、Y座標をZ座標に掛け算する
横軸のピクセル化と縦軸のピクセル化を組みたつ
こうするとピクセル化は成功した
ここにPerlin乱数図のUVに導入すると
UEノードは以下の通り
3.消える
同じ原理でもう一つ真っ白(テクスチャーなし)のテクスチャーを処理して、但しXY座標とZ座標の掛け算をしない。
このテクスチャーを変数αと足し算する
但しαはー1から1まで変化する(三角関数)
先できた消えるテクスチャーと最初のピクセル化したテクスチャーを引き算すると
真っ黒(0以下)と真っ黒じゃない(0以上)の部分gはできた。
これでもうすでにピクセル化して消えるエフェクトはある程度見えるですね。
UEのノード↑
4.発光する
随分良く見えてると思う人もいると思うけど、消えるならちょっと消えている部分は発光するとか、がある方がもっといいよね
そのために!先のテクスチャーを3の階乗を求め、絶対値を計算する
前と同じく赤の部分は自由に設定できる(大きいほど発光する部分が小さくなる)
そして、1ーこの絶対値を算出したら只今消えている部分だけが黒(0以下)ではない
ここで、先の算出したテクスチャーを好きな色に染めると発光の感じがある。
UEのノード↓
5.最後に
黒(0以下)の部分を全部透明化して、発光部分と足し算したら、最後の結果ができた。
テクスチャーや法線マッピングが欲しい場合は見える部分(0以上)に足し算すればいい
以上
UEのマテリアルの変数機能を使えばマテリアル実例とかで色んなモデルやテクスチャーも実現できるよ!