밉맵과 텍스처 필터링: 멀리 있는 그림이 지글거리지 않는 비밀

게임을 하다가 멀리 있는 바닥을 본 적 있나요?

어떤 게임에서는 멀리 있는 타일 바닥이 지글지글 떨립니다. 물결무늬 같은 이상한 줄무늬가 생기기도 하지요. 그런데 잘 만든 게임에서는 멀리 있는 바닥도 부드럽고 깨끗합니다.

그 차이를 만드는 주인공이 바로 오늘 배울 밉맵(Mipmap)입니다. 기초부터 하나씩 차근차근 알아봅시다.

1. 텍스처가 뭐였더라?

먼저 텍스처부터 짚고 갑시다.

3D 게임 속 물건들은 사실 뼈대(폴리곤)만 있으면 밋밋한 회색 덩어리입니다. 여기에 그림을 붙여야 나무는 나무처럼, 벽돌은 벽돌처럼 보입니다. 이 붙이는 그림이 텍스처입니다.

스티커를 상상하면 쉽습니다. 상자에 벽돌 무늬 스티커를 붙이면 벽돌 상자처럼 보이는 것과 같아요.

2. 문제 발생! 멀리 있는 그림이 지글거려요

텍스처는 보통 큽니다. 예를 들어 1024×1024짜리 그림이라고 해 봅시다. 점(픽셀)이 백만 개가 넘어요.

그런데 이 텍스처를 붙인 바닥이 화면에서 아주 멀리 있으면 어떻게 될까요? 화면에서는 겨우 10×10 정도의 작은 점으로만 보입니다.

백만 개의 점을 100개의 점에 욱여넣어야 하는 상황이 된 거예요.

컴퓨터는 빠르게 그리려고 백만 개 중에서 몇 개만 골라서 씁니다. 그러면 어떤 프레임에서는 벽돌의 흰 줄을 고르고, 다음 프레임에서는 빨간 벽돌을 고릅니다. 그래서 화면이 지글지글 떨리고, 모아레라고 부르는 물결무늬가 생깁니다. 이런 현상을 어려운 말로 앨리어싱이라고 합니다.

3. 밉맵: 작은 그림을 미리 만들어 두자

해결 방법은 의외로 단순합니다.

"멀리서 볼 작은 그림을 미리 만들어 두면 되잖아?"

옷 가게를 떠올려 보세요. 같은 티셔츠라도 S, M, L, XL 사이즈를 미리 만들어 둡니다. 손님이 오면 몸에 맞는 사이즈를 바로 꺼내 주지요.

밉맵도 똑같습니다. 원본 텍스처를 가로세로 절반씩 줄인 그림들을 미리 잔뜩 만들어 둡니다.

• 레벨 0: 1024×1024 (원본)
• 레벨 1: 512×512
• 레벨 2: 256×256
• 레벨 3: 128×128
• … 이렇게 계속 절반씩 줄여서 1×1까지!

물체가 가까우면 큰 그림을, 멀면 작은 그림을 꺼내 씁니다. 작은 그림은 처음부터 정성 들여 부드럽게 줄여 놓은 것이라서, 멀리서 봐도 지글거리지 않습니다.

4. 그림으로 보는 밉맵 피라미드

밉맵을 옆에서 보면 피라미드처럼 생겼습니다. 아래 도식을 봐 주세요.

거리마다 딱 맞는 사이즈가 준비되어 있으니, 컴퓨터는 고민 없이 꺼내 쓰기만 하면 됩니다. 게다가 작은 그림은 점의 개수가 적어서 읽는 속도도 더 빠릅니다. 예쁘고 빠르니 일석이조지요.

5. 텍스처 필터링: 그림을 "어떻게" 꺼내 읽을까

밉맵이 "어떤 사이즈의 그림을 쓸까"라면, 텍스처 필터링은 "그 그림의 색을 어떻게 읽을까"입니다. 크레파스로 색칠하는 방법이 여러 가지인 것처럼, 읽는 방법도 여러 가지가 있습니다.

포인트 필터링 (가장 단순)

제일 가까운 점 하나의 색만 그대로 씁니다. 빠르지만 그림이 계단처럼 각져 보입니다. 도트 게임 느낌을 일부러 내고 싶을 때만 씁니다.

바이리니어 필터링 (부드럽게)

주변 점 4개의 색을 살펴서 중간 색을 만들어 씁니다. 물감 두 색을 섞어 중간 색을 만드는 것과 같아요. 훨씬 부드러워집니다.

트라이리니어 필터링 (경계선까지 부드럽게)

밉맵을 쓰면 한 가지 문제가 남습니다. 레벨 1 그림을 쓰던 바닥이 레벨 2로 바뀌는 지점에서 선이 뚝 끊긴 것처럼 보일 수 있어요. 트라이리니어는 두 레벨의 그림을 동시에 읽어서 섞어 줍니다. 그러면 경계선이 스르륵 자연스럽게 이어집니다.

이방성(어니소트로픽) 필터링 (비스듬한 바닥 전용)

바닥을 거의 눕다시피 비스듬하게 바라보면, 밉맵만으로는 멀리 있는 부분이 뿌옇게 뭉개집니다. 이방성 필터링은 비스듬한 방향을 따라 점을 더 많이 읽어서, 멀리 뻗은 길도 또렷하게 만들어 줍니다. 그만큼 계산은 더 많이 합니다.

6. 밉맵, 써 본 사람이 느끼는 좋은 점과 힘든 점

쓸 때 좋은 점

• 지글거림이 그냥 사라집니다. 멀리 있는 철망, 타일, 잔디에서 생기던 물결무늬가 켜는 순간 없어져요. 눈이 편해지는 게 바로 느껴집니다.
• 공짜에 가깝습니다. 언리얼 같은 엔진에서는 텍스처를 넣으면 밉맵을 자동으로 만들어 줍니다. 내가 축소본을 일일이 그릴 필요가 없어요.
• 오히려 빨라집니다. 멀리 있는 물체는 작은 그림만 읽으니, 그래픽카드가 데이터를 덜 옮겨도 됩니다.

쓸 때 힘든 점

• 메모리를 더 먹습니다. 축소본을 전부 합치면 원본의 약 3분의 1만큼 저장 공간이 더 필요합니다. 텍스처가 수백 장인 프로젝트에서는 이게 은근히 쌓여서 아픕니다.
• 가끔 너무 뿌예집니다. "왜 내 텍스처가 멀리서 흐리멍덩하지?" 하고 몇 시간 헤매다 보면 범인이 밉맵 레벨 선택인 경우가 많아요. 비스듬한 바닥이 특히 그렇고, 이방성 필터링을 켜야 해결됩니다.
• UI나 픽셀아트에는 방해가 됩니다. 또렷해야 할 아이콘이나 도트 그림이 흐려져서, 이런 텍스처는 밉맵을 일부러 꺼 줘야 합니다. 처음엔 이걸 몰라서 당황하기 쉽습니다.
• 타일 반복 무늬 경계에서 이상한 줄이 생기기도 합니다. UV가 갑자기 점프하는 곳에서 컴퓨터가 "엄청 멀어졌구나!" 하고 착각해 제일 작은 밉을 골라 버리거든요. 이런 버그는 원인을 알기 전까지는 정말 찾기 어렵습니다.

7. 언리얼 엔진에서는 어떻게 쓰나요?

언리얼 엔진은 텍스처를 가져오면(임포트) 기본으로 밉맵을 만들어 줍니다. 텍스처를 더블클릭하면 나오는 창에서 이런 것들을 정할 수 있어요.

• Mip Gen Settings: 밉맵을 만들지 말지, 어떤 방식으로 줄일지 정합니다. UI용 텍스처라면 "NoMipmaps"를 고릅니다.
• 필터 방식: 기본은 부드러운 필터링이고, 도트 게임이라면 Nearest(포인트)로 바꿉니다.
• 텍스처 스트리밍: 언리얼은 한 발 더 나가서, 멀리 있는 물체의 큰 밉 레벨은 아예 메모리에 올리지도 않습니다. 필요해지면 그때 불러오지요. 밉맵이 있어서 가능한 절약 기술입니다.

참고로 텍스처 크기를 256, 512, 1024처럼 2의 거듭제곱으로 만드는 습관이 좋습니다. 절반씩 깔끔하게 나누어떨어져야 밉맵이 예쁘게 만들어지거든요.

8. 오늘 배운 것 정리

• 멀리 있는 텍스처를 그냥 그리면 지글거림(앨리어싱)과 물결무늬(모아레)가 생긴다.
• 밉맵은 절반씩 줄인 그림들을 미리 만들어 두고, 거리에 맞는 사이즈를 꺼내 쓰는 기술이다. 옷 가게의 S, M, L 사이즈와 같다.
• 텍스처 필터링은 그림의 색을 읽는 방법이다. 포인트 → 바이리니어 → 트라이리니어 → 이방성 순서로 더 부드럽고 정교해진다.
• 언리얼 엔진은 밉맵을 자동으로 만들어 주지만, UI·픽셀아트는 꺼 주고, 뿌연 바닥은 이방성 필터링으로 살려 주자.

다음에 게임을 할 때 멀리 있는 바닥을 한번 유심히 봐 보세요. 부드럽고 깨끗하다면, 그 뒤에서 밉맵과 필터링이 조용히 일하고 있는 겁니다.