Communitygithub.com

OpenScaleOrg/pixel-animation

Aseprite MCP 도구를 사용하여 스프라이트나 장면을 애니메이션할 때 활용: 대기 루프, 걷기 사이클, 공격, 주변 장면 루프(구름, 증기, 깜박이는 불빛), 프레임 타이밍, 태그 및 GIF 내보내기.

pixel-animation란 무엇인가요?

이 스킬은 Aseprite MCP 도구를 통해 픽셀 아트 애니메이션을 제작하는 전문화된 워크플로우 가이드입니다. 캐릭터의 대기 동작, 걷기 사이클, 공격 모션부터 구름이나 증기 같은 주변 환경 루프까지 다양한 애니메이션 유형을 지원합니다. 사용자는 먼저 `animation_workflow_guide` 함수를 호출하여 적절한 사용 사례(character, idle, environment)를 선택한 후, 프레임 추가, 태그 설정, 정적 레이어 전파, 그리고 포즈 간 전환(tween)이나 스쿼시/스트레치 같은 기법을 적용할 수 있습니다. 루프가 자연스럽게 이어지도록 마지막 프레임이 첫 프레임으로 부드럽게 연결되며, `export_animation`이나 `export_tag`를 통해 GIF로 내보낼 수 있습니다. 주로 Claude Code, Cursor, Codex 같은 AI 에이전트 플랫폼에서 사용되며, Aseprite의 MCP 서버와 연동됩니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/OpenScaleOrg/Aseprite-Plugin/tree/HEAD/plugins/aseprite/skills/pixel-animation

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

aseprite 도구로 픽셀 아트 애니메이션하기

먼저 animation_workflow_guide를 호출하세요: use_case="character", "idle" 또는 "environment"를 사용합니다.

1. 루프 결정하기

  • 사용자가 열어 놓은 파일에서 애니메이션을 진행합니다. 파일이 너무 작거나 프레임이 너무 적다면 같은 파일에서 resize_canvas와 add_frames를 사용하세요. create_canvas나 Lua의 Sprite()(aseprite-live 스킬 참조)로 새 스프라이트를 생성하지 마세요.

  • 길이와 타이밍. 지속 시간 = 프레임 수 × 프레임 시간. 일반적인 선택은 주변 루프의 경우 8프레임 × 120ms(약 1초), 대기 동작의 경우 4-6프레임 × 100-150ms, 걷기의 경우 6-8프레임입니다.

  • 지속 시간. add_frames(count, duration_ms)를 사용한 후 set_frame_duration_all을 호출하세요.

  • 태그. 각 루프에 set_tag로 이름을 지정하세요(예: idle 또는 walk). 그러면 export_tag로 해당 루프만 따로 내보낼 수 있습니다.

2. 정적 레이어 먼저

먼저 정지 프레임을 완성하세요. pixel-art 스킬을 따릅니다. 그런 다음 propagate_cels를 호출하여 움직이지 않는 모든 레이어(배경, 가구)를 모든 프레임에 복사합니다. 그 후에는 움직이는 레이어만 다시 그립니다.

3. 올바른 방식으로 움직이기

움직이는 대상방법
캐릭터, 생물체포즈 대 포즈(Pose to pose). 각 주요 포즈를 자체 프레임에 다시 그립니다: 예측 동작, 실제 동작, 후속 동작. copy_frame을 사용한 다음 erase_region으로 움직이는 부분을 지우고 draw_rows로 다시 그립니다. 몸 전체를 포함시킵니다. 발은 공중에 뜨지 않는 한 하나의 지면 선 위에 유지합니다.
연체 생물(슬라임, 젤리)30-50%로 스쿼시/스트레치하며, 공중에 있는 모든 프레임에서 모양이 변경됩니다.
단단한 물체, 2차 동작tween_cel_positions_eased, offset_cel_positions 또는 oscillate_cel_positions 사용 (구름, 떠 있는 아이콘, 흔들리는 배).
회전 부품(팬, 풍차)2-4개의 포즈를 그리고 copy_cel로 번갈아 표시합니다.
주변 효과(증기, 반짝임, 화면 콘텐츠, 깜박이는 LED)프레임당 작은 픽셀 집합을 다시 그립니다. 입자가 상승함에 따라 알파를 감소시킵니다.

살아있는 것의 주요 동작에 트윈(tween)을 절대 사용하지 마세요.

4. 루프를 매끄럽게 만들기

  • 마지막 프레임이 첫 번째 프레임으로 자연스럽게 이어져야 합니다. 입자의 경우 (frame + offset) % N 위치를 사용하세요. 스크롤의 경우 루프 기간 동안 정확히 한 주기만큼 이동합니다.
  • 팝백(Pop-back)을 피하세요. 8px 이동 후 다시 튀어 오르면 결함처럼 보입니다. 앞뒤로 흔들리는 움직임을 사용하거나 캔버스 전체 너비로 이동시켜 완전히 나갔다가 다시 들어오게 만듭니다.
  • 연속성을 확인하려면 render_onion_skin을 사용하세요. compare_frames와 get_bounds로 무엇이 얼마나 움직였는지 확인합니다.

5. 검토 및 내보내기

  • 검토. view_sprite(frames="1-8")를 호출하여 모든 프레임을 나란히 보고, audit_animation 또는 validate_scene을 호출하여 누락된 셀(cel)을 찾습니다.
  • 내보내기. export_animation(output.gif, scale=4-8, background="#...")로 공유 가능한 GIF를 만듭니다. 단일 루프는 export_tag를 사용합니다.
  • 라이브 모드에서는 사용자가 Aseprite에서 Enter 키를 눌러 애니메이션을 재생할 수도 있습니다.

Individual skills in this repo

This repo contains 3 individual skills — each has its own dedicated page.

관련 스킬