픽셀 아트 배경·타일 만들기 — 이어지는 심리스 타일셋

2026년 6월 15일

캐릭터는 그릴 줄 알게 됐는데 막상 게임 화면을 채우려니 막막한 순간이 옵니다. 넓은 잔디밭, 돌바닥 던전, 흐르는 강물 같은 배경 말입니다. 다행히 픽셀 아트 배경은 큰 그림 한 장을 통째로 그리는 것이 아니라, 작은 타일 한 칸을 만들어 바둑판처럼 반복해 까는 방식으로 만듭니다. 그래서 핵심 기술은 "넓게 그리기"가 아니라 "가장자리가 자연스럽게 이어지는 작은 타일 한 칸을 그리기"입니다. 이 글에서는 16×16 타일 규격부터 이음매가 보이지 않는 심리스(seamless) 타일, 여러 타일을 묶은 타일셋 구성, 배경에 깊이를 주는 방법까지 순서대로 정리합니다.

타일과 타일셋이란 무엇인가

타일(tile)은 배경을 이루는 정사각형 그림 조각 한 칸입니다. 잔디 한 칸, 돌바닥 한 칸이 각각 타일입니다. 게임 엔진은 이 작은 타일을 격자에 반복해 깔아 넓은 맵을 만듭니다. 같은 잔디 타일 100개를 깔면 잔디밭이, 사이사이 길 타일을 끼우면 오솔길이 생기는 식입니다. 이렇게 한 세트로 모은 타일 묶음을 타일셋(tileset)이라고 합니다.

타일 방식의 장점은 분명합니다. 작은 칸 몇 개만 그리면 무한히 넓은 맵을 채울 수 있고, 용량도 작으며, 맵을 수정할 때 타일만 바꿔 끼우면 됩니다. 클래식 게임의 광활한 월드가 사실은 수십 칸의 타일을 재배치해 만든 것입니다. 그래서 배경 작업의 승부는 "타일 한 칸을 얼마나 잘, 그리고 얼마나 잘 이어지게 만드느냐"에 달려 있습니다.

1. 타일 크기를 정한다 — 16×16이 표준

타일의 표준 규격은 16×16입니다. 캐릭터 스프라이트가 16이나 32 단위로 만들어지는 것과 맞물려, 16×16 타일은 거의 모든 2D 게임에서 기본값처럼 쓰입니다. 픽셀아트 메이커 상단의 "16×16 타일" 프리셋을 누르면 타일 작업에 맞는 캔버스 크기와 확대 배율이 한 번에 설정됩니다.

• 16×16 — 가장 무난한 표준. 잔디·바닥·벽돌 같은 기본 지형 타일에 적합합니다.
• 32×32 — 큰 바위, 나무, 건물 일부처럼 디테일이 필요한 오브젝트 타일용.
• 8×8 — 아주 작은 패턴이나 미니멀한 레트로 배경용.

한 가지 규칙만 기억하세요. 한 게임의 타일 크기는 모두 같은 격자 단위로 통일해야 합니다. 16×16 타일과 32×32 타일을 섞더라도, 32 타일은 16 칸 네 개를 합친 크기여야 격자가 어긋나지 않습니다. 타일 작업 전에 도트 기본기가 필요하다면 픽셀 아트 입문 가이드에서 도구 사용법을 먼저 익히고 오는 것을 추천합니다.

2. 심리스 타일의 핵심 — 가장자리를 맞춘다

타일 작업의 가장 중요한 개념이 심리스(seamless), 즉 "이음매 없이 이어지는" 타일입니다. 타일은 좌우·상하로 반복해 깔리므로, 타일의 왼쪽 끝과 오른쪽 끝, 위쪽 끝과 아래쪽 끝이 서로 맞물려야 여러 칸을 깔았을 때 경계가 보이지 않습니다.

원리는 이렇습니다. 타일 오른쪽 가장자리에서 튀어나온 무늬는 그 옆에 깔릴 타일의 왼쪽 가장자리에서 이어받아야 합니다. 쉽게 말해 오른쪽 끝과 왼쪽 끝이 한 쌍으로 연결되도록 그려야 합니다. 위아래도 마찬가지입니다. 이 규칙을 어기면 타일을 깔 때마다 일정한 간격으로 선이 보여, 마치 욕실 타일의 줄눈처럼 격자가 도드라집니다.

픽셀아트 메이커로 심리스 타일을 만드는 실전 순서는 다음과 같습니다.

• 가운데부터 그린다 — 타일 중앙에 무늬(잔디 잎, 돌 틈)를 먼저 배치합니다. 가장자리는 비워 둡니다.
• 가장자리를 가로질러 그린다 — 무늬가 오른쪽 끝에 닿으면, 그 무늬가 왼쪽 끝에서 잘려 이어지도록 왼쪽 끝에도 같은 무늬의 나머지 절반을 그립니다. 위쪽 끝에 닿는 무늬는 아래쪽 끝에 나머지를 그립니다.
• 이어붙여 확인한다 — 완성한 타일을 PNG로 저장한 뒤, 가져오기로 더 큰 캔버스(예: 48×48)에 깔아 보거나 이미지 뷰어에서 나란히 두고 경계가 보이는지 점검합니다.

가장 흔한 실수는 가장자리 바로 안쪽에 눈에 띄는 무늬를 몰아넣는 것입니다. 그러면 타일을 반복했을 때 그 무늬가 일정 간격으로 줄지어 나타나 "반복되는 티"가 납니다. 도드라지는 요소는 타일 중앙 쪽에 두고, 가장자리에는 잔잔한 결만 흘리듯 배치하세요.

3. 기본 지형 타일 그리는 요령

심리스 원리를 가장 많이 쓰는 것이 잔디·돌·물 같은 기본 지형 타일입니다. 재질마다 요령이 조금씩 다릅니다.

• 잔디·흙 — 바탕을 기본색으로 채운 뒤, 조금 밝은 색과 어두운 색 점을 불규칙하게 흩뿌립니다. 점이 일정한 간격으로 정렬되면 인공적으로 보이니, 위치를 어긋나게 찍는 것이 핵심입니다.
• 돌바닥·벽돌 — 칸을 나누는 줄눈을 어두운 색으로 긋고, 각 돌의 윗면은 밝게·아랫면은 어둡게 칠해 입체감을 줍니다. 줄눈이 타일 가장자리에서 다음 타일로 자연스럽게 이어지도록 위치를 맞추세요.
• 물 — 가로로 긴 밝은 선 몇 개를 물결처럼 흩어 놓으면 수면이 됩니다. 가로 방향이라 좌우 이음매를 특히 신경 써야 합니다.

지형 타일은 보통 3~4색이면 충분합니다. 밝음·기본·어둠 세 단계에 강조용 한 색 정도입니다. 색을 고르는 원리(휴 시프트, 컬러 램프)는 색 조합 가이드가 그대로 도움이 됩니다. 같은 잔디라도 무늬 위치만 살짝 다른 타일을 2~3종 만들어 번갈아 깔면, 한 가지 타일만 반복할 때 생기는 단조로움을 크게 줄일 수 있습니다.

4. 타일셋으로 모으고 연결 타일을 만든다

지형 한 종류만으로는 맵이 밋밋합니다. 잔디와 길, 잔디와 물처럼 두 지형이 만나는 경계를 이어 주는 타일이 필요합니다. 잔디 한가운데에 길이 지나가려면, 길의 직선 구간뿐 아니라 모서리에서 꺾이는 타일, 잔디와 닿는 가장자리 타일이 따로 있어야 합니다. 이런 연결 타일까지 갖춰야 비로소 자연스러운 맵을 깔 수 있습니다.

여기서 대칭을 활용하면 작업이 크게 줄어듭니다. 예를 들어 길의 왼쪽 가장자리 타일을 완성했다면, 좌우반전 기능으로 오른쪽 가장자리 타일을 즉시 만들 수 있습니다. 위쪽 가장자리를 상하반전하면 아래쪽 가장자리가 되고, 90° 회전으로 가로 길을 세로 길로 돌릴 수 있습니다. 한쪽 모서리만 정성껏 그리고 반전·회전으로 나머지 세 모서리를 채우면, 사방으로 이어지는 연결 타일 한 세트가 정확하게 완성됩니다.

여러 타일을 만들 때는 칸 크기를 모두 똑같이 맞추고, 완성한 타일을 "프로젝트 저장"으로 하나씩 브라우저에 보관해 두세요. 게임 엔진에서는 이 타일들을 한 장의 이미지에 격자로 모은 타일셋 시트 형태로 묶어 쓰는 것이 일반적입니다. 처음부터 모든 타일의 크기를 통일해 두면 나중에 시트로 합치기가 훨씬 수월합니다.

5. 배경에 깊이를 준다 — 레이어와 패럴랙스

바닥 타일만 깔면 배경이 평평합니다. 깊이를 주려면 배경을 여러 층(레이어)으로 나눠 생각하세요. 가장 멀리 하늘이나 먼 산, 그 앞에 나무나 건물, 가장 앞에 캐릭터가 밟는 바닥 타일이 놓이는 식입니다.

• 멀수록 흐릿하고 차분하게 — 먼 배경은 채도와 대비를 낮추고 푸른 기를 더하면 멀어 보입니다. 가까운 사물일수록 또렷하고 진하게 그립니다. 이것을 대기 원근이라고 합니다.
• 층마다 디테일을 줄인다 — 먼 산은 실루엣과 큰 덩어리만, 가까운 풀숲은 잎 하나하나까지 묘사하면 거리감이 살아납니다.
• 패럴랙스를 염두에 둔다 — 게임에서는 카메라가 움직일 때 먼 배경이 느리게, 가까운 배경이 빠르게 흐르도록 층마다 다른 속도로 스크롤합니다. 이를 패럴랙스(parallax)라고 하며, 평면 배경에 입체적인 깊이를 만듭니다. 그래서 배경 층은 처음부터 따로따로 그려 각각 투명 배경 PNG로 내보내는 것이 좋습니다.

넓은 하늘이나 노을처럼 완만한 그라데이션이 필요한 면에는 두 색을 체스판 패턴으로 교차시키는 디더링을 제한적으로 쓸 수 있습니다. 다만 좁은 면에 남용하면 지저분해지니 넓은 배경에만 아껴 쓰세요.

6. 게임에 넣기 — 투명 배경 PNG로 내보내기

완성한 타일과 배경 층은 투명 배경을 켠 상태에서 PNG로 저장합니다. 바닥 위에 올라가는 나무·바위 같은 오브젝트 타일은 투명 영역이 있어야 아래 타일이 비쳐 보이기 때문입니다. 게임 엔진에서 타일맵을 쓸 때는 텍스처 필터를 반드시 "Point/Nearest"로 설정해야 타일 경계가 뭉개지지 않고 또렷하게 유지됩니다.

문서나 웹, SNS에 배경 이미지를 바로 쓸 일이 있다면 PNG ×4·×8 고화질 저장을 활용하면 확대해도 픽셀이 선명합니다. 캐릭터 스프라이트도 함께 만들 계획이라면 게임 스프라이트 만들기 가이드의 내보내기 부분을 같이 참고하세요. 사진을 가져와 배경 소스로 다듬고 싶다면 사진을 픽셀 아트로 변환하는 방법이 도움이 됩니다.

타일·배경 점검 체크리스트

• 타일을 좌우·상하로 반복해 깔았을 때 이음매(경계선)가 보이지 않는가
• 도드라지는 무늬가 가장자리가 아니라 타일 중앙 쪽에 있는가
• 잔디·바닥 같은 지형을 무늬만 다른 2~3종으로 만들어 단조로움을 줄였는가
• 경계를 잇는 연결 타일을 반전·회전으로 한 세트 갖췄는가
• 배경 층마다 거리감(흐림·대비·디테일)이 다르게 표현됐는가
• 각 타일·층을 투명 배경 PNG로, 칸 크기를 통일해 내보냈는가

여섯 항목을 통과했다면 그 타일셋은 맵에 깔 준비가 된 것입니다. 배경이 받쳐 주면 같은 캐릭터도 한결 살아 보입니다. 선이 자꾸 우는 것이 고민이라면 선 깔끔하게 그리는 법 가이드를 함께 읽어 보세요.