이미지로 나만의 펫 만들기

1. 01
   내 펫 열기

   MonglePet 설정의 내 펫 화면으로 이동합니다.

2. 02
   펫 만들기 선택

   내 펫 상단의 펫 만들기를 눌러 새 펫 만들기 화면을 엽니다.

3. 03
   첫 애니메이션에 이미지 추가

   단일 PNG를 한 장씩 추가하거나 스프라이트 시트에서 여러 프레임을 가져옵니다.

• 프레임마다 같은 512×512px 투명 캔버스와 같은 캐릭터 크기·기준선을 권장합니다. 필수 크기는 아닙니다.
• PNG 한 장은 한 프레임의 정지 애니메이션으로 만들 수 있습니다.
• 여러 PNG는 파일명 순서가 아니라 앱에서 사용자가 정한 순서로 등록됩니다.
• 정적 PNG 또는 정적 WebP 스프라이트 시트도 프레임으로 나눠 가져올 수 있습니다.
• 투명 배경을 사용하면 펫의 실제 외곽과 클릭·겹침 효과가 자연스럽게 동작합니다.

단일 PNG 추가는 선택한 각 이미지에서 애니메이션에 사용할 프레임을 하나씩 자르는 방식입니다. 한 장만 선택하거나 여러 PNG를 함께 선택해 순서대로 작업할 수 있습니다.

1. 01
   PNG 선택

   사용할 이미지를 선택하고 왼쪽 원본 화면에서 펫을 찾습니다.

2. 02
   파란 경계 맞추기

   경계 안을 드래그해 이동하고 모서리·변 핸들로 저장할 프레임 범위를 조절합니다.

3. 03
   잘라낸 결과 확인

   오른쪽 미리보기에서 펫 전체가 파란 경계 안에 들어오는지 확인합니다.

4. 04
   프레임 추가

   잘라서 프레임 추가를 눌러 현재 애니메이션에 등록합니다.

스프라이트 시트는 한 이미지 안에 나란히 배치된 여러 동작을 선택해 한 번에 프레임으로 가져오는 방식입니다.

1. 01
   가져올 프레임 선택

   프레임 선택에서 첫 애니메이션에 사용할 동작을 재생할 순서대로 선택합니다.

2. 02
   격자가 맞지 않으면 다시 나누기

   범위 편집의 시트 격자 옵션에서 행·열과 안쪽 여백을 조절하고 격자 적용을 누릅니다.

3. 03
   각 프레임 범위 조절

   너비·높이와 위치를 바꾸거나 경계를 직접 드래그해 펫이 들어오는 범위로 맞춥니다.

4. 04
   미리보기 후 저장

   선택 영역 미리보기에서 펫이 파란 경계 안에 들어오면 프레임 저장 및 추가를 누릅니다.

프레임을 가져오면 새 펫 만들기 화면으로 돌아옵니다. 이제 펫의 공통 배율과 위치, 이미지 방향을 맞추고 프레임 순서와 재생 간격을 조절합니다.

배율

애니메이션 안에서 펫이 보이는 공통 크기를 정합니다.

가로·세로 위치

프레임이 바뀌어도 펫의 기준점이 흔들리지 않도록 맞춥니다.

이미지 방향

필요한 프레임을 좌우 또는 상하로 뒤집습니다.

프레임 순서

움직임이 재생될 이미지의 차례를 정합니다.

재생 간격

각 프레임이 화면에 머무는 시간을 밀리초 단위로 정합니다.

• 첫 애니메이션은 다른 참조가 없을 때 사용할 기본 애니메이션이 됩니다.
• 애니메이션을 추가하고 이름·반복 여부·프레임 순서와 간격을 수정할 수 있습니다.
• 기존 애니메이션을 복제해 비슷한 움직임을 빠르게 만들 수 있습니다.
• 기본 애니메이션을 지우려면 먼저 다른 애니메이션을 기본값으로 정해야 하며 마지막 하나는 삭제할 수 없습니다.
• 현재 펫에 등록된 다른 애니메이션의 프레임을 선택한 순서대로 복사해 새 애니메이션에 사용할 수 있습니다.

이미지를 이어 애니메이션을 만들었다면, 하나 이상의 애니메이션을 순서와 반복 횟수로 묶어 행동을 만듭니다. 완성한 행동은 평상시·이동·입력 없음·특정 앱 사용·쓰다듬기 같은 상황에 연결할 수 있습니다.

1. 01
   정보 입력

   펫 이름, 제작자 이름과 버전을 입력합니다. 앱에서 새로 만드는 버전은 1.0.0 형태를 사용합니다.

2. 02
   행동 연결

   애니메이션을 저장하면서 새 행동을 만들거나 기존 행동의 애니메이션 단계로 추가할 수 있습니다.

3. 03
   미리보기

   선택 프레임과 전체 재생을 번갈아 보며 크기·위치·속도와 투명 배경을 확인합니다.