스프라이트 시트 패커
여러 PNG 이미지를 빈틈없이 배치해 텍스처 아틀라스 한 장과 프레임 좌표 JSON을 만들어요. 투명 테두리 잘라내기, 여백, 2의 거듭제곱 크기를 지원해요.
배치 설정
사용 방법
이런 때 쓰면 좋아요
게임에서 작은 이미지를 수십 장씩 따로 불러오면 그리기 호출이 늘고 로딩도 느려져요. 텍스처 아틀라스로 한 장에 모으면 메모리와 성능 모두 아낄 수 있어요.
이 도구는 이미지를 높이순으로 선반에 차곡차곡 올리는 방식으로 배치하고, 여러 너비를 시험해서 전체 면적이 가장 작은 결과를 골라요. 투명한 가장자리를 잘라 내면 더 촘촘하게 들어가고, 원래 크기와 잘린 위치는 JSON에 그대로 남아서 엔진에서 원래 자리에 그릴 수 있어요.
JSON은 frames 안에 이름별로 frame, spriteSourceSize, sourceSize를 담는 널리 쓰이는 해시 형식이라 Phaser, PixiJS 같은 웹 엔진이나 직접 만든 로더에서 바로 읽을 수 있어요.
자주 묻는 질문
JSON 형식은 어떤 엔진에서 읽히나요?
frames 객체에 이미지 이름별 좌표가 들어가는 해시 형식이에요. Phaser, PixiJS 등 이 형식을 읽는 엔진에서 바로 쓸 수 있고, 다른 엔진은 간단한 변환 스크립트로 읽을 수 있어요.
이미지를 회전해서 더 촘촘히 넣나요?
아니요. 회전은 엔진마다 처리 방식이 달라 문제가 생기기 쉬워서 하지 않아요. rotated 값은 항상 false예요.
2의 거듭제곱은 언제 켜나요?
오래된 기기나 일부 압축 텍스처 형식은 가로세로가 256, 512, 1024처럼 2의 거듭제곱이어야 해요. 요즘 엔진은 대부분 필요 없지만, 확실하지 않으면 켜 두세요.
최대 너비를 넘는 이미지는요?
한 장이 최대 너비보다 크면 그 이미지 너비에 맞춰 늘어나요. 너무 큰 아틀라스는 기기에서 못 읽을 수 있으니 4096 이하를 권해요.
여백은 왜 넣나요?
텍스처를 확대하거나 필터링할 때 옆 이미지 색이 번지는 것을 막기 위해서예요. 픽셀아트도 1~2px 정도 두는 것을 추천해요.