從頭學ShaderGraph 6:深度冰材質

遊資網發表於2020-04-13
冰材質,帶有深度縫隙。三天更兩篇,高產似母豬。還有,走過路過幫我來unity connect收藏點贊吧。

https://connect.unity.com/p/cong ... hen-du-bing-cai-zhi

原作者來自於youtube,案例貼圖被壓縮過,如需高清貼圖可在原網址下載。

深度冰材質

先來張動圖

從頭學ShaderGraph 6:深度冰材質

能看到在轉動的時候,白色裂縫處彷彿有模型插在裡面一樣,有深度。

有看過我HDRP節點的朋友應該知道,這就是視差parallax,在HDRP中有現成節點。

不過這次就是來點刺激的,純用基礎節點連出來,也方便一部分朋友理解parallax的原理。下面是全部節點截圖。

從頭學ShaderGraph 6:深度冰材質

不要被一堆線嚇到,仔細看就是一條迴圈,分解過程一步步來。

基礎材質

從頭學ShaderGraph 6:深度冰材質

沒什麼能說的,顏色和法線,加了個UV控制。

做一個裂縫

我們需要將貼圖,根據視角,將模型表面,向內部壓。

做過法線的人都知道,NormalMap是切線空間法線,這在我之前的文章裡也有寫。所以我們需要壓的方向便是:切線空間。

所以我們需要的是:

  • 根據視角=View Direction
  • 模型表面方向壓=Tangent的View Direction


本來要轉換一下矩陣,但View Direction自帶有轉換功能,所以直接用。

從頭學ShaderGraph 6:深度冰材質

將UV減去第一層裂縫的厚度,即我們需要的新UV,自己建個引數ParallaxOffset,用來控制厚度。(這裡雖然用的是add,但parallax是負數,所以還是減法。)

從頭學ShaderGraph 6:深度冰材質

可以看到已經出來第二層。

從頭學ShaderGraph 6:深度冰材質

為了方便,將計算部分直接框選右鍵,打組。取名叫Ice Parallax,迴圈的時候不至於一堆節點。

做一堆裂縫

由於這次的冰凹槽,是黑白圖片疊加,所以能把視差偏移後的圖片直接混合。

正經的視差是偏移UV,最終輸出UV給貼圖用。而不是直接輸出貼圖,好孩子不要學。

先從2個裂縫開始。

從頭學ShaderGraph 6:深度冰材質

2層比1層要更深,顏色要更淡。

左邊Add負責深度,右邊Lerp負責更淡。

記得將貼圖換成Texture 2D Asset,畢竟你不想定義多次圖片。

重複這個迴圈20次,lerp從上到下是:0,0.5,1,1.5...1。也就是分成了20段。

ParallaxOffset調到合適的數值。

上色

將裂縫黑白圖與原圖混合,混合模式為Overlay。

從頭學ShaderGraph 6:深度冰材質

下面是Overlay公式,a就是Opacity。

我加了一個Pow2.2,應該有人熟悉這個數值,linear轉gamma(到底用2.2還是2.5呢,效果差不多)

效果如圖,無pow的白色戛然而止,過渡不明顯,有pow的就還不錯。

從頭學ShaderGraph 6:深度冰材質
最後來張大圖

從頭學ShaderGraph 6:深度冰材質

都看到這裡了,點贊收藏吧。

下面是我的檔案

連結:

檔案分享https://share.weiyun.com/5tfG4Rr

密碼:qtdxrd

使用方法:找個HDRP或著URP(LWRP),拖進去。我的資料夾下有預製體。

我的環境:Unity2019.3.0f1 HDRP 7.1.6 ShaderGraph 7.1.6

下面是我的artstation地址:https://www.artstation.com/luteli

相關閱讀:
從頭學ShaderGraph :UV與基礎材質
從頭學ShaderGraph:雪材質

從頭學ShaderGraph :護盾材質

作者:Lute Li
專欄地址:https://zhuanlan.zhihu.com/p/109549867

相關文章