Blending

Unity3D/Shader 2022. 2. 23. 21:13
반응형

Blending이란?

 

두 픽셀을 병합하는 프로세스입니다

 

렌더링 파이프라인에서 이 프로세스를 Blending이라고 합니다.

 

Z 테스트 또는 Depth 테스트는 개체의 각 조각 또는 픽셀에 대해 수행됩니다.

 

블렌딩은 Z 테스트 완료 후 진행되는 선택 단계입니다.

 

https://docs.unity3d.com/kr/530/Manual/SL-Blend.html

픽셀 셰이더가 픽셀의 색상과 알파를 계산했습니다.

 

왜 블랜딩은 선택적인가?

 

왜냐하면 보통 우리는 투명 또는 반투명 픽셀이 다른 픽셀 앞에 올 때만 블렌딩을 수행해야 하기 때문입니다.

 

그래서 만약 원뿔이 다른 원뿔 앞에 온다면요

 

뒤에 있는 원뿔에 overlap 될것입니다.

 

이때 두 메시의 픽셀을 섞을 필요가 없습니다.

 

하지만 불투명 오브젝트 앞에 투명하거나 반투명한 픽셀이 온다면 

 

이런경우 우리는 픽셀들을 병합해야 합니다 

 

이런이유에서 블랜딩은 선택적입니다 

 

투명하거나 반투명한 픽셀이 다른 픽셀 앞에 오게 된다면 

 

우리는 그것들을 결합시킬 방법이 필요합니다.

 

그리고 결과를 2D 화면의 픽셀에 표시합니다.

 

결국 모든 픽셀이 2D 화면에 그려집니다.

 

그리고 이러한 과정이 반투명하거나 투명한 오브젝트들의 픽셀들을 병합 해야 하는 이유 입니다 

 

포토샵에서 다른 레이어를 병합하는 방식과 유사합니다.

 

각 fragment들의 Z distance를가지고 오브젝트들을 정렬 할수 있습니다 

 

픽셀 셰이더로부터 받은 알파 값과 컬러는 버퍼로 들어가는것을 테스트 합니다 

 

그렇지 않으면 픽셀에 대한 이러한 값이 거부됩니다.

 

렌더링 파이프라인이 이 불투명 원뿔의 모든 픽셀에 대해 z 테스트와 픽셀 셰이더를 방금 실행했다고 가정합니다.

 

이 원뿔은 불투명하므로 이 원뿔의 픽셀에서 블렌딩을 수행할 필요가 없습니다.

 

왜냐하면 이 원뿔은 가장 먼 거리에 있기 때문입니다.

 

또한 이 메시의 모든 픽셀에 대한 z-테스트도 통과합니다.

 

픽셀 셰이더가 제공하는 색상과 알파값은 컬러 버퍼로 이동합니다.

 

그리고 컬러 버퍼로 전송되면 화면에 그려진 모양으로 처리할 것입니다.

 

이제 이 반투명 카드의 차례가 왔습니다

 

알파값이 1보다 작거나 0보다 크기 때문에 반투명이라고 부릅니다 

 

이 카드들의 픽셀들은 투명합니다 

 

우리는 이 메쉬의 픽셀에 블렌딩을 수행할 것입니다. 

 

그래서 우리는 두 조각을 결합하여 블렌딩을 수행할 것입니다. 

 

픽셀 쉐이더에 의해 주어진 메쉬 카드의 알파 값이 필요합니다.


 

Blending 

 

1. 픽셀쉐이더로 부터 받은 메쉬의 픽셀에 해당하는 알파값 

2. 컬러 버퍼 안에 있는 알파값 

3. 픽셀 쉐이더에서 받은 메쉬의 픽셀의 컬러 값 

4. 컬러 버퍼에 있는 컬러 값 

 


따라서 이 두 알파 값을 혼합해야 하며 이 두 값을 기반으로 픽셀 셰이더가 제공하는 

메시 카드의 픽셀 값을 병합하고 이 두 값을 기반으로 픽셀 셰이더가 제공하는 

메시 카드의 픽셀 값을 병합합니다.

 

그리고 색 값은 특정 픽셀의 색 버퍼에 저장됩니다.

 

 

따라서 혼합을 두 개의 매개변수를 갖는 함수로 생각하십시오.

 

이런 알파 값들을 factor라 부릅니다 

 

Blending (srcFactor, dstFactor) 
{
 	color value - pixel shader 
 	color value - color buffer 
 	return merged color
}

 

이 두 파라미터를 기반으로 픽셀 셰이더로 계산된 색상 값에 따라 작동합니다.

 

셰이더에서 블렌딩을 수행하거나 활성화하기 위해 Blend라는 키워드를 사용합니다.

 

그리고 'Blend' 키워드를 사용하여 이 함수의 매개 변수인 두 가지 요소를 제공합니다.

 

1. source factor 

2. destination factor 

 

source는 픽셀 셰이더가 실행되는 메시를 의미하는 렌더 파이프라인이 작동하는 메시를 나타냅니다.

 

source는 반투명 메쉬 카드인데 destination은 무엇인가?

 

destination은 컬러 버퍼 안에 있는 값을 의미 합니다

 

쉐이더에서 blending을 활성화 하려면 Blend 키워드가 필요 합니다 

 

Blend 키워드는 두 개의 매개 변수를 사용합니다.

 

source factor와 destination factor 입니다 

 

이 두 가지 사이에서 작업이 수행되며, 

이 작업은 혼합 작업을 나타내는 다른 키워드인 'BlendOp'에 의해 정의됩니다.

 

BlendOp를 사용하지 않으면 기본값은 + (Add) 입니다 

 

BlendOp를 사용하면 다른 동작을 하게 할수 있습니다

예를 들어 nagative, Min, Max와 같은것들을요

 

Blending은 우리에게 병합된 픽세을 줍니다 

두 개의 서로 다른 픽셀을 병합한 후 결과 픽셀입니다.

 

혼합 방정식이므로 이 두 괄호는 서로 다른 요인에 대한 것이며 

기본값은 + 'BlendOp'에 의해 정의된 연산입니다. 

 

source 색에 source 계수를 곱하고 

 

destination 색에 destination 계수를 곱한뒤 

 

더해주면 merged pixel이 나옵니다 

 

Merged Pixel = [source color * source factor] + [destination color * destination factor]

 

이게 블렌딩의 완벽한 방정식입니다.

 

source 가 렌더 파이프라인이 작동하는 mesh를 나타낸다는 것을 이해했습니다.

 

또는 알파와 컬러를 픽셀 셰이더로 받은 메시도 있습니다.

 

그리고 destination은 색상 버퍼에 저장되는 값입니다.

 

source color는 픽셀 쉐이더에서 계산된 컬러입니다 

 

source factor 는 0에서 1 사이값입니다 

 

destination color 는 컬러 버퍼 안에 있는 컬러 입니다 

 

destination factor는 0에서 1 사이 값입니다 

 

유니티 공식 문서를 보면 키워드를 통해 

 

addition, subtraction, reverse subtraction, min, max등 다양한 blend operation을 사용할수 있습니다 

 

https://docs.unity3d.com/kr/530/Manual/SL-Blend.html

Dx11전용 옵션들도 보이네요 

 

 

그리고 blend factor들도 보입니다 

이것들은 source factor와 destination factor들입니다

https://docs.unity3d.com/kr/530/Manual/SL-Blend.html

이러한 키워드를 사용해 destination또는 source factor로 사용할수 있습니다 

 

 

다음 예제에서는 source alpha와 one minus source alpha에 대한 키워드를 살펴 볼겁니다 

 

 

스크린의 두 픽셀을 계산한다고 생각해봅시다 

 

멀리 있는것은 빨간색 불투명 카드 입니다 

 

픽셀 값은 (1, 0, 0, 1)이겠죠?

 

이 것은 (R, G, B, A)에 해당 합니다 

 

왜냐하면 불투명의 알파는 1일테니깐요 

 

다른 카드는 빨간색 불투명 카드 앞에 있습니다 

 

이 카드는 반은 불투명이고 반은 투명입니다 

 

투명 픽셀을 가지고 있기 때문에 우리는 쉐이더에서 블랜딩을 할수 있습니다 

 

위쪽에 있는 픽셀들은 불투명 합니다 

 

이것은 1, 1, 1, 1을 의미 합니다 (RGBA)

 

그리고 밑에 있는 픽셀은 검정색 투명한 픽셀입니다 

 

값은 0, 0, 0, 0 이겠죠 

 

RGBA값이 모두 0입니다 

 

빨간색 불투명 카드가 젤 먼저 랜더 될것입니다 

 

알파와 컬러 값은 컬러 버퍼에 저장됩니다 

 

그후 앞에 있는 카드의 불투명한 반쪽과 투명한 반쪽이 렌더 됩니다 

 

우리가 작업하고 있는 것은 흰색 불투명 픽셀입니다.

 

혼합의 결과는 소스 색상에 소스 계수를 곱한 다음 대상 색상을 대상 계수에 곱한 값이 됩니다.

 

우리가 이 계산을 끝내기 전에, 이 계산의 결과가 무엇이 되어야 하는지를 시각화해봅시다 

 

만약 우리가 빨간 벽 앞에 창문이 있고 창문의 절반이 하얀 나무로 덮여 있다면요.

 

창문을 통해 무엇이 보일까요?

 

우리는 이 창문의 투명한 부분을 통해 빨간색 벽을 볼 수 있을 것입니다.

 

이것이 블랜딩된 결과 입니다 

 

Merged Pixel = [srcColor x srcFactor] + [dstColor x dstFactor]

 

source는 렌더 파이프라인이 작동하는 mesh를 나타내며 이는 흰색 픽셀을 의미합니다.

 

그러므로 소스컬러는 (1,1,1,1)입니다 

 

source factor는 SrcAlpha키워드를 사용해봅시다 

이것은 source의 알파값을 의미 합니다 

 

= [ (1,1,1,1) x 1 ] + 

 

그리고 destination color를 더해 줍니다 

 

이 픽셀의 색상 버퍼에 있는 색상은 빨간색 불투명 색상입니다.

 

그리고 destination factor에 다른 키워드인 OneMinusSrcAlpha를 사용합니다 

 

첫 번째 소스 팩터로 

우리는 작업 중인 메시의 픽셀 셰이더에 의해 주어진 알파 값을 의미하는 'srcAlpha'를 사용했습니다.

 

키워드인 'OneMinusSrcAlpha'는 1 빼기 소스 알파를 나타냅니다.

 

즉, 조각 셰이더 또는 픽셀 셰이더가 제공하는 모든 값을 의미합니다.

 

우리는 1에서 그 값을 뺄 것입니다.

 

= [ (1,1,1,1) x 1 ] + [ (1,0,0,1) x (1-1) ]

 

그리고 계산 합니다 

 

= [ (1, 1, 1, 1) + [ (0, 0, 0, 0) ]

 

 = [ (1, 1, 1, 1) ]

 

이것은 흰색 불투명 픽셀입니다 

 

우리가 예상 했듯이 말입니다 

 


다음으로 두번째 픽셀을 살펴 봅시다 

 

source color는 아래쪽에 있는 검정색 투명 색상입니다 

 

= [ (0, 0, 0, 0) x SrcAlpha ] + [  ?

 

어떤 색인가요? 컬러버퍼에 있는 특정 픽셀은 어떤 색이죠?

 

창문을 통해 바라본 빨간색 벽돌 입니다 

 

즉 빨간색 불투명 색상이죠 

 

RGBA로 나타내면 (1, 0, 0, 1)입니다 

 

= [ (0, 0, 0, 0) x SrcAlpha ] + [  (1, 0, 0, 1) x OneMinusSrcAlpha ]

 

 

계산해 봅시다 

 

 = [ (0, 0, 0, 0) x 0 ] + [ (1, 0, 0, 1) x (1 - 0) ]

 

= [ (0, 0, 0, 0) ] + [ (1, 0, 0, 1) x 1 ]

 

 = [ (0, 0, 0, 0) ] + [ (1, 0, 0, 1) ]

 

 = [ (1, 0, 0, 1) ]

 

놀랍게도 우리가 예상한 빨간색 불투명 색상이 나왔습니다

 

그래서 그것이 혼합 방정식입니다.

 

그리고 이것이 유니티 셰이더에서 블렌딩이 수행되는 방식입니다.

반응형

'Unity3D > Shader' 카테고리의 다른 글

normal map  (0) 2022.02.10
GrabPass  (0) 2021.11.30
alpha:fade  (0) 2021.11.30
TRANSFORM_TEX  (0) 2021.11.29
SV_POSITION과 POSITION 의 차이?  (0) 2021.11.29
: