# HLSL
Unity URP Shader Study (4) - HLSL : Toon Shader
대장장이 모델링, skybox, ground texture 등등 자료 출처 : 아티스트를 위한 유니티 URP 셰이더 입문 좌측에 있는 오브젝트를 우측처럼 만들어주는 쉐이더를 제작해봤다. 요약 코드에 사용된 기능?들은 다음과 같다. Lambert Light : 램버트 라이트 계산 Toon Shading : 툰 쉐이딩 (램버트 라이트 값을 smooth step값으로 조절하고, Ceil 함수 써서 명암 나눔) Ambient : 툰 쉐이딩에 환경광 적용하기 Rim Light(Fresnel) : 애니메이션에서 빛을 받는
Unity URP Shader Study (1) - HLSL : 흔들리는 깃발 구현
친구들과 게임을 개발했을 때 사용했던 쉐이더들을 차근히 벨로그에 정리해보려고 한다. 부끄럽게도, 개발하던 당시에는 쉐이더에 대한 지식이 얕아, 인터넷에서 찾았던 쉐이더 코드를 오류가 나지 않을 정도만 원하는 효과 한 두 개만 추가하는 정도로 수정하여 거의 그대로 사용했었다. 그렇기 때문에 당시 이해하지 못한 구조가 꽤 있었다. 다시 예전 코드들을 뜯어보면서 공부해야지, 공부하면서 정리 해야지 했는데 계속 못하고 있었다. 최근에 많은 일들이 정리되고 본격적으로 다시 HLSL와 ShaderGraph를 공부하기 시작하면서 그 기회가 생겼다. 급하게 공부했던 내용들을 최근에 다시 채우고 있으니 구조가 드디어! 이해가 되어 괜히 뿌듯함을 느끼고 있다. 아직 원인을 잘 모르는 이슈도 있지만, 우선은 구현해낸 것을 정리하는 것을 목표로 한다. 공부하면서 직접 구현해본 것들도 Study 시리즈에 정리해서 올릴 예정이기에, 부족한 부분이 많고 최적화 이슈 등이 있을 수도 있다. !
Unity URP Shader - HLSL(2) : ShaderLab
자료 링크 https://docs.unity3d.com/kr/530/Manual/SL-Properties.html HLSL 프로퍼티 종류 정리 Float : 숫자(Numbers) 및 슬라이더(Sliders) Float4 : 컬러(Colors) 및 벡터(Vectors) Sampler : 텍스처(Textures) 프로퍼티 속성 [HideInInspector] - 머티리얼 인스펙터에 프로퍼티 값을 표시하지 않습니다. [NoScaleOffset] - 머티리얼 인스펙터는 이 속성을 포함한 텍스처 프로퍼티에 대해 텍스처 타일링/오프셋 필드를 표시하지 않습니다. [Normal] - 텍스처 프로퍼티의 노멀맵 예상 여부를 나타냅니다. [HDR] - 텍스처 프로퍼티의 HDR 텍스처 예상 여부를 나타냅니다. [Gamma] - 플로트/벡터 프로퍼티가 UI에서 sRGB로 지정되고(컬러와 동일) 사용되는 색 공간에
Unity URP Shader - HLSL(1) : 기본 구조 정리
HLSL 뉴비의 공부한 내용 정리하기 위해 작성하는 벨로그 공부해야할 영역은 두 가지다. 버텍스 쉐이더 픽셀 쉐이더 버텍스 쉐이더는 말 그대로 오브젝트의 버텍스에 대한 값을 처리하는 영역이고, 픽셀 쉐이더는 해당 오브젝트를 모니터에서 그리기 위해 하나하나의 픽셀에 들어갈 색상을 계산해 처리하는 영역을 말한다. 기존의 유니티 파이프라인에서는 스탠다드 서피스 쉐이더로 CG언어를 사용해야했다. URP에서는 서피스 쉐이더가 호환이 안돼서 Shader Graph와 HLSL를 이용해 쉐이더를 만들어야 한다. 만약 URP에서 서피스 쉐이더로 적용되어있다면 핑크색상으로 재질이 바뀔 것이다. 오류가 난다는 뜻이다. HLSL랑 서피스 쉐이더는 비슷하면서 많이 다르다. 쉐이더 랩을 이용하는 것까지는 동일하지만, 버텍스 쉐이더와 픽셀 쉐이더 영역을 구분해서 사용하고 자료를 받아오는 방식이 조금 다른 것 같다. 이 벨로그에서는 HLSL와 쉐이더 그래프만 다룰 예정이다. 가장 기본적인
[셰이더 프로그래밍 입문] Part2 | 셰이더 프로그래밍 응용 (Chapter9~10)
Chapter 9 | UV 애니메이션과 울렁효과 >#### 🆕 HLSL cos() - 코사인 함수 ◾ UV 애니메이션 표면에 텍스처를 입힌 뒤에 텍스처를 이동시켜 움직이는 효과를 만든다. 📝 기초설정 5장 Diffuse/SpecularMapping 프로젝트를 불러오고 셰이더의 이름을 UVAnimation으로 수정한다. 모델을 Torus.3ds로 설정한다.(원환체) 셰이더는 GPU상에서 실행되며 시간을 구하는 함수가 없으므로 CPU에서 시간 값을 계산한 뒤 전역변수로 넘겨 받아야 한다. *
[셰이더 프로그래밍 입문] Part2 | 셰이더 프로그래밍 응용 (Chapter7~8)
Chapter 7 | 폴리곤 수를 늘리지 않고도 디테일을 추가할 수 있는 법선매핑 >#### 🆕 HLSL TANGENT - 정점에서 접선정보를 불러올 때 사용하는 시맨틱 BINORMAL - 정점에서 종접선정보를 불러올 때 사용하는 시맨틱 transpose() - 전치행렬을 구하는 함수 🆕 수학 접선공간 - 법선맵 안에 저장된 법선이 존재하는 공간 두 벡터의 외적을 구하면 그 둘에 직교하는 세 번째 벡터를 구할 수 있다. 물체의 울퉁불퉁함을 표현하기 위해서 폴리곤의 수를 늘려 울퉁불퉁한 모델을 만드는 방법이 있지만, 수많은 정점으로 속도가 느려지고 메모리 소모도 커진다. 울퉁불퉁한 표면의 법선은 아래 그림과 같다. 각 텍셀에 위의 법선을 저장한 텍스처`No
[셰이더 프로그래밍 입문] Part2 | 셰이더 프로그래밍 응용 (Chapter5~6)
Chapter 5 | 물체에 색을 입히는 diffuse/specular 매핑 ◾DiffuseMap 표면이 빛을 흡수하는 성질을 셰이더에서 표현하기 (색 입히기) 텍스쳐 이미지를 픽셀 셰이더에서 읽어와 각 픽셀마다 색을 정해주면 된다. 전체적인 빛을 결정하는 난반사광의 결과에 텍스쳐를 적용한다. 이렇게 난반사광에 적용하는 텍스쳐를 DiffuseMap이라고 한다. ◾SpecularMap 정반사광용 텍스쳐맵을 만드는 경우도 있다. 난반사광이 반사하는 빛과 정반사광이 반사하는 빛의 스펙트럼이 다른 경우 각 픽셀이 반사하는 정반사광의 정도를 조절하는 경우 (이마, 코에 듬성듬성 보이는 정반사광 효과 등) > #### ❗ 따라서 난반사광 = 빛의 색상 X 난반사광의 양 X 디퓨즈맵의 값 정반사광 = 빛의 색상 X 정반사광의 양 X 스페큘러맵의 값
[셰이더 프로그래밍 입문] Part1 | 셰이더 프로그래밍 기초 (Chapter3~4)
Chapter 3 | 텍스처매핑 >#### 🆕 HLSL sampler2D - 텍스처에서 텍셀을 구해올 때 사용하는 샘플러 데이터형 tex2D() - 텍스처 샘플링에 사용하는 HLSL 함수 swizzle - 벡터 성분의 순서를 마움대로 뒤섞을 수 있는 방법 ◾ 텍스처매핑과 UV좌표 3D물체를 구성하는 삼각형의 각 정점을 텍스처 위에 있는 한 픽셀에 대응시켜준다. 백분율(0~1)을 사용하여 텍스처 위의 한 픽셀을 가리킨다. x, y와 구별하기 위해 UV를 사용한다. 적절한 UV좌표를 대입하여 텍스처매핑을 한다.
[셰이더 프로그래밍 입문] Part1 | 셰이더 프로그래밍 기초 (Chapter1~2)
Chapter 1 | 셰이더란 무엇이죠? ◾셰이더 화면에 출력할 픽셀의 위치와 색상을 계산하는 함수 픽셀의 농담, 색조, 명암을 조합한 RGBA 색상 값 하나를 출력한다. ◾3D 그래픽 파이프라인 3차원 공간에 존재하는 물체를 컴퓨터 모니터라는 2차원 평면 위에 보여주기 위해 존재한다. 1. 정점셰이더 정점데이터는 3D모델(정점들의 집합) 정점셰이더는 3D물체를 구성하는 정점들의 위치를 화면 좌표로 변환하는 Space Transformation(공간변환) 과정을 한다. 각 정점의 공간을 변환하기 때문에 3D물체를 구성하는 정점의 수만큼 호출된다. 2. 래스터라이저 정점셰이더가 출력하는 정점의 위치를 3개씩 모아 삼각형을 만들고, 그 안에 들
[HLSL] Bit Wise연산 활용
개요 DirectX 12 마이크로소프트 예제 프로젝트를 분석하다가 >>, &, ~같은 bit wise연산이 빈번하게 사용되는 것을 발견하고 왜 사용하는 것인지 정리하고자 이 글을 작성한다. 예시 이 코드는 Index버퍼의 OffsetByte주소를 주면 해당 주소로부터 16비트의 크기를 가지는 Index3개를 리턴하는 HLSL함수이다. 분석 이 코드는 ByteAddressBuffer의 특성 때문에 그렇다. ByteAddressBuffer는 memory alignment때문에 4바이트(32비트)단위로만 데이터를 Load하게 된다. 4바이트 단위인 이유는 GPU가 메모리의 데이터를 읽는 최소 단위가 4바이트이기 때문이다. 위 코드는 4바이트 단위로 읽는 제약조건 속에서 2번의 Load(8바이트)연산의 결과물에 Bit Wise연산을 통해 2바이트 Index데이터를 3개 얻는 코드라고 할 수 있다. 위 코드는 현재 읽고자 하는 데이터의 주소가 4단위의 숫자인지 검사하는
[HLSL] Shader Semantics
Shader Semantics HLSL 프로그래밍에서 입력 및 출력 변수는 semantics를 통해 그 의도를 명시해야한다. 함수와 semantic을 ":" (colon)으로 이어서 표기함으로 이를 나타낸다. 위 예시의 fixed4 frag (v2f i) : SVTarget에서 SVTarget은 함수의 리턴값에 대한 의미, 즉 semantic을 부여한다. fixed4 fixed는 색상을 표현하는 데 많이 쓰이는 실수 자료형으로, 같은 실수 자료형인 float, half에 비해 low precision이다. 일반적으로 float는 32bit, half는 16bit인데 반해 fixed는 11비트로, 소수점을 표현하는 정밀도가 낮다. fixed의 뒤에 붙는 숫자는 fixed 변수의 dimension을 나타낸다. fixed4는 4개의 fixed 컴포넌트를 갖는 벡터 자료형으로, 앞서 fixed는 색상을 표현하는 데 많이 쓰인다고 하였으므로 주로 (r,g,