Metlivi 블로그

오버월드와 배틀 스프라이트의 크기 비율을 일관되게 유지하는 방법

오버월드와 배틀 씬에서 캐릭터가 동일한 크기로 느껴지게 하려면, 원본 이미지의 치수만 볼 것이 아니라 화면에 렌더링되는 아트워크의 높이를 비교해야 합니다. 캐릭터의 공통 픽셀 높이 목표치를 설정하고, 일관된 월드 스케일과 픽셀 밀도를 적용한 다음, 동일한 카메라 배율에서 두 씬을 비교하세요. 캐릭터의 발을 공통 기준선에 맞추고 게임의 의도된 디스플레이 크기에서 결과를 확인합니다. 어느 한쪽 씬에서 의도적으로 다른 카메라나 구도를 사용한다면, 스프라이트 크기를 임의로 바꾸는 대신 해당 예외 사항을 기록해 두어야 합니다.

2026년 10월 15일8분 분량작성: Metlivi Editorial Team
섹션 1

게임에 적합한 "동일한 크기"의 기준 정하기

측정 가능한 목표를 정의하는 것부터 시작하세요. 예를 들어, 기준 카메라 뷰에서 두 씬 모두 캐릭터의 발바닥부터 정수리까지 화면 픽셀 기준으로 32픽셀을 차지하도록 결정할 수 있습니다. 이는 예시일 뿐 권장되는 범용 크기가 아니므로, 게임의 해상도와 아트의 디테일 수준에 맞는 크기를 선택해야 합니다.

투명한 이미지 사각형 전체가 아니라 눈에 보이는 캐릭터 본체를 측정하세요. 오버월드 스프라이트에는 그림자, 무기, 더듬이 또는 빈 여백이 포함될 수 있고, 배틀 스프라이트는 포즈가 다를 수 있습니다. 목표치가 머리부터 발끝까지의 신체 실루엣을 측정하는 것인지, 눈에 보이는 전체 아트워크를 측정하는 것인지 결정하고 두 스프라이트 모두에 동일한 규칙을 적용하세요. 목표 높이, 기준 해상도, 의도한 바닥선, 의도적으로 적용한 씬별 차이점을 정리한 작은 참조 문서를 유지하는 것이 좋습니다.

원본 캔버스가 더 크다고 해서 화면 속 캐릭터가 반드시 더 커지는 것은 아니기 때문에 이 정의는 중요합니다. 캔버스 치수는 이미지 영역을 나타내며, 엔진의 임포트 설정, 오브젝트 스케일, 카메라가 해당 영역이 차지하는 디스플레이 픽셀 수를 결정합니다. Aseprite에서는 캔버스 크기 변경과 스프라이트 콘텐츠 크기 조정을 구분하므로, 아트워크를 수정하기 전에 어떤 작업이 필요한지 확인하세요.Aseprite: Sprite Size

섹션 2

각 캔버스 내부의 실제 아트워크 비교하기

오버월드와 배틀 이미지를 원래 픽셀 배율로 열고 정해 둔 측정 방식에 따라 픽셀 수를 세어 보세요. 눈에 보이는 캐릭터의 높이와 발에서 캔버스 가장자리까지의 거리를 기록합니다. 배틀 캐릭터의 가시 픽셀이 48픽셀이고 오버월드 캐릭터가 32픽셀이라면, 엔진에서 씬 스케일링을 적용하기 전 아트워크 비율 차이는 1.5:1이 됩니다.

비율 외의 요소가 동일할 때, 간단한 시작 계산식은 다음과 같습니다: 원하는 렌더링 높이 ÷ 현재 렌더링 높이 = 조정 비율. 예를 들어 스프라이트가 현재 24픽셀 높이로 렌더링되고 있고 32픽셀로 렌더링되어야 한다면, 조정 비율은 32 ÷ 24 = 1.33입니다. 이를 진단용 추정치로 활용한 뒤 아트와 씬 설정을 점검하세요. 이 계산식은 이해를 돕기 위한 예시이며 카메라, 크롭, 트랜스폼의 차이가 없다고 가정한 것입니다.

단지 이미지 파일의 너비와 높이를 맞추기 위해 크기를 조절해서는 안 됩니다. 특정 포즈가 더 넓을 수도 있고, 배틀 애니메이션에서 팔을 올리는 동작이 있을 수도 있습니다. 의도한 형태를 보존하고 동일한 신체 기준점을 비교하세요. 스프라이트의 해부학적 구조나 원근감이 눈에 띄게 다르다면, 픽셀 높이를 맞춰도 여전히 크기가 달라 보일 수 있습니다. 이럴 때는 디자인을 수정하거나 씬별 예외 처리를 협의하세요.

섹션 3

동일한 픽셀 밀도 및 월드 스케일 설정하기

Unity에서는 오버월드와 배틀 스프라이트를 동일한 Pixels Per Unit(PPU)으로 설정하고, Pixel Perfect Camera의 Asset Pixels Per Unit 설정도 이 값과 일치시킵니다. Unity는 PPU를 씬 1단위를 구성하는 픽셀 수로 정의하며, Pixel Perfect Camera 가이드에서는 씬 스프라이트 전반에 걸쳐 공통된 값을 사용할 것을 권장합니다.Unity: 2D Pixel Perfect 예를 들어 프로젝트에서 유닛당 16픽셀을 사용한다면, 32픽셀 높이의 스프라이트는 오브젝트 스케일링 전 월드 단위로 2단위를 차지합니다.

각 캐릭터 오브젝트의 트랜스폼 스케일도 확인하세요. PPU를 일치시켜도 한 씬의 오브젝트가 0.8로 스케일링되고 다른 씬의 오브젝트가 1.0으로 스케일링된 차이를 보정할 수는 없습니다. 일관된 임포트 및 트랜스폼 설정을 유지하고, 구도상 꼭 필요한 경우에만 아트워크를 수정하거나 명확히 기록된 씬별 스케일을 조정하세요.

다른 엔진을 사용하는 경우에도 이에 상응하는 컨트롤을 찾아보세요. 즉, 몇 개의 소스 픽셀이 월드 1단위에 매핑되는지, 노드 또는 오브젝트 스케일은 얼마인지, 카메라의 뷰포트나 줌은 어떠한지 확인해야 합니다. Godot의 2D 렌더링 경로는 화면 크기를 조정할 때 사용되는 스트레치 트랜스폼을 포함하여 캔버스 및 뷰포트 트랜스폼을 포함하므로, 소스 이미지의 치수만으로는 최종 화면 크기를 결정할 수 없습니다.Godot: Viewport and canvas transforms

섹션 4

의도적인 피벗을 통해 발 위치 맞추기

높이가 정확하더라도 씬 간에 캐릭터가 공중에 뜨거나 가라앉거나 위치가 어긋나면 크기가 맞지 않아 보일 수 있습니다. 의미 있는 앵커, 보통 양발 사이의 지면 접촉점에 피벗을 설정한 다음, 두 씬 모두에서 해당 앵커를 동일한 바닥 기준선에 맞추세요. 애니메이션 중에 발이 움직이는 스프라이트의 경우 루트나 피벗을 일관되게 고정하고 접지 프레임을 확인합니다.

각 이미지의 중앙이 적절한 앵커일 것이라고 넘겨짚지 마세요. 캔버스마다 투명 여백의 크기가 다를 수 있어 피벗을 중앙에 두면 아트워크의 수직 위치가 달라질 수 있습니다. Unity의 픽셀 퍼펙트 워크플로는 픽셀 단위로 측정되는 커스텀 피벗을 지원하며 다중 스프라이트 텍스처에서 개별 스프라이트별로 피벗을 설정하도록 권장합니다.Unity: 2D Pixel Perfect Godot의 경우 Sprite2D는 기본적으로 중앙 정렬됩니다. 공식 문서에 따르면 픽셀 아트가 중앙 정렬되어 픽셀 사이에 위치하면 왜곡되어 보일 수 있으므로 중앙 정렬을 해제하거나 픽셀 스냅을 활성화하는 옵션이 설명되어 있습니다.Godot: Sprite2D

섹션 5

필터링, 스냅 및 카메라 배율 확인하기

선명한 픽셀 아트를 위해 Nearest(최근접) 또는 Point(포인트) 필터링을 사용하고, 텍스처 압축으로 인해 외형이 변형되지 않는지 확인하세요. Unity 가이드에서는 Pixel Perfect Camera와 함께 사용되는 스프라이트에 포인트 필터링과 무압축을 특별히 권장합니다.Unity: 2D Pixel Perfect 이러한 설정은 외곽선의 선명도를 유지해 주지만, 크기가 다르게 스케일링된 두 스프라이트를 같은 크기로 만들어 주지는 않습니다.

다음으로, 카메라를 동일한 기준 뷰로 설정하거나 임시 공통 테스트 카메라를 사용하여 두 씬을 비교합니다. 배틀 씬은 강조를 위해 화면을 줌인하는 경우가 많습니다. 카메라 줌이 2배가 되면 스프라이트의 월드 스케일이 동일하더라도 화면에서 차지하는 픽셀은 2배가 될 수 있습니다. 필요한 것이 동일한 월드 크기인지, 아니면 화면상에서의 동일한 비중인지 결정하세요. 이 둘은 서로 다른 목표입니다. 배틀 연출상 캐릭터를 의도적으로 크게 잡는 것이라면, 해당 줌을 연출적 선택으로 기록해 두고 그 뷰를 바탕으로 기본 스프라이트 스케일을 판단하지 마세요.

픽셀 아트의 경우 정지 프레임뿐만 아니라 움직임도 살펴봐야 합니다. 서브픽셀 위치나 불일치하는 스냅 설정으로 인해 캐릭터가 움직일 때 외곽선이 깜빡이거나 고르지 않게 보일 수 있습니다. Unity의 Pixel Perfect Camera는 에셋 PPU와 연동된 그리드 스냅 기능을 제공하며, Godot은 2D 버텍스 및 트랜스폼에 대한 픽셀 스냅 설정을 제공합니다.Unity: 2D Pixel Perfect Godot: Sprite2D 스냅과 스케일링 동작은 렌더링 설정에 따라 달라지므로 프로젝트의 실제 카메라 설정을 적용해 테스트하세요.

섹션 6

에셋을 변경하기 전 간단한 비교 점검 수행하기

가능하면 동일한 캐릭터 포즈로 나란히 놓고 비교해 보세요. 다음 순서대로 점검을 진행합니다:

  1. 동일한 기준점과 픽셀 카운트 규칙을 사용하여 눈에 보이는 신체 높이를 비교합니다.
  2. 발의 기준선과 스프라이트 피벗 또는 루트 위치를 비교합니다.
  3. PPU 또는 이에 상응하는 임포트 밀도, 오브젝트 스케일 및 부모 스케일을 확인합니다.
  4. 카메라 줌, 기준 해상도, 뷰포트 스케일링 및 디스플레이 크기를 일치시킵니다.
  5. 원본 크기 및 움직이는 상태에서 관찰하여 블러 현상, 고르지 않은 픽셀 배치 또는 클리핑이 발생하는지 확인합니다.
  6. 몇 가지 애니메이션 프레임, 특히 가장 키가 작거나 큰 포즈를 다시 확인합니다.

아트워크 측정값은 일치하지만 배틀에서 캐릭터가 여전히 더 크게 느껴진다면, 스프라이트를 수정하기 전에 카메라 구도와 주변 오브젝트를 먼저 살펴보세요. 카메라와 트랜스폼은 일치하지만 실루엣 높이가 다르다면 아트워크나 통제된 씬별 스케일을 조정하세요. 높이는 맞는데 발 위치가 어긋난다면 피벗, 여백 또는 앵커를 수정합니다. 이러한 순서로 접근하면 한 가지 오류를 다른 오류로 덮는 일 없이 원인을 명확히 파악할 수 있습니다.

섹션 7

향후 스프라이트 작업을 위한 크기 기준 문서 보관하기

공통 목표 높이, PPU(또는 이에 상응하는 값), 기준 해상도, 피벗 규칙, 의도된 카메라 설정을 스프라이트 에셋과 함께 기록해 두세요. Aseprite의 캔버스 도구를 사용하면 투명 테두리를 잘라낼(trim) 수 있지만, 트림 작업을 하면 캔버스 경계가 변경되므로 이후에도 피벗, 슬라이스 또는 엔진 측 앵커가 올바르게 맞는지 확인해야 합니다.Aseprite: Canvas Size 트림 작업은 빠른 씬 확인이 필요한 에셋 변경 사항으로 다루어야 합니다.

신뢰할 수 있는 표준이란 합의된 가시 높이 목표에 부합하고, 동일한 지면 앵커를 공유하며, 의도한 카메라 및 필터링 설정 아래에서 일관되게 렌더링되는 캐릭터입니다. 카메라 강조의 의도적인 차이는 명시적인 연출 선택으로 유지하세요. 이러한 점검 기준을 문서화해 두면 추후 오버월드 포즈나 배틀 애니메이션을 작업할 때도 동일한 실질적 기준과 비교할 수 있습니다.

섹션 8

출처

관련 글

이 주제 더 살펴보기