tara.log

シェーダー備忘録

【Shader Forge】斬撃エフェクト

f:id:aitarai:20210624102548p:plain


f:id:aitarai:20210624102433g:plain
斬撃エフェクトを作成しました。
前回の「【Shader Forge】斬撃エフェクト(軌跡のみ) - tara.log」 に、エフェクトを追加したものです。
(エフェクト自体はたったの0.2秒ほどで終わってしまうのに、時間にして丸3日かけて作成しました。エフェクトとはそういうもの…)

テーマは「煙を纏う剣閃」です。
気持ちよさ、重さ、華麗な尾を引く表現… の欲張りセットを目指して作成しました。色んな斬撃エフェクトを参考にして、比較的納得のいく出来になったかなぁと思います。
エフェクトを実際の振りより1フレーム遅らせることでやや重みが出せます。

エフェクト階層

f:id:aitarai:20210624102733p:plain
おおよそ名前の通りです。斬撃部分と、ヒット部分でエフェクトの塊を分けて作成しています。シェーダーは合計で5つ作成しました。シェーダーの内約は、

  • 斬撃の軌跡(前回の記事)
  • 白の剣閃
  • 青い剣閃(フローマップで歪めた尾)
  • 振った後の煙(これもフローマップ)
  • ディストーション


Custom Data のカーブでアニメーションスピードや光るタイミングを制御している都合上、それぞれで専用のシェーダーを作らざるを得ませんでした。が、今になってみると、マルチマップ周りを含めてシンプルにプロパティ化できれば、全部同じ仕組みで作れそうな気がします。

  • プロパティ 固定値
    • テクスチャ1 RGB
    • テクスチャ2 フローマップ
    • color over life time
    • smooth step の幅(max)
    • flow map power(フローマップの強さ)
    • Trail length (剣閃の長さ add )
    • Trail strength (剣閃の強さ multiply )
  • Custom Data
    • アニメーション速度のカーブ(U、Vスクロール)
    • emission intensity のカーブ
    • smooth step の閾値のカーブ(min)

汎用シェーダーを作るならこのあたりでしょうか。
マルチマップのRGB要素別に、Rは剣閃、Gはサブ剣閃、のように指定してやれば、誰でも使うことができそうです。


ヒット部分のエフェクトは、全部既存の Particle System です。
剣閃のポリゴンは Maya で作成しましたが、今度は Houdini でプレハブ化して作ってみたい。

スローモーション

f:id:aitarai:20210624102437g:plain


f:id:aitarai:20210624103157p:plain
f:id:aitarai:20210624102702p:plain
止めても美しい。
見る角度によって、ディストーションがかかったりかからなかったりするのは、ソートを設定していないからです。

テクスチャ

f:id:aitarai:20210624102825p:plain
マルチマップテクスチャを2枚使用しました。



前回の記事
aitarai.hateblo.jp

【Shader Forge】斬撃エフェクト(軌跡のみ)

f:id:aitarai:20210618201627g:plain

Unity のアセットストアで「X-WeaponTrail」 という 斬撃エディターを購入して、軌跡をシェーダーで作ってみました。
剣のボーンに、start と End というロケーターを配置するだけで動く優れものでした。ほぁ、スクリプトを見たが訳分からないでした。すごい。

X-WeaponTrail | Particles/Effects | Unity Asset Store
ストアはこちら


シェーダーは独自に設定できますが、
モデルを伸び縮みさせて軌跡を描くため、縮む時が汚くなりやすいです。



f:id:aitarai:20210618202133g:plain
試しにテクスチャを◎にしてみました。
勢いよく剣を振る時にモデルが伸びて、失速と同時に縮みます。


スローモーション

f:id:aitarai:20210618201659g:plain
工夫点は、ただ1枚のテクスチャを伸び縮みさせるだけだとどうしてもチープになるため、テクスチャ自体は、逆スクロールしてその場に残っているように見せつつ、モデルのお尻にはフェードアウトの処理を入れています。
そうして、ゴリ押しで煙の残糸を表現しました。

また、縮む時に汚くならないように、モデルのお尻の方のUVを引き伸ばすこともやっています。


ただ、プロジェクトで使う時なんかはこういう処理をせずに、元のスクリプトでなんとかしたいですね…。
モデルが縮む処理も、縮まずにモデルが伸びきったままグラデーションを均一にかけて、アルファクランチで消せると、尾を引いたまま綺麗に消せそうです(書けないのでできないけど)。


使用したテクスチャ

f:id:aitarai:20210618204650p:plain
端を落としたよくあるパーリンノイズ。
ループ感が気になる場合は、端を落とす処理をシェーダー内でやってしまって、UVの横スクロールすればよりランダム感が出そうです。

ノード全体

f:id:aitarai:20210618204338p:plain

現在は装飾エフェクトを制作中ですが、結構時間がかかりそう… のんびり派手に作ります。

【Shader Forge】地形:雪シェーダー

f:id:aitarai:20210610192333g:plain
初めてのレンダーテクスチャ。
移動で描画するパーティクルを、レンダーテクスチャで使用しています。
キャラに追従させれば、キャラが通った後がえぐれるような雪の表現になる。が、めんどくさかったのでこれだけ。

これを応用すれば、キャラに追従するようなシェーダーの表現が色々作れるため夢が広がりんぐ。

f:id:aitarai:20210610192357p:plain
ノード全体。
ノイズからパーティクルの描画を引いた値を、オフセットして地形にするだけです。

メモ
・レンダーテクスチャを作成。
・パーティクルを作成。パーティクルレイヤーを入れる。
・カメラを作成。カリングをパーティクルレイヤーにする。平行投影にする。
・カメラにレンダーテクスチャをアタッチする。
・シェーダーでレンダーテクスチャを読み込んでごにょごにょする。


https://www.youtube.com/watch?v=BpqPm8URw3Y&t=14s&ab_channel=DanielSantalla
チュートリアル

【Shader Forge】3Dヒットエフェクト

f:id:aitarai:20210609185225g:plain
ノイズによる頂点押し出しで作ったヒットエフェクトです。
押し出しに使用したノイズとは別に、
セラーノイズを組み合わせたノイズで ディゾルブ、色分けも行いましたが、いい感じになりました。


ヒットって、火や水と違って現実には無い概念なので、表現が難しいです…
スマブラとかはド派手な表現が多彩で参考になりますが、今回はシンプルに、かつ3Dで表現しました。

f:id:aitarai:20210609185251p:plain:w200f:id:aitarai:20210609185253p:plain:w200
静止画にしても美しいのがこだわりポイントです。
イメージはトゲトゲしく、はじける感じで…

エフェクトの構成

ソート順に
・グレア(小、中心部)
・グレア(大)
・はじける粒
・波紋(シェーダー)
・トゲトゲ(シェーダー)
となっています。

ノード全体(トゲトゲシェーダー)

f:id:aitarai:20210609190454p:plain

f:id:aitarai:20210609185301g:plain
トゲトゲシェーダーは、外に出した2つの数値を弄ることで、トゲの位置や数を調整することができます。本体を回転させるだけでランダム感は出るので、この数値は固定します。

【Shader Forge】ブレワイ煙エフェクト パーティクル付き

f:id:aitarai:20210609183831g:plain


前回の記事で紹介した「ブレワイ煙エフェクト」に
ブルームとその他パーティクルを追加しました。
ひとまず完成にしたいと思います。

aitarai.hateblo.jp

エフェクトの構成

ソート順に
・グレア
・火花パーティクル
・爆発
・煙
のシンプルな構成です。

グレアを一番上に置くことで、多少絵の色にばらつきがあっても馴染むようになります。鉄板です。

作成したテクスチャ

f:id:aitarai:20210609184457p:plain
マルチテクスチャの内訳は前回の記事参照。

ノード全体

左側中段ぐらいで、0~4の変数を、Floor で整数に直して、
タイリングしたテクスチャがランダムで選ばれるようにしています。

この時、Custom Data では 親パーティクルの変数を子供に継承させることができないため、爆発と煙を意図した組み合わせにするのが難しいです… 何かいい手はないものか… 今後の課題にします。



Unity の Particle System での初めてのエフェクト制作になりましたが、
NintendoWare が提供している エフェクト作成ツールと仕組みが似ており、結構触りやすかったです。

【Shader Forge】ブレワイ煙エフェクト

f:id:aitarai:20210521180437g:plain
Unity Particle System の Custom Data を使用して、
ブレワイ煙エフェクトの模写をしてみました。
パーティクルやポストエフェクトも追加する予定です。

f:id:aitarai:20210521180321p:plain
テクスチャはマルチマップのtga で、
赤:煙のベース
緑:煙のハイライト
青:火のアルファ
アルファ:煙のアルファ
となっています。


f:id:aitarai:20210521180331p:plain
Custom Data を初めて使ってみましたが、
カーブをシェーダーに渡したりと、やれることが格段に増えて、やっと学んだシェーダーが役に立っている…ような気がします。
グラフィックにおけるシェーダーは基礎のパイプラインをしっかり学ばないといけないですから…どこから手をつけていいのやら。

少なくとも、エフェクトの分野では知ってるだけできることが増えます。
カーブを何に使っているかすぐ忘れるので、メモは必須だと感じました。


f:id:aitarai:20210521180338p:plain
火の部分のシェーダー。

【Shader Forge】輪郭シェーダー

f:id:aitarai:20210430174514g:plain

f:id:aitarai:20210430174523g:plain

下がビューと法線の内積を白黒にしたカブトムシ。
上はその内積をさらにDDXYに導入したカブトムシです。

どちらも内積を元にしているので、何らかの理由で法線押し出しをしたくない際の方法となります。


f:id:aitarai:20210430174537j:plain
DDXYノードにつなぐだけでは、カメラの距離が離れた時に輪郭の濃さが増してしまうため、
前回の記事で紹介した、オフセットの log ノードを逆に組み替えることで軽減されました。

鉛筆風にしてみた

f:id:aitarai:20210430175812p:plain
エッジを補足すると、線がかすれていい感じになります。


▼ 前回の記事
aitarai.hateblo.jp