Skip to content

3D 그래픽 개념 및 렌더링 파이프라인(4)

[칼럼 핵심 요약]
「래스터라이즈 처리」에 의해 생성된 픽셀 단위의 셰이딩(Shading)의 일을 해내는 것이 픽셀 쉐이더이다. 또한, 렌더링 백엔드까지를 포함한 프레임 전체를 「픽셀 파이프라인」이라고 부르는 경우가 있다. 그 픽셀 쉐이더로 행하는 계산이지만, 실은 단위가 픽셀이 된 것만으로, 실시하는 처리 내용 그 자체는 버텍스 쉐이더와 비슷한 부분이 많다.

🌐 원문 링크: 3Dグラフィックスの概念とレンダリングパイプライン(4) (Mynavi News)
📅 원문 발행일: 2008-04-11 | ✍️ 저자: 西川善司 (니시카와 젠지 / Zenji Nishikawa)

NOTE

💡 현대 그래픽스 관점에서의 발전사 (Modern Retrospective)

  • 전통적 파이프라인의 재편: 버텍스 셰이더 → 지오메트리 셰이더 → 래스터라이저로 이어지던 전통적 파이프라인은 DX12 Ultimate / Vulkan에서 태스크 셰이더(Amplification/Task Shader) → 메시 셰이더(Mesh Shader) 파이프라인으로 대체되어, 지오메트리 컬링과 LOD 처리를 GPU 코어에서 고도로 병렬화하고 있습니다.
  • Draw Call 오버헤드 해소: 과거 CPU 병목의 주원인이었던 드로우 콜(Draw Call)은 모던 저수준 API(Vulkan, DirectX 12, Metal)의 바인드리스(Bindless) 렌더링과 GPU 구동 파이프라인(ExecuteIndirect / GPU-Driven Rendering)을 통해 수만 단위의 드로우를 단일 명령으로 처리합니다.

📖 본문 해설

[원문 리드문] > 「래스터라이즈 처리」에 의해 생성된 픽셀 단위의 셰이딩(Shading)의 일을 해내는 것이 픽셀 셰이더다. 또한, 렌더링 백엔드까지를 포함한 프레임 전체를 「픽셀 파이프라인」이라고 부르는 경우가 있다. 그 픽셀 쉐이더로 행하는 계산이지만, 실은 단위가 픽셀이 된 것만으로, 실시하는 처리 내용 그 자체는 버텍스 쉐이더와 비슷한 부분이 많다.

그림 1: GPU 내부의 렌더링 흐름그림 1: GPU 내부의 렌더링 흐름

픽셀 단위의 셰이딩(Shading)를 실시하는 픽셀 셰이더~텍스처는 화상 텍스처만이 아니다

[7]의 「래스터라이즈 처리」에 의해 생성된 픽셀 단위의 셰이딩(Shading)의 일을 해내는 것이 [8][9]로 나타나는 픽셀 셰이더(Pixel Shader)이다. 또한, 렌더링 백엔드까지를 포함한 프레임 전체를 「픽셀 파이프라인」이라고 부르는 경우가 있다.

GPU에 의해 그 실장 형태는 다양하고, [8]의 픽셀 단위의 다양한 셰이딩(Shading)를 실시하는 기능 블록 편만을 굳이 「픽셀 쉐이더」라고 부르는 경우도 있고, 후술하는 「텍스처 유닛」의 [9]를 뒤집어 픽셀 쉐이더라고 부르기도 한다.

그런데, 그 [8]의 픽셀 쉐이더로 행하는 계산이지만, 실은 단위가 픽셀이 된 것만으로, 실시하는 처리 내용 그 자체는 버텍스 쉐이더와 비슷한 부분이 많다.

픽셀 단위에서도, 광원 벡터, 시선 벡터, 및 그 픽셀에 있어서의 노멀 벡터를 이용하여 반사 방정식을 풀어, 그 픽셀가 몇 색이 되는지를 구하는 「픽셀 단위의 라이팅」을 계산하게 된다.

그 경우, 버텍스 단위의 라이팅 결과를 단지 보간하여 그 픽셀색으로 하는 간이적인 라이팅보다도 부드러운 음영이나 아름다운 하이라이트를 낼 수 있게 된다. 이것을 특히 「퍼 픽셀 라이팅」(Per Pixel Lighting)이라고 부르기도 한다.

버텍스 셰이더에서 구한 텍스처 좌표를 바탕으로 텍스처에서 텍셀을 읽는 것이 [9]의 텍스처 유닛이다.

이 텍스쳐 유닛으로부터 추출한 텍셀 색과, 이전에 구한 픽셀 단위의 셰이딩(Shading) 결과로부터 구한 픽셀 색의 양쪽을 배려하여, 최종적인 픽셀 색으로 한다.

이 픽셀 셰이더로 실행시키는 셰이더 프로그램이 픽셀 셰이더 프로그램으로, 그 고안에 따라 그 픽셀 단위의 라이팅을 특수한 것으로 할 수 있다.

통상 「텍스처」라고 하면, 폴리곤에 붙이는 화상을 연상하지만, 현재의 프로그래머블 쉐이더 시대에서는, 그 응용의 되는 방법이 확장되어 왔고, 무려 텍스처에, 화상이 아닌 수학적(혹은 물리적인) 의미를 가지는 다양한 수치 데이터를 넣어 두는 활용이 대두해 온 것이다. 픽셀 쉐이더로 픽셀 단위로 셰이딩(Shading)를 행할 때에는, 그 수치 텍스처로부터 수치 데이터 순차적으로 꺼내 계산에 이용하게 된다.

텍스처도 PC 화면의 픽셀(픽셀)이 αRGB 각 8비트로 이루어져 있는 것과 정확히 같은 이굴로 αRGB의 4가지 색 요소로 이루어져 있다. 예를 들면 32비트 컬러의 텍스처라면 α(투명도) 8비트, R(적색) 8비트, G(녹색) 8비트, B(파랑) 8비트라는 배분이 되어 있다. 수치 데이터를 텍스처에 넣는 경우, αRGB의 4요소에 넣는 것을 생각하면 최대 4요소의 벡터나 행렬을 격납할 수 있다. 예를 들면 3차원 벡터라면, 그 X, Y, Z의 3요소의 수치를 αRGB의 RGB에 넣어 격납해 둘 수 있는 것이다.

실제의 픽셀 쉐이더의 처리에서는, 이 벡터 텍스처로부터 적당한 텍셀을 꺼내 이것을 벡터 데이터로 해, 시선 벡터, 광원 벡터, 노멀 벡터 등과 조합해 특수한 반사 방정식을 풀어, 독특한 재질 표현을 실현한다.

도 6에서는 노멀 벡터를 텍스처에 넣은 「노멀 맵」을 이용한 범프 맵핑의 예를 나타낸다. 이것은 이후의 연재 속에서 다시 한번 해설하기 때문에, 여기서는 「픽셀 쉐이더의 일은 이런 느낌이다」라는 것을 알면 좋을 것이다. (계속)

그림 6: 픽셀 셰이더 작업의 예--범프 매핑이 완성될 때까지의 개념도. 높이 맵에서 노멀 맵으로의 변환도 픽셀 셰이더에서 수행할 수 있습니다. 노멀 맵은 노멀 벡터를 저장한 텍스처로, 텍셀당 1개의 XYZ로 표현되는 3차원의 노멀 벡터값이 저장되어 있다.그림 6: 픽셀 셰이더 작업의 예--범프 매핑이 완성될 때까지의 개념도. 높이 맵에서 노멀 맵으로의 변환도 픽셀 셰이더에서 수행할 수 있습니다. 노멀 맵은 노멀 벡터를 저장한 텍스처로, 텍셀당 1개의 XYZ로 표현되는 3차원의 노멀 벡터값이 저장되어 있다.

🔍 [인포그래픽 도해 한국어 번역: 범프 매핑이 완성될 때까지의 픽셀 처리 과정]

  1. 하이트맵 (흑백 요철): 픽셀 간의 높낮이 차이를 미분
  2. 노멀 맵 (RGB 색상): 미분된 경사면의 3차원 법선 벡터 (Nx,Ny,Nz)를 RGB로 부호화
  3. 탄젠트 공간 변환: 표면 로컬 좌표계에서 광원 벡터와의 내적(NL) 계산
  4. 최종 픽셀 출력: 평면 폴리곤 위에 입체적인 음영 하이라이트 형성

(트라이Z 니시카와 젠지)


🔗 연관 지식 베이스 (Wiki)

Based on Zenji Nishikawa's 3D Graphics Maniax series. Translated & Knowledge-Based for Korean Game Developers.