스프라이트 히트박스 & 허트박스 애니메이터

스프라이트 프레임별 충돌 레이어를 작성하고, 어니언 스킨으로 동작을 미리보며, 정확한 피셀 좌표를 편집하여 JSON으로 내보내세요.

스프라이트 애니메이션을 로드하고 프레임을 확인한 뒤 공격, 피격, 물리 충돌 영역을 지정하세요.

로컬 전용 애니메이션 작업대. 이미지가 전송되지 않습니다.
작업대에 이미지 배치

스프라이트 시트 또는 정렬된 PNG/WebP 이미지를 선택하세요.

프레임 분할
동작 미리보기
애니메이션 무대

이미지를 불러와 충돌 레이어 작업을 시작하세요.

타임라인
프로젝트 내보내기

JSON 파일에는 파일명, 피봇 및 충돌 기하 구조만 저장되며 픽셀 정보는 포함되지 않습니다.

Zoom 100%
유틸리티 스튜디오

이 유틸리티를 내 웹사이트에 추가하고 싶으신가요?

WordPress, Notion 또는 직접 운영하는 사이트에 맞게 색상과 다크 모드를 설정하세요.

자주 묻는 질문

Hitbox(공격 판정)와 Hurtbox(피격 판정)의 차이는 무엇인가요?

Hitbox는 공격을 가하는 영역이며, Hurtbox는 피격 판정을 받는 영역입니다. Pushbox는 캐릭터 간 거리를 유지하며, Grabbox는 잡기 범위를 설정하고, Sensor는 감지 영역으로 기능합니다.

스프라이트 이미지가 외부 서버로 전송되나요?

아니요. 이미지 디코딩, 잘라내기, 그리기 및 내보내기는 100% 브라우저 내부에서 실행됩니다. 설정값만 로컬 저장소에 보관됩니다.

내보낸 JSON 파일은 어떤 좌표계를 사용하나요?

각 프레임은 자른 영역의 좌측 상단을 (0,0) 원점으로 측정합니다. 사각형과 원의 좌표 및 피봇 위치는 원점 기준 피셀 단위로 저장됩니다.

스프라이트 시트와 개별 프레임 이미지를 모두 편집할 수 있나요?

네. PNG 또는 WebP 스프라이트 시트의 행과 열 개수를 입력하여 균일하게 나누거나, 정렬된 개별 이미지 파일들을 선택할 수 있습니다.

내보낸 데이터는 모든 게임 엔진에서 바로 사용할 수 있나요?

JSON 형식은 특정 엔진에 종속되지 않는 범용 구조입니다. 프레임 영역, 피봇, 레이어 이름 및 기하학 데이터를 저장합니다.

참고 문헌