배경이 투명해야 하기 때문에 셰이더 Graph Settings를 [Transparent]로 바꾼다. [Blending Mode] - [Additive]는 배경과 덧셈이 되면서 더 밝아지게 된다. [Render Face]는 양면 렌더링을 위해 [Both]로 설정한다. V 방향으로만 [Time]에 [Negate] 음수를 곱하여 위로 올라가게 [Add] 노드로 더했고 [Sample Texture 2D]로 텍스쳐에 적용한다. 고정할 텍스쳐와 움직일 텍스쳐의 rgb와 알파를 각각 곱해서 Fragment에 전달한다. 책의 예제에서는 (0.5, 0.5, 0.5)의 값을 갖는 회색 텍스쳐를 UV 값을 [Split]하여 각 U, V 값에 [Add]하는 부분이 있는데, 정확히 U, V 값이 0.5씩 이동되지 않는 결과가 ..

[Lerp] 노드는 A와 B를 T 만큼 선형보간하여 나타나게 하는 노드이다. T의 값에 따라 A만 보여지기도 하고 B만 보여지기도 하며 둘의 반반이 겹쳐 보일 수도 있다. 위와 같이 [Saturation] 노드로 흑백으로 바꾼 이미지와 원본 이미지를 [Lerp] 계산하여 T에는 Float 슬라이드를 만들어서 흑백과 컬러로 서서히 바뀌게도 할 수 있다. 근데 여기서 만약 알파를 가지고 있는 이미지라면, 해당 알파 값을 [Lerp] 노드의 T 자리에 넣으면 어떻게 되는지 알아보자. 책의 예제에 잘 나와있다. 알파 값은 흰 부분이 1, 검은 부분이 0이므로 그 값에 따라 결과물이 나올 것이다. 1이면 B의 텍스쳐가, 0이면 A의 텍스쳐가 나오기 때문에 동그라미와 문자는 1이므로 B의 텍스쳐가 표현된 것을 볼 ..

흑백을 만들기 위해서 고려해야 하는 부분 흑백(Grayscale)이란, 컬러가 없는 상태로써 RGB의 숫자가 동일한 상태이다. RGB로 된 각 채널은 하나씩 따로 출력하면 각각 흑백이다. 흑백이어도 밝기는 유지해야 한다. R 하나만 켜진 상태라면 3개의 서브픽셀 중 1개만 켜진 것이니 밝기가 1/3이 된다. R 채널, G 채널, B 채널이 각각 흑백이기 때문에 [Add] 노드로 더해도 흑백이 유지된다. 하지만 밝기는 점점 밝아지는 것을 볼 수 있다. 이후 [Divide] 노드로 3을 나눈 것을 볼 수 있다. 하지만 RGB의 밝기(휘도)는 정도가 달라서 우리 눈에 밝게 인식되는 강도가 다르다. 각각을 흑백으로 표현했을 때 초록색이 가장 밝게 보이고 그 다음이 빨강, 파랑 순서이다. 이 비율은 (0.2126..

[Unity] URP 셰이더 Gamma와 sRGB sRGB 사진 텍스쳐는 sRGB를 켜고 Normal Map이나 Ambient Occlusion 텍스쳐 등 셰이더 계산에 사용되는 데이터 텍스쳐는 sRGB를 끈다. 감마 보정 채널당 8비트의 색 표현도 결국 밴딩 현상이 일어나지만 아주 lightbakery.tistory.com 이전 글에서도 Gamma에 대한 설명을 적었지만 더 쉽고 추가적 해석이 있어서 적어본다. 위의 사진을 보면 [Vector 3], [Color] 두 노드 각각 중간 값인 0.5의 회색을 나타낸다. 이 둘을 [Add] 노드로 더해보면 "0.5 + 0.5 = 1"의 값이 나오므로 흰색이 나올 것임을 예상할 수 있다. 하지만 아래쪽 [Color] 노드로 더한 값은 흰색이 나오지 않고 밝은 ..

위의 셰이더 그래프를 보면 [Vector 3]에서 출발한 값이 [Split]을 통해 나뉘어졌고, 다시 [Combine] 노드를 지나면서 합쳐진 것을 볼 수 있다. [Split]과 [Combine] 사이 노드를 이어줄 때, R에 있던 1 값을 G로 보내면서 한 번 꼬아진 것을 볼 수 있다. 결과적으로 색은 (0, 1, 0)인 초록색이 나오게 되고 이것을 [Swizzle]이라고 부른다. [Swizzle] 노드의 Mask 부분에 원하는 조합을 써 놓으면 되는데, 순서에 따라서 결과값이 달라진다. x에 있는 값 "1" 하나만 적용되어 출력이 (1, 1, 1)로 흰색이 나왔다. xy를 적어서 (1, 1, 0)이 되어 노란색이 출력되었다. xyz를 적어서 바로 위와 마찬가지로 (1, 1, 0)이 되어 노란색이 출력..

[Unity] URP 셰이더 그래프 기초 개념 ShaderGraph URP에서 생성할 수 있는 셰이더 그래프 종류를 볼 수 있다. Lit Shader Graph: 빛을 받고 그림자를 만들 수 있는 셰이더 Unlit Shader Graph: 빛과 무관하게 텍스쳐 그대로 보여주는 셰이더 셰이더 lightbakery.tistory.com 이전 기초 개념에서 정리하지 않았던 내용을 정리하는 페이지이다. Graph Inspector 창 1. Float Override Property Declaration - Shader Declaration : Property 속성을 재선언한다. Global : 셰이더 Property를 글로벌에서 제어한다. 코딩으로 이 Property 이름을 사용하는 모든 셰이더를 한 번에 제어..