和Keyle一起學ShaderForge – Custom Blinn-Phong


sf_logo

 

用了兩天時間精心准備了這篇教程,快來和Keyle一起學ShaderForge,玩起來~

 

本章目錄

1.什么是Blinn-Phong光照模型

2.如何使用自定義光照模型

        2.1 ShaderForge內置光照模型

3.如何使用自定義類似光照實現Blinn-Phong的光照模型

4.完善我們的自定義Shader

        4.1 我們先模擬出一個Diffuse的算法
        4.2合並(通過加法),得到我們想要的結果
        4.3 優化 去除重復聲明的變量 如同Normal Direction
        4.4添加法線貼圖
        4.5添加Emission效果
        4.7 最終效果

 

 

1.什么是Blinn-Phong光照模型 ?

     要想知道Blinn-Phong是什么,首先你要知道什么是Phong光照模型,Phong光照模型是真實圖形學中提出的第一個有影響的光照明模型,該模型只考慮物體對直接光照的反射作用,認為環境光是常量,沒有考慮物體之間相互的反射光,物體間的反射光只用環境光表示。Phong光照模型屬於簡單光照模型,詳情移步到 百科 ,而 Blinn-Phong 則是對Phong的加強,具體代碼我就不復制上來了,為了提高我們的業務水准可以用一句話來概括與改進之后的區別:

 

Blinn-Phong模型與Phong模型的區別是,把dot(V,R)換成了dot(N,H),其中H為半角向量,位於法線N和光線L的角平分線方向。

 

Blinn-Phong模型可表示為:

Ispecular = Ks*Is* pow(( dot(N,H), n )

其中H = (L + V) / | L+V |,計算H比計算反射向量R更快速。

 

左圖是 Phong光照模型 的典型例子 ,右圖是采用 Blinn-Phong 光照模型 的例子

22172819-202cb4692a6d4162a39d6ae5226218c3         31173743-8f8494efb7f843d6b0b480f4f17a60e2

 

 

2.如何使用自定義光照模型

      選中屬性欄 Lighting Unlit/Custom更改后的效果如下 Diffuse將被禁用,此時將不受環境光照影響

imageimage

 

 

2.1 ShaderForge內置光照模型

image

Amblient Light 環境光

顧名思義,不受任何角度,位置關系影響,直接取環境光的色值着色

image

 

 

Half Direction

輸出的顏色與入射光線反射出的角度有關

image

 

 

Light Attenuation

光衰減, 混合 Light Attenuation和LightColor效果,美極了

image

 

 

Light Ccolor

輸出場景中光的顏色

image

 

 

Light Direction

表達的東西和Half Direction一樣,效果是Half Direction * 2,光源的角度變換影響很大,與光源相反方向直接就黑掉了,half Direction的時候還保留色值/2的的顏色

image

 

 

Light Position

忽略光源按照Y軸旋轉角度的變化,反之如果是X軸忽略光源X軸變化,XYZ為都不忽略,默認Z軸發生Rotation時不會有變化(圍繞自身轉Z軸不動,沒有發生位移)

image

效果如下

image

 

 

3.如何使用自定義類似光照實現Blinn-Phong的光照模型

      我們根據如下公式,在ShaderForge中做出如下實現

Ispecular = Ks*Is* pow(( dot(N,H), n )

 

image

 

核心實現效果如下

 

image

 

 

4.完善我們的自定義Shader

      4.1 我們先模擬出一個Diffuse的算法

 

image

 

      4.2合並(通過加法),得到我們想要的結果

image

       

      4.3 優化 去除重復聲明的變量 如同Normal Direction

image

 

       4.4添加法線貼圖

添加法線貼圖並在Normal Dir的復選框內打勾,讓貼圖與法線貼圖對齊,官方翻譯如下

The Perturbed checkbox makes it use the normals after having applied the "Normal" input of the main node, such as a normal map.

 

右鍵查看大圖吧~ 現在你會發現所有的圖形都被扭曲了,很形象(包括了法線信息)

image

 

 

     4.5添加Emission效果

在上一篇文章中我已經闡述過Emission節點的效果,我們用上上文講到的知識,使用Amblient Light(環境光),來模擬在環境光照下的效果

首先我希望你現在已經知道了環境光是個什么樣的概念(不要辜負我寫那么長的說明),純粹的光,那么我們要做成貼圖反光的效果則要將環境光與貼圖混合

 

image

 

 

      4.7 最終效果

 

image

 

如果你覺得效果不明顯,那我們換一張圖吧

 

image

 

 

大功告成!舉起我們的手,讓那些還在苦苦手寫Shader的人們顫抖吧~


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM