
簡介
ShaderGraph使您可以直觀地構建著色器。你可以在圖形網絡中創建和連接節點,而不再需要寫code。Shader Graphs 在Unity屬於著色器選擇的另一個選項,這包含了PBR通道渲染的選項以及可製成動畫以及多種酷炫的光影表現。在這個充滿Node製作著色器的3D渲染軟體中,Unity的Shader Graph實在很值得花時間去學習。
創建ShaderGraph
ShaderGraph是基於可編程渲染管線,我們要使用shaderGraph也就需要設置SRP。
首先創建Renderpipeline。在SRP中,unity幫我們封裝了幾種渲染管線:
– LWRP
– HDRP
– Custom(自定義渲染管線)

可編程渲染管線Scriptable Render Pipeline (SRP)
SRP批次處理器,加速CPU渲染
SPR批處理器(SRP batcher)是一種Unity引擎的新型內循環程式,它可在不影響GPU效能的情況下加速CPU渲染速度,它替代了傳統的SRP渲染程式。
使用PBR的遊戲常常會有很多物件和網格,物件上不同的材質共享著相同的Shader和Shader keyword。SRP批次處理器幫使用PBR的遊戲提供了很大的CPU速度提升。
SRP批次處理器能夠與高品質渲染管線HDRP和LWRP結合使用。

在開始創作精美的場景前,我們需要注意二個重要事項:
1、Lit Master Node僅在HDRP中運行。
2、LWRP中沒有用於此節點的高級著色選項。如果你只需要PBR表面的基本輸入,建議繼續使用PBR主節點。

選擇“Custom”會在Master Node上創建新輸入,從而為用戶提供完整的“鏡面遮擋”控制。 例如,將零插入此輸入將禁用所有反射。 主節點上的設置菜單加載了AF選項。 其中選擇要在Shader Graph中使用的advanced material type,以及設置其他有用的surface,例如surface是不透明還是透明。
創建HDRP場景的最快速方法是在Unity啟動器或Unity Hub上選擇High-Definition RP

這邊以HDRP Lit Shader為例
使用HDRP項目時,你可以點擊菜單Create > Shader > Lit Graph創建全新的HD Lit著色器視圖。成功創建後,你會看見一些新的輸入選項。
如果你在HDRP中使用過HD Lit材質,這些選項大致上差不多。如果你沒有使用過該材質,BentNormal和CoatMask對你來說或許是陌生的概念。

屬性
在製作著色器時,可能很難為理想效果獲取正確輸入值。出於這個原因,同時也為了之後使用預製件和預設置進行自定義,我們需要使用屬性。在Shader Graph左邊的欄位有一個空白黑盒子,點選+號即可加入屬性,依照我們需要的屬性再與Lit master連結。

屬性允許我們編譯著色器後修改著色器的數值。創建屬性,請點擊圖中的+號。
屬性共有六種類型:
1、Vectors (1-4):數值的字符串,帶有Vector1的選項。
2、Color:帶有顏色選擇器的RGB值和可選的HDR版本。
3、Texture 2D(和Texture2D Array):2D材質輸入端。
4、Texture 3D:3D材質輸入端。
5、Cubemap:只能使用Cubemap材質的屬性
6、Boolean:控制關或開的選項。等同於0或1。
輕鬆製作帶有特效的材質案例
Step1. Create Lit Graph 設定你喜好的顏色,並在空白處新增Fresnel Effect , 在這邊可以在Power的節點上調整光暈大小,並把結點連結到Emission通道,這時候就可以發現剛剛新建的材質產生了光暈,這時候同時在assets裡面建立新材質並選擇剛剛建立好的Shader。


在這邊補充一下Fresnel的意思,Fresnel Effect的中文翻譯通常是「菲涅爾效應」,在自然界屬於物理反射的原理。
Fresnel Effect是一種光線反射與材質之間的現象,在真實世界中相當常見。 這種效應通常發生在透明、而且表面光滑的物體上,通常以~玻璃、水,等等最常見到。
當光線射入這些材質時,有一部分的光線會在表面反射帶來「鏡像」。而一部分光線穿透過這個透明物體讓我們看到「後面的東西」。

文獻參考:
https://zh.wikipedia.org/wiki/%E8%8F%B2%E6%B6%85%E8%80%B3%E6%96%B9%E7%A8%8B
Step2. 當Fresnel Effect的NODE想要改變顏色怎麼辦呢?這時候我們則需要再新增一個Mutiply即可以連結這兩個NODE達到想要改變光暈顏色的目的。
這邊的Mutiply 中文直翻的意思就是:相乘

Step 3. 如果變成Material後要調整Fresnel Color還要進入Shader Graph是很耗時間的事情,這時候屬性就很重要! 我們在Fresnel Color的Node點選右鍵並點選” Convert to Property” ,即可變成屬性。



Step 3. 這時候我想要加入控制Fresnel Effect的閃爍, 先新增一個time 同時新增一個Remap,將second time通道連結Remap的input ,就可以看到閃爍的樣子了

Step 4. 將Remap 的 output 連結到新增的 Multiply 的B通道,並將原本連結Fresnel的output 連結到A通道,最後將最主要的Multiply連結原本的Emission,最後我們就可以發現帶有特效的材質呈現。

Step 5. 記得在Shader Graph裡面所製作的材質都需要先在裡面按下save Asset,如此一來在Asset裡的材質球才會跟著變更。

Step 6. 最後在Game 模式裡面play看看效果, 最後我們完成了一個簡單又帶有特效效果的材質了!

小結:Shader Graph 的世界就像一個一個小插件所堆砌而成的,如果你需要的材質是很複雜且帶有許多特定PBR或是特效通道的,便需要更多的NODE去串連而成,本篇所解說的是非常Basic且容易上手的範例,之後會再深入探討更多酷炫特效的Shader Grpah。
以下為Shader Graph 裡面所有的NODE詳解