| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | |||
| 5 | 6 | 7 | 8 | 9 | 10 | 11 |
| 12 | 13 | 14 | 15 | 16 | 17 | 18 |
| 19 | 20 | 21 | 22 | 23 | 24 | 25 |
| 26 | 27 | 28 | 29 | 30 |
Tags
- Python
- computer vision
- SQLD
- Robocup@Home 2026
- Gentoo2
- DFS
- Optimization
- ROS2
- cs231n
- CPP
- On-memory file system
- 밑바닥부터 시작하는 딥러닝2
- deep learning
- Baekjoon
- Seoul National University
- Machine Learning
- Humble
- RNN
- BFS
- file system
- Multimedia
- System Call
- Operating System
- C++
- paper review
- Linux
- CNN
- Data Science
- Process
- do it! 알고리즘 코딩테스트: c++편
Archives
- Today
- Total
newhaneul
[Multimedia] Lecture 7. Rasterizer, Fragment Shader, Output Merger 본문
4. University Study/Multimedia
[Multimedia] Lecture 7. Rasterizer, Fragment Shader, Output Merger
뉴하늘 2026. 3. 28. 19:33728x90
본 포스팅은 인하대학교 안남혁 교수님의 [202601-EEC4410-001] Multimedia을 수강하고 공부한 내용을 정리하기 위한 포스팅입니다.
1. Rasterizer

Rasterizer는 Clip Space의 정점들을 조립하여 삼각형을 만들고, 각 삼각형을 화면의 픽셀 단위인 Fragment로 분할하는 역할을 수행한다. 이 과정은 크게 5가지 세부 단계로 구성된다.
- Clipping
- Perspective division
- Back-face culling
- Viewport transform
- Scan conversion
** 2024-2 중간고사 **

- 정답: 4
** 2025-1 중간고사 **

- 정답: 4
Clipping

- Clip Space에서 수행되며, 카메라 시야인 View frustum을 벗어나는 영역을 잘라낸다.
- Frustum 바깥에 있는 삼각형은 완전히 제거되고, 걸쳐 있는 삼각형은 잘리게 되며 이 과정에서 정점이 새롭게 추가되거나 삭제된다.
Perspective Division

- 투영 변환 행렬(Projection Transform Matrix) $M_{proj}$의 마지막 행은 일반적인 아핀 변환의 $(0, 0, 0, 1)$과 달리 $(0, 0, -1, 0)$으로 구성된다.
- 이 행렬을 동차 좌표계(Homogeneous Coordinates)의 정점 $(x, y, z, 1)$에 적용하면, 변환된 정점의 $w$ 좌표는 $-z$가 된다.
- 동차 공간(Clip space)에서 일반적인 3차원 데카르트 공간으로 변환하기 위해서는 행렬 연산 결과를 자신의 $w$ 좌표, 즉 $-z$로 나누어야 한다.


- 값 $-z$는 카메라 공간의 xy-평면으로부터 떨어진 수직 거리를 의미한다.
- 앞선 예시에서 $P_1$이 $P_2$보다 멀리 위치하므로 $P_1$의 $-z$ 값(2)이 더 크고, 그 결과 y좌표가 1에서 $1/2$로 더 크게 축소된다.
- 이러한 원근 나눗셈 연산을 거쳐 $x, y, z$ 좌표가 모두 일정한 범위 내로 들어온 최종 상태를 정규화된 장치 좌표계(NDC, Normalized Device Coordinates)라고 정의된다.
** 2024-2 중간고사 **

- 정답:
- Clip space에서 동차 좌표계로 표현된 점의 좌표는 $(x, y, z, w)$ 형태를 가진다. 문제에서 주어진 좌표가 $(-2, 1, 3, -3)$이므로, 여기서 $w$ 값은 -3이 된다.
- 동차 공간인 클립 공간에서 정규화된 장치 좌표계(NDC, Normalized Device Coordinates)로 변환하기 위해서는 원근 나눗셈(Perspective Division)을 수행해야 한다.
- 원근 나눗셈은 각 정점의 $x, y, z$ 좌표를 해당 정점의 $w$ 좌표로 나누어주는 연산 과정이므로 주어진 좌표의 각 성분을 $w$ 좌표인 -3으로 각각 나누어주면 다음과 같이 계산된다.
- $x_{ndc} = \frac{-2}{-3} = \frac{2}{3}$
- $y_{ndc} = \frac{1}{-3} = -\frac{1}{3}$
- $z_{ndc} = \frac{3}{-3} = -1$
- 따라서 변환을 거친 최종 NDC 좌표는 $(2/3, -1/3, -1)$이 된다.
Back-Face Culling

- 전면(Front face)은 카메라 시점을 향해 있는 다각형을 의미하고, 후면(Back face)은 카메라 시점을 등지고 있는 다각형을 의미한다.
- 카메라는 물체의 뒷면을 포착할 수 없으므로 렌더링 파이프라인 과정에서 후면 polygon을 사전에 제거(Cull)하여 렌더링 연산량을 줄이게 된다.

- 투영 변환과 원근 나눗셈을 모두 거친 후의 정규화된 장치 좌표계(NDC)에서는 보편적 투영 선(Universal projection line)을 따라 다각형을 2D xy-평면에 투영하여 판별하는 방식으로 전환된다.
- NDC의 xy-평면에 투영된 삼각형의 정점(vertex) 연결 순서가 반시계 방향(CCW, Counter-Clockwise)이면 전면, 시계 방향(CW, Clockwise)이면 후면으로 분류된다.
- 이를 수학적으로 매우 간단하게 판별하기 위해, 각 정점의 x, y 좌표만을 활용하여 2x2 행렬의 행렬식(Determinant)을 계산한다.
- 행렬식의 첫 번째 행은 첫 번째 정점에서 두 번째 정점으로 향하는 2D 벡터를 나타내고, 두 번째 행은 첫 번째 정점에서 세 번째 정점으로 향하는 2D 벡터로 구성된다.
$$\begin{vmatrix} (x_2-x_1) & (y_2-y_1) \\ (x_3-x_1) & (y_3-y_1) \end{vmatrix}$$- 행렬식의 계산 결과가 양수이면 CCW 방향이므로 전면(Front face)을 의미한다.
- 결과가 음수이면 CW 방향이므로 후면(Back face)을 의미한다.
- 결과가 0이면 다각형이 측면(Edge-on face)을 보이고 있음을 의미한다.
- 행렬식의 첫 번째 행은 첫 번째 정점에서 두 번째 정점으로 향하는 2D 벡터를 나타내고, 두 번째 행은 첫 번째 정점에서 세 번째 정점으로 향하는 2D 벡터로 구성된다.
** 2024-2 퀴즈 **

- 정답:
- View frustum culling은 카메라의 시야 영역인 View frustum을 벗어나 있는 object 전체를 렌더링 대상에서 제외시키는 방법이다.
- Backface culling은 카메라 시점을 등지고 있는 polygon을 렌더링 대상에서 제외하는 방법이다.
- Projection transform과 Perspective division을 거친 NDC에서 polygon을 보편적인 투영 선을 따라 2D XY 평면에 투영한다. 그 후 각 정점의 x, y 좌표만을 사용하여 아래 행렬식을 계산한다.
$$\begin{vmatrix} (x_2-x_1) & (y_2-y_1) \\ (x_3-x_1) & (y_3-y_1) \end{vmatrix}$$ - 해당 행렬식의 계산 결과가 양수이면 CCW(전면), 음수이면 CW(후면), 0이면 측면(Edge-on face)으로 간주된다.
- Projection transform과 Perspective division을 거친 NDC에서 polygon을 보편적인 투영 선을 따라 2D XY 평면에 투영한다. 그 후 각 정점의 x, y 좌표만을 사용하여 아래 행렬식을 계산한다.
Viewport

- 컴퓨터 화면은 고유한 Window space 또는 Screen space을 갖게 된다.
- Viewport는 렌더링된 3D 장면이 최종적으로 투영되는 화면 공간 내의 사각형 영역을 정의한다. 이 screen space는 단순히 2D 평면이 아니라 깊이(Depth) 값을 포함하는 3D 공간으로 취급된다.
- 깊이를 나타내는 $minZ$와 $maxZ$의 기본값은 보통 0.0과 1.0으로 설정된다.
- 이 단계에서 적용되는 Screen space는 왼손 좌표계(LHS)를 따른다.

- Viewport Transform은 Perspective division을 거쳐 정규화된 장치 좌표계(NDC)에 존재하는 객체들을 실제 픽셀 단위의 Screen space으로 변환하는 과정이다.
- NDC에서의 Clip space은 원점을 중심으로 한 가로, 세로, 깊이가 각각 2인 정육면체($2 \times 2 \times 2$ cube) 형태를 띠게 된다. 이를 Viewport에 맞추기 위해 크기 변환(Scaling)과 이동 변환(Translation)이 순차적으로 적용된다.
- 크기 변환 행렬: NDC 정육면체의 크기를 뷰포트의 너비($w$), 높이($h$), 깊이($maxZ - minZ$)에 맞게 절반씩($w/2, h/2$) 스케일링한다.
- 이동 변환 행렬: 크기가 조정된 객체의 중심을 뷰포트의 실제 중심 좌표인 $(minX + w/2, minY + h/2, (maxZ + minZ)/2)$로 이동시키게 된다.
- 대부분의 실제 구현 환경에서는 Viewport의 시작점인 $minX$와 $minY$를 0으로 설정하고, 깊이 값인 $minZ$를 0.0, $maxZ$를 1.0으로 설정한다. 따라서 이러한 기본값을 두 변환 행렬의 곱셈 결과에 대입하면 아래의 최종 Viewport Transform 행렬을 구할 수 있다.
$$\begin{pmatrix} \frac{w}{2} & 0 & 0 & \frac{w}{2} \\ 0 & \frac{h}{2} & 0 & \frac{h}{2} \\ 0 & 0 & \frac{1}{2} & \frac{1}{2} \\ 0 & 0 & 0 & 1 \end{pmatrix}$$
Scan Conversion

- Scan Conversion은 Screen space으로 투영된 polygon을 여러 개의 Fragments 집합으로 분할하는 과정이다.
- 이 과정에서 다각형 영역에 포함되는 픽셀 후보들을 찾아내고, 각 픽셀 위치에 해당하는 정점의 속성(Vertex attributes)들을 보간(Interpolate)하여 계산한다.
- 화면을 구성하는 가로 픽셀 줄을 Scan line이라고 부르며, Scan conversion은 이 라인들을 따라 순차적으로 진행된다.
** 2024-2 퀴즈 **

- 정답: Scan Conversion

- Bilinear Interpolation: 속성값들을 보간하기 위한 방법
- 1단계: 삼각형 세 개의 꼭짓점(Vertex)의 좌표 $(x, y)$와 그 점에서의 색상값 $(c)$을 준비
- 시작점 (아래쪽): $(0.3, 0.9)$, 색상 $c_1 = 90$
- 위쪽 점: $(3.1, 6.5)$, 색상 $c_3 = 146$
- 오른쪽 점: $(8.5, 3.8)$, 색상 모름 (예시에서 계산에 직접 쓰이지 않음)
- 2단계: Edge를 따라 보간
- 우선 시작점 $(0.3, 0.9)$에서 위쪽 점 $(3.1, 6.5)$으로 가는 왼쪽 모서리를 살펴본다.
- 1. 변화량 계산: $y$가 얼마만큼 변할 때, $x$와 색상 $c$가 얼마나 변하는지 그 비율을 구해야 한다.
- $\Delta y$ (y의 총 변화량) = $6.5 - 0.9 = 5.6$
- $\Delta x$ (x의 총 변화량) = $3.1 - 0.3 = 2.8$
- $\Delta c$ (색상의 총 변화량) = $146 - 90 = 56$
- 2. 단위 변화율 계산: $y$가 1만큼 증가할 때, $x$와 $c$는 얼마나 증가하는지 구한다.
- $\frac{\Delta x}{\Delta y} = \frac{2.8}{5.6} = 0.5$ (y가 1 증가할 때, x는 0.5 증가)
- $\frac{\Delta c}{\Delta y} = \frac{56}{5.6} = 10$ (y가 1 증가할 때, 색상은 10 증가)
- 3. 특정 위치의 값 구하기: 이제 시작점에서 $y$가 조금 이동했을 때의 값을 구할 수 있다. 예를 들어, 격자의 첫 번째 교차점인 $y=1.5$ 위치를 구해보자.
- 시작점의 $y=0.9$에서 $y=1.5$까지 0.6만큼 이동했다.
- 새로운 $x = x_1 + (0.6 \times \text{x의 변화율}) = 0.3 + (0.6 \times 0.5) = 0.6$
- 새로운 색상 $c = c_1 + (0.6 \times \text{색상 변화율}) = 90 + (0.6 \times 10) = 96$
- 1. 변화량 계산: $y$가 얼마만큼 변할 때, $x$와 색상 $c$가 얼마나 변하는지 그 비율을 구해야 한다.
- 이 과정을 삼각형의 테두리를 따라 반복하면, 왼쪽 그림에 나온 $c=96$, $c=106$, $c=116$ 등의 값들을 모두 계산할 수 있다.
- 우선 시작점 $(0.3, 0.9)$에서 위쪽 점 $(3.1, 6.5)$으로 가는 왼쪽 모서리를 살펴본다.
- 3단계: Scan line을 따라 내부 보간
- 삼각형 내부를 수평으로 가로지르는 선(스캔 라인) 위의 픽셀들 색상을 채울 차례다. 두 번째 슬라이드의 $y=4.5$인 스캔 라인을 예로 든다.
- 1. 스캔 라인의 양 끝점 확인: 이전 단계와 같은 방법으로 이 스캔 라인이 삼각형의 왼쪽 모서리와 오른쪽 모서리와 만나는 점의 좌표와 색상을 미리 구했다고 가정한다.
- 왼쪽 끝점: $x_l = 2.1$, 색상 $c_l = 126$
- 오른쪽 끝점: $x_r = 7.1$, 색상 $c_r = 251$
- 2. 수평 변화율 계산: 수직으로 했던 것과 똑같이 이번엔 수평(x축) 방향으로 변화율을 구한다.
- $\Delta x$ (x의 총 변화량) = $7.1 - 2.1 = 5$
- $\Delta c$ (색상의 총 변화량) = $251 - 126 = 125$
- 단위 변화율 $\frac{\Delta c}{\Delta x} = \frac{125}{5} = 25$ (x가 1 증가할 때, 색상은 25 증가)
- 3. 내부 픽셀 색상 구하기: 왼쪽 끝점 $(x=2.1, c=126)$에서 출발하여 오른쪽으로 이동하며 색상을 계산한다.
- 첫 번째 픽셀 위치 $x=2.5$ (이동량 $0.4$): $c = 126 + (0.4 \times 25) = 136$
- 두 번째 픽셀 위치 $x=3.5$ (이동량 $1.4$, 직전 위치에서 1 이동): $c = 136 + (1 \times 25) = 161$
- 세 번째 픽셀 위치 $x=4.5$ (직전에서 1 이동): $c = 161 + 25 = 186$
- 이런 식으로 오른쪽 끝점까지 스캔 라인 위의 모든 픽셀 색상을 계산해 낸다.
- 1. 스캔 라인의 양 끝점 확인: 이전 단계와 같은 방법으로 이 스캔 라인이 삼각형의 왼쪽 모서리와 오른쪽 모서리와 만나는 점의 좌표와 색상을 미리 구했다고 가정한다.
- 삼각형 내부를 수평으로 가로지르는 선(스캔 라인) 위의 픽셀들 색상을 채울 차례다. 두 번째 슬라이드의 $y=4.5$인 스캔 라인을 예로 든다.
- 1단계: 삼각형 세 개의 꼭짓점(Vertex)의 좌표 $(x, y)$와 그 점에서의 색상값 $(c)$을 준비
** 2024-2 중간고사 **

- 정답: (a)는 $x = 2.5, y = 4.5$ 지점이고 (b)는 $x = 5.5, y = 4.5$ 지점에서의 색상 값을 구해야 한다.
- 1. 스캔 라인 ($y = 4.5$) 양 끝점의 좌표와 색상 계산
- 왼쪽 테두리 교점 ($p_1$에서 $p_3$ 방향):
- $y$ 변화량: $6.5 - 0.9 = 5.6$
- $x$ 변화량: $3.1 - 0.3 = 2.8$
- 색상 변화량: $106 - 50 = 56$
- $y$당 $x$ 변화율: $2.8 / 5.6 = 0.5$
- $y$당 색상 변화율: $56 / 5.6 = 10$
- $y = 4.5$일 때 이동량 ($4.5 - 0.9$): $3.6$
- 왼쪽 끝점: $x_l = 0.3 + (3.6 \times 0.5) = 2.1$, 색상 $c_l = 50 + (3.6 \times 10) = 86$
- 오른쪽 테두리 교점 ($p_3$에서 $p_2$ 방향):
- $y$ 변화량: $3.8 - 6.5 = -2.7$
- $x$ 변화량: $8.5 - 3.1 = 5.4$
- 색상 변화량: $214 - 106 = 108$
- $y$당 $x$ 변화율: $5.4 / -2.7 = -2.0$
- $y$당 색상 변화율: $108 / -2.7 = -40$
- $y = 4.5$일 때 이동량 ($4.5 - 6.5$): $-2.0$
- 오른쪽 끝점: $x_r = 3.1 + (-2.0 \times -2.0) = 7.1$, 색상 $c_r = 106 + (-2.0 \times -40) = 186$
- 왼쪽 테두리 교점 ($p_1$에서 $p_3$ 방향):
- 2. 스캔 라인을 따른 수평 색상 변화율 계산
- 수평 $x$ 변화량: $7.1 - 2.1 = 5.0$
- 수평 색상 변화량: $186 - 86 = 100$
- $x$가 1 증가할 때 색상 변화율: $100 / 5.0 = 20$
- 3. 내부 픽셀 색상 계산
- (a) point ($x = 2.5, y = 4.5$):
- 이동 거리: $2.5 - 2.1 = 0.4$
- 색상 값: $86 + (0.4 \times 20) = 86 + 8 = 94$
- (b) point ($x = 5.5, y = 4.5$):
- 이동 거리: $5.5 - 2.1 = 3.4$
- 색상 값: $86 + (3.4 \times 20) = 86 + 68 = 154$
- (a) point ($x = 2.5, y = 4.5$):
- 1. 스캔 라인 ($y = 4.5$) 양 끝점의 좌표와 색상 계산
** 2025-1 중간고사 **


- 정답:
- 1. 점 (1)의 좌표와 텍스처 $(s, t)$ 구하기
- 점 (1)은 꼭짓점 $(1, 2)$와 $(1, 6)$을 잇는 왼쪽 모서리 위에 있으며, 스캔 라인 $y = 3.5$와 교차하는 지점이다.
- 해당 모서리는 $x$ 좌표가 1로 고정되어 있으므로 점 (1)의 위치는 $(1, 3.5)$가 된다.
- $y$ 좌표를 기준으로 보간 비율을 구하면, 전체 길이 $\Delta y = 6 - 2 = 4$ 중에서 시작점 $(1, 2)$로부터 $3.5 - 2 = 1.5$만큼 이동한 위치가 된다.
- 이동 비율: $\frac{1.5}{4} = \frac{3}{8} = 0.375$
- 텍스처 좌표 $s$: 양 끝점 모두 0이므로 $s = 0$이 된다.
- 텍스처 좌표 $t$: 0에서 1로 변하므로 $t = 0 + \frac{3}{8}(1 - 0) = \frac{3}{8} = 0.375$이 된다.
- 결과적으로 점 (1)의 텍스처 좌표는 $(0, 0.375)$이 된다.
- 2. 점 (1)의 좌표와 텍스처 $(s, t)$ 구하기
- 점 (2)는 꼭짓점 $(5, 2)$와 $(1, 6)$을 잇는 오른쪽 모서리 위에 있으며, $y = 3.5$와 교차하는 지점이다.
- 오른쪽 모서리의 기울기를 구하면 $\frac{6 - 2}{1 - 5} = \frac{4}{-4} = -1$이므로, 직선의 방정식은 $y - 2 = -1(x - 5)$, 즉 $x = 7 - y$가 된다.
- $y = 3.5$일 때 $x = 7 - 3.5 = 3.5$이므로 점 (2)의 위치는 $(3.5, 3.5)$가 된다.
- 시작점 $(5, 2)$에서 $(1, 6)$으로 갈 때의 $y$ 변화량 $\Delta y = 4$ 중에서, $(5, 2)$로부터 $3.5 - 2 = 1.5$만큼 이동한 위치가 된다.
- 이동 비율: $\frac{1.5}{4} = \frac{3}{8} = 0.375$
- 텍스처 좌표 $s$: 1에서 0으로 변하므로 $s = 1 + \frac{3}{8}(0 - 1) = 1 - \frac{3}{8} = \frac{5}{8} = 0.625$이 된다.
- 텍스처 좌표 $t$: 0에서 1로 변하므로 $t = 0 + \frac{3}{8}(1 - 0) = \frac{3}{8} = 0.375$이 된다.
- 결과적으로 점 (2)의 텍스처 좌표는 $(0.625, 0.375)$이 된다.
- 3. 점 (3)에서의 텍스처 $(s, t)$ 구하기
- 1) 수평 거리 및 이동 비율 계산:
- 점 (1)에서 점 (2)까지의 전체 수평 거리 $\Delta x = 3.5 - 1 = 2.5$
- 시작점 (1)에서 Fragment (3)까지의 이동 거리 $d_x = 2.5 - 1 = 1.5$
- 수평 이동 비율: $\frac{1.5}{2.5} = \frac{3}{5}$
- 2) 텍스처 좌표 $s$ 보간:
- $s$ 값은 점 (1)의 $0$에서 점 (2)의 $0.625$로 증가한다.
- 이동 비율 $\frac{3}{5}$을 적용하여 계산하면 다음과 같다.
- $s = 0 + \frac{3}{5} \times \left(\frac{5}{8} - 0\right) = \frac{3}{8} = 0.375$
- 3) 텍스처 좌표 $t$ 보간:
- 수평 스캔 라인을 따라 이동하므로 양 끝점의 $t$ 값은 $\frac{3}{8}$로 동일하다.
- 따라서 보간 후에도 $t$ 값은 변하지 않고 그대로 유지된다.
- $t = \frac{3}{8} = 0.375$
- 결과적으로 Fragment (3)의 텍스처 좌표는 $(0.375, 0.375)$이 된다.
- 1) 수평 거리 및 이동 비율 계산:
- 1. 점 (1)의 좌표와 텍스처 $(s, t)$ 구하기

- 색상 보간은 이해를 돕기 위한 예시일 뿐이며, 실제 컴퓨터 그래픽스 Rendering pipeline의 Scan Conversion 단계에서는 주로 법선 벡터(Normal vectors, $n_x, n_y, n_z$)와 텍스처 좌표(Texture coordinates, 2D)가 독립적으로 보간된다.
- 보간된 법선 벡터와 텍스처 좌표는 각 픽셀 위치를 위한 fragment를 구성하는 핵심 속성이 된다.
- 이렇게 생성된 fragment와 그 속성들은 다음 단계인 Fragment Shader로 전달되어 Texturing과 조명(Lighting) 연산에 사용된다.
2. Fragment Shader

- Rasterizer 단계에서 Scan conversion을 통해 생성된 fragment의 속성들을 전달받아, 해당 fragment의 최종 색상(Color)을 결정하는 역할을 수행한다.
- 이 단계에서 처리되는 핵심적인 연산은 텍스처링(Texturing)과 퐁 셰이딩(Phong shading)과 같은 조명(Lighting) 연산이 된다.
- Fragment shader는 화면을 구성하는 각 fragment마다 독립적이고 개별적으로 동작하기 때문에 호출 횟수에 큰 차이가 발생한다.
- 예를 들어, 하나의 삼각형을 처리할 때 Vertex shader는 3개의 정점(Vertex)에 대해 3번만 호출되지만, Rasterizer가 그 삼각형을 300개의 fragment로 분할했다면 Fragment shader는 300번 호출된다.

- 지금까지의 기하 변환과 Rasterizer 과정을 거쳐, 현재 Fragment shader는 Viewport space에 위치한 fragment들을 처리하고 있는 상태이다.
- Fragment shader를 거쳐 색상이 최종적으로 결정된 픽셀 후보들은 파이프라인의 마지막 단계인 Output Merger로 전달된다.
Frame Buffer

- Output Merger는 최종적으로 화면에 그려질 픽셀들을 통제하고 합성하기 위해 세 가지 종류의 Buffer를 관리한다.
- Color Buffer: 화면에 실제로 표시될 픽셀들의 최종 색상 데이터를 저장하는 메모리 공간을 의미한다.
- Z-Buffer (Depth Buffer): 색상 버퍼에 저장될 픽셀들의 Z축 깊이 값을 기록하는 공간이 된다. 여러 물체가 겹칠 때 어떤 물체가 카메라와 더 가까운지 판별하여 가려지는 부분을 처리하는 용도로 쓰이게 된다.
- Stencil Buffer: 화면의 특정 영역에 마스크를 씌워, 화면에 그리고 싶지 않은 픽셀들을 기록하고 걸러내는 역할을 한다.
Z-Buffering

- Fragment Shader의 최종 출력물은 RGBAZ fragment로 구성된다.
- A (Alpha, Opacity): Fragment의 불투명도 채널을 의미한다.
- Z (Depth): 깊이 채널을 의미한다.

- 같은 픽셀 $(x, y)$에 두 개 이상의 삼각형이 겹칠 경우, rendering pipeline은 해당 픽셀에서 새로 들어온 fragment의 Z값을 기존 Z-Buffer에 기록된 값과 비교하여 결정한다.
- 만약 새로 들어온 fragment의 Z값이 기존 buffer의 값보다 크다면(카메라에서 더 멀리 위치한다면), 해당 fragment는 렌더링 과정에서 무시된다.
- 반대로 Z값이 더 작다면 color buffer를 갱신하고, Z-Buffer의 기록 또한 새로운 Z값으로 업데이트한다. 이러한 과정을 Z-Buffering이라 명명한다.


- 뷰포트의 깊이값 범위가 최소 0.0에서 최대 1.0이라고 가정할 때, Z-버퍼는 처음에 아무런 물체가 없는 상태인 1.0으로 초기화된다.
- 반투명하지 않은 불투명 객체의 경우, 이러한 Z-버퍼링 비교 원리 덕분에 파란색 삼각형을 먼저 렌더링하든 빨간색 삼각형을 먼저 렌더링하든 그 순서 자체가 최종 결과에는 아무런 영향을 미치지 않게 된다.
Alpha Blending (Composition)

- 알파($\alpha$) 채널은 0부터 1 사이의 값을 가지며 framgent의 opacity를 나타낸다.
- 여기서 1은 완전히 불투명한(fully opaque) 상태를, 0은 완전히 투명한(fully transparent) 상태를 의미한다.
- 두 객체를 겹쳐서 혼합할 때 사용하는 가장 기본적인 공식은 $C = \alpha C_0 + (1 - \alpha) C_1$ 이다.
- 여러 레이어가 겹치는 상황을 일반화한 점화식(Recurrence form)은 $C_k = \alpha_k C_k + (1 - \alpha_k) C_{k-1}$ 이 된다.
- 이 수식에서 $C_k$는 k번째 레이어까지 누적된 혼합 색상을 의미하고, $C_{k-1}$은 배경($C_0$)을 포함하여 바로 이전 층까지 누적된 색상을 뜻한다.

- 실제 CG 환경에서 $\alpha$ Blending을 처리할 때, 투명한 물체들은 임의의 무작위 순서로 렌더링할 수 없다.
- 이를 해결하기 위해, 파이프라인에서는 모든 불투명한(opaque) 객체들을 먼저 렌더링한 후, 부분적으로 투명한 객체들을 뒤에서부터 앞(back-to-front)의 순서로 미리 정렬하여 렌더링하는 방식을 채택한다.
- 만약 뒤에서부터 앞으로 정렬하지 않으면, Z-Buffering test 과정에서 앞에 있는 투명 프래그먼트 때문에 뒤에 있는 프래그먼트가 가려진 것으로 잘못 판단되어 렌더링에서 유실되거나 버려질 수 있게 된다.
- 또한, 투명한 객체에 대한 Z-테스트를 수행할 때는 기존에 그려진 불투명한 객체의 깊이 값(Z-value)을 보존하기 위해 Z-Buffering 과정을 수행하지 않는다.
- 이 과정을 거쳐 최종 목적지 색상을 계산하는 누적 공식은 $C_{dst}^k = \alpha_{src} C_{src} + (1 - \alpha_{src}) C_{dst}^{k-1}$ 로 표현되며, 여기서 $C_{dst}^0$은 맨 처음 배경과 불투명한 객체가 그려진 상태를 의미한다.
** 2024-2 중간고사 **


- 정답: 불투명도가 1.0 미만인 두 개의 반투명한 폴리곤이 겹칠 때 발생하는 렌더링 파이프라인의 연산 과정을 묻고 있다.
- 1. 렌더링 순서 결정 (Back-to-Front)
- 알파 블렌딩을 수행할 때는 먼 객체부터 가까운 객체 순서로 정렬하여 렌더링해야 한다.
- 폴리곤 1의 깊이는 $z_1 = 0.8$이고, 폴리곤 2의 깊이는 $z_2 = 0.5$가 된다.
- 0.8이 0.5보다 카메라에서 더 멀리 떨어져 있으므로, 폴리곤 1을 먼저 그리고 그 위에 폴리곤 2를 그려야 한다.
- 2. 영역별 Color Buffer 계산 (배경색 0.0 가정)
- 알파 블렌딩 공식 $C = \alpha \cdot c + (1-\alpha) \cdot C_{background}$ 를 적용하여 계산한다. (공란인 초기 배경색은 편의상 0.0으로 가정한다.)
- 영역 A (폴리곤 1만 존재하는 공간):
- $C_A = 0.8 \times 1.0 + (1 - 0.8) \times 0.0 = 0.8$
- Color buffer 값: 0.8
- 영역 B (폴리곤 2만 존재하는 공간):
- $C_B = 0.2 \times 0.5 + (1 - 0.2) \times 0.0 = 0.1$
- Color buffer 값: 0.1
- 영역 C (폴리곤 1과 2가 겹치는 공간):
- 폴리곤 1이 먼저 렌더링되어 해당 위치의 색상은 0.8이 된 상태가 된다.
- 그 위에 폴리곤 2를 렌더링하며 기존 색상(0.8)과 블렌딩한다.
- $C_C = 0.2 \times 0.5 + (1 - 0.2) \times 0.8 = 0.1 + (0.8 \times 0.8) = 0.1 + 0.64 = 0.74$
- Color buffer 값: 0.74
- 1. 렌더링 순서 결정 (Back-to-Front)
** 2025-1 중간고사 **


- 정답:
- (a) z-test에서 처리하는 올바른 순서
- 1. 불투명한 객체 선별: $\alpha = 1.0$인 프래그먼트를 찾는다.
- $f_3$ ($z = 0.1$)
- $f_4$ ($z = 1.0$)
- 불투명한 객체들 사이의 렌더링 순서는 Z-버퍼링에 의해 자동으로 가려짐 처리가 되므로 순서가 무관하다.
- 2. 투명한 객체 선별 및 정렬: $\alpha < 1.0$인 반투명 프래그먼트를 찾고, $z$값이 큰 것(먼 것)부터 작은 것(가까운 것) 순서로 정렬한다.
- 투명한 프래그먼트: $f_1$ ($z=0.6$), $f_2$ ($z=0.4$), $f_5$ ($z=0.8$)
- Back-to-front 정렬: $f_5 \rightarrow f_1 \rightarrow f_2$
- 따라서 올바른 순서는 불투명한 객체들을 먼저 처리하고, 정렬된 투명한 객체들을 나중에 처리하는 순서이다.
$f_3, f_4$ (순서 무관) $\rightarrow f_5 \rightarrow f_1 \rightarrow f_2$
- 1. 불투명한 객체 선별: $\alpha = 1.0$인 프래그먼트를 찾는다.
- (b) 이 픽셀의 최종 색상
- 1. 초기 상태: Z-buffer의 초기값은 1.0이다.
- 2. 불투명한 객체 렌더링: $f_4(z=1.0)$가 그려진다.
- $f_3(z=0.1)$가 그려진다. $0.1 < 1.0$이므로 Z-test를 통과하고, Z-buffer의 값은 0.1로 갱신된다. Color buffer는 $f_3$의 색상인 $(0.0, 0.0, 1.0)$이 된다.
- 3. 투명 객체 렌더링 (Z-test 실패):
- 이후 순서대로 $f_5(z=0.8)$, $f_1(z=0.6)$, $f_2(z=0.4)$가 렌더링 파이프라인에 들어온다.
- 하지만 현재 Z-buffer에 기록된 가장 가까운 깊이 값은 불투명한 $f_3$가 남긴 0.1이다.
- 나머지 세 개의 투명 프래그먼트들은 모두 $z$값이 0.1보다 크기 때문에(카메라에서 더 멀리 있기 때문에) Z-test를 통과하지 못하고 즉시 폐기(discard)된다.
- 결과적으로 투명한 객체들은 가장 앞에 있는 불투명 객체 $f_3$에 의해 완전히 가려져 알파 블렌딩 연산조차 발생하지 않는다. 최종 픽셀 색상은 $f_3$의 색상인 $(0.0, 0.0, 1.0)$이 된다.
- 추가적인 문제: 만약 $f_3$의 $z$ 값이 $0.5$인 경우
- 1. 렌더링 순서
- $f_3$의 $z$값이 0.5로 바뀌더라도 투명한 객체들($f_1, f_2, f_5$)의 고유한 $z$값은 그대로 유지된다. 따라서 투명 객체들을 카메라에서 먼 순서대로 정렬하는 Back-to-front 순서($f_5 \rightarrow f_1 \rightarrow f_2$)는 전혀 변하지 않게 된다.
- 2. Z-test 통과 여부
- 불투명 객체인 $f_3(z=0.5)$와 $f_4(z=1.0)$가 먼저 렌더링되면 Z-버퍼의 최전방 깊이 값은 0.5로 갱신된다. 이후 투명 객체들이 들어올 때, $f_5(z=0.8)$와 $f_1(z=0.6)$은 Z-버퍼의 0.5보다 뒤에 있으므로 시야에서 가려져 가차 없이 폐기(Discard)된다. 오직 $z=0.4$인 $f_2$만이 0.5보다 카메라에 더 가까이 있으므로 유일하게 Z-테스트를 통과하여 화면에 그려지게 된다.
- 3. 최종 색상(Alpha Blending) 계산
- 결과적으로 최종 픽셀의 색상은 불투명한 $f_3$를 바탕(Background)으로 삼고, 그 위에 반투명한 $f_2$를 덮어씌우는 공식으로 도출된다.
- $C_{dst}$ (배경이 되는 $f_3$의 색상) = $(0.0, 0.0, 1.0)$
- $C_{src}$ (새로 그려지는 $f_2$의 색상) = $(0.0, 1.0, 1.0)$
- $\alpha$ ($f_2$의 투명도) = 0.5
- $C = 0.5 \times (0.0, 1.0, 1.0) + (1 - 0.5) \times (0.0, 0.0, 1.0)$
- $C = (0.0, 0.5, 0.5) + (0.0, 0.0, 0.5)$
- $C = (0.0, 0.5, 1.0)$
- 결과적으로 최종 픽셀의 색상은 불투명한 $f_3$를 바탕(Background)으로 삼고, 그 위에 반투명한 $f_2$를 덮어씌우는 공식으로 도출된다.
- 1. 렌더링 순서
- (a) z-test에서 처리하는 올바른 순서
728x90
'4. University Study > Multimedia' 카테고리의 다른 글
| [Multimedia] Lecture 9. Lighting (0) | 2026.04.04 |
|---|---|
| [Multimedia] Lecture 8. Texturing (0) | 2026.04.03 |
| [Multimedia] Lecture 5. Vertex Shader (0) | 2026.03.22 |
| [Multimedia] Lecture 4. Geometric Transformations (1) | 2026.03.15 |
| [Multimedia] Lecture 2. Modeling (0) | 2026.03.14 |
