💭회고
셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (4)
💭회고 셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (3)💭회고 셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (2)💭회고2025.03.20 - [Dev./그래픽스 Graphics] - 셰이더 그래프 학습 정리 - '샤
raindrovvv.tistory.com
셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (3)
💭회고 셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (2)💭회고2025.03.20 - [Dev./그래픽스 Graphics] - 셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' 셰이더 그래프 학습 정리 - '샤라웃 투 고
raindrovvv.tistory.com
셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (2)
💭회고2025.03.20 - [Dev./그래픽스 Graphics] - 셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' 셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌'💭회고셰이더는 게임 및 그래픽 디자인에서 중요한
raindrovvv.tistory.com
셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌'
💭회고셰이더는 게임 및 그래픽 디자인에서 중요한 기술로, 3D 객체를 현실적으로 표현하거나 독창적인 효과(마인크래프트 셰이더 효과를 생각하면 이해가 쉽다...!)를 생성하는 데 사용된다.
raindrovvv.tistory.com
📒학습 내용
1. 기본 수학 (Basic Math)
🔹Add (더하기)
- 두 값(또는 벡터)을 더한다. 예를 들어, 두 색상의 값을 합치거나 좌표 값을 누적할 때 사용된다.
- 사용 예시: Add는 색을 밝게/어둡게 하거나 UV 텍스처 좌표를 오프셋할 때 사용합니다.
🔹Subtract (빼기)
- 한 값에서 다른 값을 뺀다. 오프셋을 계산하거나, 두 위치 간의 차이를 구할 때 유용하다.
- 사용 예시: Subtract는 색을 어둡게 하고 UV를 오프셋하는 데 사용할 수 있습니다.
🔹Multiply (곱하기)
- 두 값(또는 벡터/스칼라)를 곱한다. 색상 혼합, 밝기 조절, 스케일 조정 등에 사용된다.
- 사용 예시: Multiply는 색/텍스처를 밝거나 어둡게 할 때 또는 텍스처의 UV를 조작할 때 자주 사용됩니다.
🔹Divide (나누기)
- 한 값을 다른 값으로 나눈다. 비율을 계산하거나, 정규화를 위한 스케일 조정 시 사용된다.
- 예시: A=(1.0), B=(5.0)일 때 Divide를 사용하면 (0.2)가 출력되며, 결과는 어두운 회색으로 나타납니다.
🔹Power (거듭제곱)
- 기본 값의 거듭제곱을 계산한다. 감마 보정, 특수 효과(예: 페이드 효과) 등에 활용할 수 있다.
- 사용 예시: 전달되는 색의 범위가 [0,1]인 경우, Power는 매우 밝은 값일 때는 약간만 어두워지지만 값이 어두우면 밝기가 급격히 어두워지는 일종의 대비 조절 효과를 냅니다.
- Square Root (제곱근): 값의 제곱근을 계산한다. 벡터의 길이를 구할 때나, 거리 기반 효과에서 자주 사용된다.
- 범위가 0~1인 텍스처의 경우, 이 표현식은 이미지에서 대비를 눈에 띄게 감소시킵니다. 예를 들어 아래의 캘리브레이션 텍스처에서는 어두운 값은 밝아지고 흰색 값은 회색으로 변합니다.
2. 고급 수학 (Advanced Math)
🔹Absolute (절댓값)
- 입력 값의 부호를 제거하여 양수로 만든다. 음수 값을 제거해 안정적인 결과를 얻거나, 거리 계산 시 사용한다.
- 사용 예시: Abs는 일반적으로 내적(Dot Product)과 함께 사용하여 두 벡터 간의 각도 관계가 평행인지, 직각인지, 그 중간인지를 결정합니다. 보통 두 벡터의 내적을 구할 때 그 값은 1.0(두 평행 벡터)과 -1.0(정반대인 두 벡터) 사이에서 보간하며, 중간점 0은 두 벡터가 수직임을 나타냅니다. 이 내적의 절댓값을 취하면 양수인 값은 변하지 않지만, 음수인 값은 - 기호를 떼고 양수로 변환됩니다. 따라서 그 결과는 0(수직 벡터)과 1.0(평행 벡터, 벡터 점의 방향과 무관한 평행 벡터) 사이에서 보간됩니다. 이를 통해 두 벡터의 직교 여부만 알 수 있습니다.
➡️ 이 노드는 내적(Dot Product) 계산 시 특히 유용하다. 두 벡터의 내적은 벡터의 각도 관계를 나타내며, 결과 값이:
- 1.0에 가까울수록 두 벡터가 평행에 가깝고,
- -1.0에 가까울수록 반대 방향으로 평행하며
- 0이라면 두 벡터가 직각을 이룬다.
여기서 절댓값을 이용하면 음수 값을 양수로 전환하여 두 벡터의 직교 여부를 판단할 수 있게 된다. 절댓값 처리 결과는 0(수직 벡터)에서 1.0(평행 벡터) 사이 값으로 보간되며, 벡터의 방향과 무관하게 각도 관계만 분석할 수 있다.
🔹Exp(Exponential, 지수)
- 수학적으로, Exp는 e(오일러 상수, 약 2.718)를 기반으로 한 지수 함수로, 입력 값의 지수(e^입력 값)를 계산하여 출력한다.
- 사용 목적 : Exp는 그래프의 곡선형 패턴을 만들거나, 시간이 지남에 따라 특정 값이 천천히 증가하거나 감소하는 효과를 줄 때 유용하다. 예를 들어, 자연스러운 조명이나 에너지가 감소하는 모습을 표현할 때 활용된다.
지수함수 그래프
지수함수 그래프
www.geogebra.org
🔹Log (로그)
- 자연 로그(ln) 혹은 다른 밑의 로그를 계산한다. 밝기 조절, 노이즈 함수, 또는 감마 보정에서 로그 함수를 활용할 수 있다.
- Logarithm10 : 밑이 10인 로그 값을 반환하며, 입력 값의 일반 로그라고도 합니다. 즉, 밑이 10인 어떤 값을 이 표현식으로 반환되는 수만큼 2제곱하면 그 입력 값이 나옵니다.
- Logarithm2 : 입력값에 대해 밑이 2인 로그 값을 반환합니다. 즉, 밑이 2인 어떤 값을 이 표현식으로 반환되는 수만큼 2제곱하면 그 입력 값이 나옵니다.
⭐Modulo (나머지) - 자주 쓰임
나눗셈 후 나머지를 반환한다. 패턴 반복(인덱싱), 좌표 래핑(wrapping) 또는 포스터라이즈(posterize) 효과를 구현할 때 사용된다.
3. 보간 (Interpolation)
보간 함수들은 두 값 사이를 부드럽게 전환하거나 중간 값을 계산할 때 사용된다.
🔹 Lerp (선형 보간)
LinearInterpolate 표현식은 세 번째 입력값을 마스크로 사용해 두 입력값을 블렌딩한다.
포토샵의 레이어 마스크처럼 두 텍스처 사이의 전환을 정의하는 마스크라고 생각하면 된다.
마스크의 강도 알파는 두 입력값에서 취할 색 비율을 결정한다.
알파가 0.0이면 첫 번째 입력이 사용된다. 알파가 1.0이면 두 번째 입력이 사용된다.
알파가 0.0~1.0이면 출력은 두 입력의 블렌드가 된다.
🔹Inverse Lerp (역 보간)
주어진 값이 A와 B 사이에서 어느 위치에 있는지(보간 계수 t)를 계산한다.
💫 Lerp와 Inverse Lerp의 차이점:
특징 | Lerp | Inverse Lerp |
기능 | 두 값(A, B) 사이에서 특정 지점(T)을 계산 | 주어진 값(Value)이 A와 B 사이에서의 위치(T)를 계산 |
입력 | A, B, T (보간 비율) | A, B, Value (위치를 계산할 값) |
출력 | A와 B 사이의 특정 값 | 값의 상대적인 비율(T) |
사용 목적 | 보간된 결과를 생성 | 위치 또는 비율을 계산 |
🔹Smoothstep (부드러운 보간)
선형 보간과 비슷하지만, 시작과 끝에서 속도를 부드럽게 감속/가속하는 효과를 준다.
경계가 부드럽게 연결되도록 하여 자연스러운 전환을 만듭니다.
언리얼에서는 경계 부근에서 갑작스런 변화 없이 부드러운 전환 효과를 주고 싶을 때 유용하게 쓰인다.
💫 Inverse Lerp와 Smooth Step의 차이점:
[TIL_250220] 언리얼 엔진 디졸브(Dissolve) 이펙트 가이드
💭회고오늘은 언리얼 엔진에서 비주얼 이펙트(VFX) 중 하나인 “디졸브(Dissolve) 이펙트”를 집중적으로 학습했다. 디졸브는 오브젝트 표면이 특정 패턴으로 서서히 사라지는 효과를 구현할 때
raindrovvv.tistory.com
[TIL_250313_2] 포스트 프로세스 효과2 #그래픽스
💭회고2025.03.13 - [Dev./게임 네트워크] - [TIL_250313_1] 언리얼 소스 코드 빌드하기 [TIL_250313_1] 언리얼 소스 코드 빌드하기💭회고컴퓨터 용량 부족 문제로 인해 해당 실습은 진행하지 못하고 있는
raindrovvv.tistory.com
'Dev. > 그래픽스 Graphics' 카테고리의 다른 글
셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (7) (0) | 2025.04.02 |
---|---|
셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (6) (0) | 2025.04.01 |
셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (4) (0) | 2025.03.28 |
셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (3) (0) | 2025.03.24 |
셰이더 그래프 학습 정리 - '샤라웃 투 고라니🦌' (2) (0) | 2025.03.21 |