게임 콘텐츠의 제작 원리 2-5. 텍스쳐매핑

1. 무게 중심 좌표의 활용

삼각형 칠하기

 

무게 중심 좌표

• 삼각형 외부에 있는지, 내부에 있는지 파악
• 삼각형 내부에서 해당 픽셀이 삼각형의 각 꼭짓점 P1,2,3에 얼마나 영향을 받는지를 나타내는 데에도 사용될 수 있다.

정점(Vertex)

각 점에 위치와 더불어 부가적인 데이터를 부여한다.

그 데이터들을 선형 보간해서 삼각형 내부를 다양하게 꾸밀 수 있다.

 

---

2. Texture Mapping

위와 같은 특징들을 사용해 할 수 있는 것 중 대표적인 것.

 

이미지(Texture)를 불러 들여서 삼각형을 채우는 데 사용하는 기법.

삼각형은 벡터 세 개로 조합해서 만들어진 논리적인 영역을 말한다.

 

대부분의 이미지 프로그램(포토샵)등이 사용하는 픽셀 좌표계가 아닌, 

수학적으로 사용하는 데카르트 좌표계를 사용해서 이미지를 표현해야 하는데

 

UV 좌표 = 가로, 세로 범위를 [0,1]인 2차원 벡터로 관리한다. 

 

uv좌표계를 활용해서 각 좌표랑 삼각형이 1:1로 매칭되는 시스템,

즉 삼각형을 실제로 화면에 표현하기 위한 픽셀화(Rasterization)을 하는 과정에서

데카르트 좌표는 스크린 좌표로 옮겨지는데,

여기에 대응되는 텍스쳐 또한 uv좌표를 통해 해당 무게중심좌표에 대응하는 색상을 얻어서 적용해주어야 한다. 

 

 

---

Pixel이란?

 

화면을 구성하느 단위와 텍스쳐에 사용되는 이미지의 단위 모두 넓은 의미에서 픽셀이라고 하지만, 렌더링 과정에서는 다음과 같이 용어르 구분한다.

• 텍셀(Texel): 텍스쳐 이미지의 구성 단위
• 픽셀(Pixel): 모니터 화면의 구성 단위

여기서 삼각형이 그릴 픽셀 영역과 텍스쳐가 제공하는 텍셀의 영역 크기는 다르기 때문에,

텍셀의 정보를 얻어 픽셀에 전달하는 과정에서 몇 가지 고려사항이 발생하게 된다.

 

---

Texel > Pixel (확대)

픽셀에 대응되는 텍셀이 더 큰 경우

• Nearest-neighbor interpolation: 가장 가까운 텍셀의 색상 정보를 그대로 가져오기
• Bilinear-interpolation: 해당 uv좌표를 둘러싼 네 개의 텍셀의 색상 값을 파악하고, 이를 보간해 최종 색상 구하기

보통 filter mode의 옵션에서 제공한다.

 

얼굴 텍스처를 가져와서 붙인다고 했을 때

---

 

Texel < Pixel (축소)

 

하나의 픽셀을 결정하기 위해 선택할 수 있는 텍셀이 여러 개가 된다면, aliasing 발생 가능!

축소된 이미지를 미리 만들어 놓고 이를 활용하는 방법을 사용한다.

 

 

밉맵(Mipmap) : 인위적으로 축소된 텍스처

mipmap쓸지 말지 결정 가능

 

이걸 넣어서 추출하면 용량이 좀 늘긴 하지만, 멀리있는 이미지를 그릴때 효과적으로 그릴 수 있으므로 (그래픽 처리가 빨라진다)괜찮다.

 

 

Trilinear Interpolation

 

물체가 카메라로부터 지정한 거리만큼 떨어진다면

밉맵으로 생성된 텍스처 중 하나를 선택해 원 이미지 대신 이를 사용한다.

밉맵은 어찌보면 깊이에 따라 적용되는 점점 작아지는 이미지 소스라고 할 수 있따. 

밉맵까지 고려해 3차원으로 보간해 픽셀을 계산한 방식을 Trilinear Interpolation이라고 한다.

 

Anisotropic Filtering: 삼각형이 카메라에 비스듬히 배치된 경우

 

이러한 보간을 진행해도 면이 카메라에 비스듬히 배치된 경우에는 선형 보간을 사용해 해당 장면을 깨끗하게 표현하기가 쉽지 않다.

이때 비스듬히 표현된 이미지들을 별도로 모아서 대신 제공하는 방식을 비등방성(Anisotropic)필터링이라고 한다.