[Rendering] Vertex Shading, Rasterization, Fragment Shading

How do Video Game Grpahics Work? 유튜브 영상을 정리하였습니다.

• 본 포스트를 통해 Computer Graphics의 모든 파이프라인을 대략적으로 이해할 수 있습니다.

model space -> world space -> camera space -> view screen

z buffer, depth buffer

• lowest z value를 가지는 triangle만 screen에 표시됩니다.

• image of the z 혹은 depth buffer로 불리우는 이미지는 아래와 같습니다.
• triangle이 3차원 공간에 존재하므로 triangle의 3개의 vertices도 보통 서로 다른 값을 가지게 됩니다.
• 이때, triangle 내부의 z value은 3개의 vertices로 interpolation하여 얻습니다.
• 그러고나면 triangle끼리에서도 z value가 작은 것이 screen에 표시됩니다.

pixel fragment, Shading

• As a reminder, fragments are groups of pixels formed from a single rasterized triangle.
• 만약 각 pixel fragments에 대해 같은 color를 적용하면 realistic하지 않습니다.
• shading을 적용하여 아래는 검정색 위는 하얀색으로 만들거나
• 그리고 specular highlights를 더하고
• shininess를 더하여 lights가 surface에서 bounce off하게 하면
• realistic train을 얻습니다.

framgent shading(=triangle shading)

• 그럼 실제로 shading이 어떻게 진행되는지 알아봅시다.
• 기본적으로 surface가 light source를 directly하게 pointing at하면 밝아집니다.

• 반대로 surface가 light source와 perpendicular하거나 반대방향에 있으면 어두워집니다.

• direction of the light, direction of triangle’s surface을 가지고 계산합니다.

surface normal

• 아시다시피 아래 train은 762,000개의 flat triangle로 이루어져있습니다.
• 그리고 triangle들은 다른 방향을 바라보고 있고, 각각의 triangle이 바라보는 방향을 surface normal이라고 합니다.

surface normal과 light source로 cosine 계산

• cos(θ)에 light intensity와 material의 color를 곱해줘서 properly shaded된 triangle을 얻습니다.

• 90도에서 270도 사이까진 cos값이 음수이고, RGB color는 음수로 쓸 수 없으므로, minimum을 0으로 제한합니다.
• 하지만 0으로 제한하더라도, 이 90도에서 270도 사이로 light source에 대해 돌아간 triangle은 pitch-black surface를 가집니다.
• 즉, triangle의 표면이 매우 어두워 빛을 아예 반사하지 않게 되어 이상해보입니다.
• 이를 해결하기 위해 Ambient light intensity와 surface color를 곱한 값을 더해줍니다.

각 triangle에 대해선 다양한 light source와의 계산 결과를 더해줍니다.

• limit the influence of lights을 하여, computational burden을 GPU에서 덜어내기도 합니다.

flat shading, smooth shading

• fragment shading에서 지금 문제는 object에서 triangle들이 오직 하나의 single normal을 가진다는 점입니다.

• 그러므로 각 traingle은 triangle surface를 따라 같은 color를 가지게 됩니다.

• 이와 같은 경우를 flat shading이라고 하며, curved surfaces에서 unrealistic하게 보입니다.

• 따라서, smooth shading을 하기 위해서는 surface normals을 사용하는 대신에, 인접한 triangle의 normal의 평균을 사용하여 각 vertex에 대한 하나의 normal을 계산합니다.

• 인접한 triangle의 (surface) normal의 평균으로부터 계산된 vertex normal들은 다음과 같습니다.

• 다음으로, triangle의 surface 전체에 걸처 smooth한 normal의 gradients를 생성하기 위해 barycentric coordiantes를 사용합니다.

• 시각적으로는 triangle 전체에 걸쳐 3가지 다른 색상을 섞는 것과 비슷하지만, 대신 3개의 vertex normal directions을 사용합니다.

• 주어진 fragment에 대해 각 픽셀의 중심을 잡고, vertex normal과 pre-rasterized triangle의 좌표를 사용하여 해당 픽셀의 barycentric normal을 계산합니다.

• 삼각형 전체에 걸쳐 세 가지 색상을 섞는 것과 마찬가지로, 이 픽셀의 normal은 삼각형의 세 vertex normal을 각 정점에서의 barycentric 좌표에 따라 비율에 맞게 혼합한 것입니다.

• 그 결과, 삼각형 집합을 사용하여 곡면을 형성할 때 각 픽셀은 normal의 gradient의 일부가 되어 픽셀 단위로 색상이 변하며 표면 전체에 걸쳐 부드러운 shading이 생성됩니다.