움직이는 캐릭터, 코드 한 줄 없이 브라우저에서 완성하세요

1. 시작하기 — 에디터 열기

에디터를 열면 별도 설치나 회원가입 없이 바로 작업을 시작할 수 있습니다. 왼쪽에는 무대 위 캐릭터 목록과 파츠 조절 패널이, 가운데에는 실시간으로 움직이는 미리보기 무대가, 오른쪽에는 장면 JSON을 직접 편집할 수 있는 코드 에디터가 있습니다. "움직이는 캐릭터 만들기"가 처음이라면 헤더의 ❓ 가이드 버튼으로 전체 흐름을 먼저 훑어봐도 좋습니다.

2. 캐릭터 배치하기

하단 샘플 라이브러리에서 원하는 캐릭터를 골라 무대에 올립니다. 배경과 이펙트(거품·빛줄기 등)도 같은 방식으로 조합할 수 있어, 캐릭터 하나만으로도 완성도 있는 장면을 빠르게 구성할 수 있습니다. 캐릭터는 여러 개를 겹쳐 올려 그룹 장면을 만들 수도 있고, 크기·좌우 반전·앞뒤 순서를 자유롭게 조절할 수 있습니다.

3. 파츠 조절하기

1. 왼쪽 파츠 목록에서 지느러미·눈·꼬리 같은 파츠를 하나씩 선택합니다.
2. 파츠마다 스윙·밥·드리프트·맥동·스핀·글로우·눈 깜빡임 등 8종 애니메이션 중 하나를 지정하고, 각도·거리·속도 같은 세부 값을 슬라이더로 조절합니다.
3. 필요하면 파츠의 회전축(피벗)을 지정해 더 자연스러운 움직임을 만들고, 색상 세트를 교체해 나만의 스타일을 입힙니다.
4. 캐릭터 전체를 움직이려면 무빙 패턴 7종 중 하나를 선택해 무대 위에서의 이동 방식을 정합니다.

4. 내보내기·공유하기

장면이 마음에 들면 헤더의 📤 내보내기 버튼으로 움직이는 SVG 파일이나 WebM 영상을 내려받습니다. SVG 파일은 애니메이션이 그대로 살아있는 이미지 파일이라 블로그·노션 등 어디에든 붙여넣을 수 있는 완성된 SVG 애니메이션 메이커 결과물이 됩니다. 다른 사람에게 편집 가능한 상태로 그대로 보여주고 싶다면 🔗 공유 링크 버튼을 눌러 URL을 복사해 전달하세요. 받는 사람이 링크를 열면 같은 장면이 에디터에 그대로 복원됩니다.