shader(37)
-
[Unity] URP 셰이더 Vertex Color와 응용
버텍스 컬러는 기본적으로 출력이 되지 않기 때문에 별도의 Package를 다운 받아 작업한다. Package Manager에서 Poly Brush를 다운 받고 Poly Bursh Window로 기본 Plane에 Vertex 색을 칠할 수 있다. 셰이더에서 미리 [Vertex Color] 노드를 연결해 놓았기 때문에 실시간으로 볼 수 있었고, 연결하지 않으면 브러쉬로 칠해도 아무 일도 일어나지 않은 것처럼 보인다. 특정 텍스쳐와 더하거나 곱하면 효과를 나타낼 수 있는데, 잘 이용하면 라이트맵 베이크를 할 수 없는 상황에서 Ambient Occlusion처럼 이용하거나 저렴한 라이트맵처럼 이용할 수도 있다고 한다. 버텍스 컬러는 버텍스가 기본적으로 가지고 있는 값이므로 저렴하게 이용할 수 있어서 파티클, 이..
2023.07.12 -
[Unity] URP 셰이더 Time 노드로 움직이는 불 만들기
배경이 투명해야 하기 때문에 셰이더 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씩 이동되지 않는 결과가 ..
2023.07.12 -
[Unity] URP 셰이더 Lerp 노드 응용
[Lerp] 노드는 A와 B를 T 만큼 선형보간하여 나타나게 하는 노드이다. T의 값에 따라 A만 보여지기도 하고 B만 보여지기도 하며 둘의 반반이 겹쳐 보일 수도 있다. 위와 같이 [Saturation] 노드로 흑백으로 바꾼 이미지와 원본 이미지를 [Lerp] 계산하여 T에는 Float 슬라이드를 만들어서 흑백과 컬러로 서서히 바뀌게도 할 수 있다. 근데 여기서 만약 알파를 가지고 있는 이미지라면, 해당 알파 값을 [Lerp] 노드의 T 자리에 넣으면 어떻게 되는지 알아보자. 책의 예제에 잘 나와있다. 알파 값은 흰 부분이 1, 검은 부분이 0이므로 그 값에 따라 결과물이 나올 것이다. 1이면 B의 텍스쳐가, 0이면 A의 텍스쳐가 나오기 때문에 동그라미와 문자는 1이므로 B의 텍스쳐가 표현된 것을 볼 ..
2023.07.12 -
[Unity] URP 셰이더 흑백 만들기 (Saturation)
흑백을 만들기 위해서 고려해야 하는 부분 흑백(Grayscale)이란, 컬러가 없는 상태로써 RGB의 숫자가 동일한 상태이다. RGB로 된 각 채널은 하나씩 따로 출력하면 각각 흑백이다. 흑백이어도 밝기는 유지해야 한다. R 하나만 켜진 상태라면 3개의 서브픽셀 중 1개만 켜진 것이니 밝기가 1/3이 된다. R 채널, G 채널, B 채널이 각각 흑백이기 때문에 [Add] 노드로 더해도 흑백이 유지된다. 하지만 밝기는 점점 밝아지는 것을 볼 수 있다. 이후 [Divide] 노드로 3을 나눈 것을 볼 수 있다. 하지만 RGB의 밝기(휘도)는 정도가 달라서 우리 눈에 밝게 인식되는 강도가 다르다. 각각을 흑백으로 표현했을 때 초록색이 가장 밝게 보이고 그 다음이 빨강, 파랑 순서이다. 이 비율은 (0.2126..
2023.07.11 -
[Unity] URP 셰이더 Gamma Correction
[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] 노드로 더한 값은 흰색이 나오지 않고 밝은 ..
2023.07.11 -
[Unity] URP 셰이더 그래프 Combine, Swizzle 노드
위의 셰이더 그래프를 보면 [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)이 되어 노란색이 출력..
2023.07.10