Communitygithub.com

hanamorix/image-to-animated-pixel-art

이미지나 일러스트를 상세한 픽셀 아트로 변환하고 Aseprite에서 애니메이션(숨쉬기, 깜빡임, 머리카락/옷 흔들림, 물 등)을 추가하는 스킬입니다. Aseprite MCP를 사용합니다.

image-to-animated-pixel-art란 무엇인가요?

이 스킬은 사용자가 제공한 이미지를 Aseprite에서 완전한 애니메이션 픽셀 아트 스프라이트로 변환하는 전문 워크플로우입니다. 정지 프레임 제작, 깜빡임 포즈 생성, 애니메이션 프레임 제작, 디플리커(de-flicker) 처리 및 히트맵 검증, 효과 추가 등 여러 단계를 거칩니다. 각 단계는 사용자의 승인을 받기 전까지 진행되지 않으며, 변경 전마다 자동 백업(`_vN`)을 생성하여 안전하게 되돌릴 수 있습니다. 움직임에서 발생하는 '브레이크(breaks)'—픽셀이 튀거나 찢어지거나 깜빡이는 현상—를 엄격히 검사하며, 정량적 검사(바뀐 픽셀 수, 히트맵)와 시각적 확인(플립북, GIF)을 모두 사용합니다. Aseprite MCP 환경에서만 동작하며, 사용자의 기존 픽셀 아트 선호도(CLAUDE.md 등)를 존중합니다.

지원 대상✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/hanamorix/hana-pixel/tree/HEAD/skills/image-to-animated-pixel-art

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

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

문서

이미지에서 애니메이션 픽셀 아트로

결과물은 원본에 충실해야 합니다: 픽셀 크기로 축소하면서 손상된 부분을 고치되, 디테일을 새로 만들어내지 마십시오. 움직임에서 적은 **브레이크(breaks)**입니다: 튀거나, 찢어지거나, 팝업되거나, 깜빡이는 모든 픽셀. Claude는 GIF를 볼 수 없으므로, 모든 제시는 측정된 검사를 선행하며, "정지 화면에서는 괜찮아 보인다"는 말로 대체하지 않습니다.

사용자가 픽셀 아트 선호도(CLAUDE.md 또는 그 파일이 가리키는 파일)를 유지하고 있다면 먼저 읽으십시오; 여기 기본값을 재정의합니다. Aseprite MCP가 필요합니다: references/aseprite-mcp.md. 해당 단계에 도달하면 읽으십시오: references/still-recipe.md, references/motion-and-breaks.md.

워크플로우

모든 체크인(check-in)은 하나의 메시지입니다: 나란히 보여주는 이미지(원본 | 이전 | 이후, 또는 GIF와 잘린 플립북)와 하나의 질문. 모든 변경 전에 현재 파일을 _vN으로 복사하여, 거부된 라운드를 그 파일에서 되돌릴 수 있게 합니다. 각 라운드는 요청된 변경만 정확히 수행하고 그 외에는 아무것도 하지 않습니다.

  1. 브리핑(Brief). 계획을 세우기 전에 무엇을 원하는지 묻습니다: 어떤 부분이 움직이는지, 얼마나, 얼마나 빠르게, 무엇이 정지 상태를 유지하는지, 무엇이 보호되어야 하는지. 짧은 계획 파일(반 페이지)을 작성하고 승인을 받습니다. 사용자가 계획을 승인하면 완료됩니다.
  2. 소스(Source). 소스를 자르거나 크기를 조정하여 대상 스프라이트의 정확히 3배 크기(약 200-260픽셀 너비)가 되게 합니다. 스크립트는 3배를 가정합니다.
  3. 정지(Still) (1_still.lua, 이후 2_local_rerender.lua, 3_join_outline.lua로 수정). still-recipe.md의 매개변수를 이 이미지에 맞게 측정합니다. 체크인 순서: 손, 그다음 얼굴과 눈, 그다음 외곽선, 금속 및 배경. 각 부분이 승인되고 정지가 *_still_FINAL로 저장되면 완료됩니다.
  4. 깜빡임 포즈(Blink poses) (4_blink_poses.lua, 눈 범위는 14x에서 수동으로 추적). 네 가지 포즈를 나란히 보여주고 깜빡임 GIF를 하나의 체크인에 포함시킵니다. motion-and-breaks.md에 따라 제작합니다. 승인되면 완료됩니다.
  5. 모션(Motion) (5_animation_frames.lua). 정지 이미지에서 측정한 값으로 SETTINGS 블록을 채우고, 먼저 BF_ZERO = true로 실행(0픽셀 변경해야 함)한 다음 실제 실행, 그 다음 6_deflicker_metrics.lua를 실행합니다. 아래 검사를 통과한 후, 전체 GIF와 움직이는 부분의 잘린 플립북을 보여줍니다.
  6. 효과(Effects) (8_effects.lua, 디플리커 이후, 색상만). 검사 후 보여줍니다.
  7. 추가(Extras) 한 번에 하나의 요청씩(팔, 물, ...), 각 요청마다 자체 체크인이 있습니다.
  8. 최종(Final). *_FINAL로 복사합니다(.aseprite + 3배 GIF), 이전 최종본은 유지합니다.

모든 애니메이션 체크인 전 검사

검사통과 기준위치
제로 오프셋 렌더링이 포즈와 일치BF_ZERO로 0px 변경5
강체 부분(손) 정확각 프레임의 박스를 픽셀 단위 들어올림만큼 역이동한 결과가 정지 이미지와 일치: 0px자체 Lua 비교
한 프레임 팝(A→B→A)깜빡임 및 효과 외에는 없음6이 출력
점프BA_STEPS에 나열된 단계 프레임은 제외; 다른 모든 프레임은 중앙값 변경 픽셀의 ~2배 이하, 초과하는 프레임은 명명된 원인이 있어야 함6
히트맵외곽선, 끈, 속눈썹, 눈에 빨간색(루프당 ≥ 8 변경) 없음7_flicker_heatmap.lua
효과모든 효과 픽셀이 ≥ 2프레임 유지; 변경 픽셀 수는 0 이상(약한 블렌드는 동일한 팔레트 색상으로 되돌아갈 수 있음)8이 개수 출력
닫힌 눈닫힌 프레임에 홍채 색상 남아 있지 않음view_sprite 12x
플립북손, 얼굴 및 모든 움직이는 가장자리의 8-16프레임을 6배+에서 연속적으로 보임view_sprite 영역 + 프레임

스크립트 (scripts/)

모든 스크립트는 먼저 PA_DIR(프로젝트 폴더, 경로 구분자로 끝남: Windows에서는 \, macOS에서는 /)과 PA_SRC(소스 이미지 파일 이름)를 설정해야 하며, 헤더에 나열된 자체 전역 변수도 필요합니다. 짧은 런처로 run_lua_script를 통해 실행하십시오; <skill>은 스킬이 로드될 때 제공되는 이 스킬의 기본 디렉토리입니다.

PA_DIR, PA_SRC = [[/path/to/project/]], "reference.jpg"
BF_POSES, BF_OUT, BF_PUSH = "blink_poses.aseprite", "frames", true
dofile([[<skill>/scripts/5_animation_frames.lua]])
스크립트기능
1_still.lua3x3 선 보존 축소, k-평균 팔레트 + 악센트, 주근깨 패스, 고아 병합
2_local_rerender.lua다른 선 임계값 또는 추가 색상(손, 입술)으로 박스 재렌더링
3_join_outline.lua소스에 얇은 선이 있는 점선 외곽선 연결
4_blink_poses.lua열림, 반쯤, 거의, 닫힘 포즈 (파일의 눈 범위는 이미지별)
5_animation_frames.lua모든 프레임; 모든 좌표는 SETTINGS 블록에 있음 (예제 값 포함)
6_deflicker_metrics.lua디플리커, 팝, 점프 검사 (BA_SKIP 강체 박스, BA_STEPS 단계 프레임)
7_flicker_heatmap.lua히트맵 PNG
8_effects.lua스쿼시 라이트, 섬광, 바다 반짝임, 모래 반짝임 (이미지별 SETTINGS 블록)
checkin_sheet.lua영역의 원본/이전/이후 시트
example_metal_rerender.lua작업 예시: 소스의 쉐이드 밴드로 금속 재렌더링

5_animation_frames.lua는 지금까지 만난 모션 유형(호흡 밴드, 소프트 돔, 흔들림 박스, 강체 픽셀 단위 밀기, 팔다리 세그먼트, 바다)을 포함합니다. 움직이는 부분이 다른 새 이미지는 그곳에 필드를 추가합니다.

관련 스킬