2022年6月3日 星期五

色碼表

到底色碼表裡的值,是sRGB(Gamma)還是raw(Linear)呢?

raw(Linear) ➡️ 本色
sRGB(Gamma) ➡️ 提亮後的本色

為什麼要提亮
因為銀幕輸出時存在著衰減

就是1個後面出了包
前面只好跟著上補丁的概念
欸?

前置作業

打開色碼表

好 就決定是你了

在網路上找一張照片

好 就決定是你了

Texture 101

建立測試環境


建1個Texture Node,連到FragmentOutput Node

你知道的 一般的照片都是sRGB(Gamma)
我們讓它回到raw(Linear)

raw(弱)

因為raw用銀幕輸出會變暗
所以我們再把FragmentOutput做Gamma
亮回來

開始測試

#EBD3E8
aka rgb(234, 209, 231)
我們為它拉一個Color3 Node


整個實驗的邏輯是這樣的

假如 input 是 Raw(弱)
做了gamma (增強)
output 就會正常


現在我們讓
#EBD3E8
aka rgb(234, 209, 231)
變成input

可以發現output比原圖亮

這代表 ➡️
#EBD3E8
aka rgb(234, 209, 231)
不是Raw
是「提亮」過的數值

變換回raw後,output的結果就正常了

提亮 VS 本色

#EBD3E8
在sRGB界 aka rgb(234, 209, 231)

rgb(234, 209, 231)

但是在raw界
它是 rgb(211, 165, 205)

右邊是經螢幕衰減後看到的raw 

rgb(211, 165, 205)

🧐

加碼

PBRMetallicRoughness Node的結果
應該是Linear space

小畫家是你餵什麼給它
它就直接用銀幕輸出什麼
(HTML5也是這樣)

但一般遊戲都會在Linear 計算光照結果
最後輸出時再做提亮
(WebGL也需要這樣)

結語

色碼表的值是sRGB