해부학을 몰라도 만들 수 있는 픽셀 아트 기본 걷기 사이클

기존 캐릭터에 맞는 캔버스를 선택하세요. 32 × 32 픽셀은 픽셀 아트 걷기 사이클 튜토리얼에서 사용되는 실용적인 예시 중 하나일 뿐, 필수 크기는 아닙니다. 프레임 전체에서 캔버스와 캐릭터의 전체 너비 및 높이를 일관되게 유지하세요. 발 아래에 가로 바닥 기준선을 두고, 몸통 중앙과 같이 안정적인 고정점을 기록해 둡니다. 이러한 기준선이 있으면 의도치 않게 위치가 밀리는 현상을 더 쉽게 발견할 수 있습니다.

첫 번째 단계에서는 머리를 타원이나 블록으로, 몸통을 하나의 오밀조밀한 형태로, 각 팔과 다리를 굵은 선이나 좁은 형태로 표현합니다. 앞쪽과 뒤쪽 팔다리가 겹칠 때 구별할 수 있도록 임시로 서로 다른 색상을 사용하세요. 이는 작업용 다이어그램일 뿐 정확한 비율을 나타내는 것은 아닙니다. 픽셀 아티스트 레이먼드 슐리터(Raymond Schlitter)는 더 큰 스프라이트를 다듬기 전에 색상으로 구분된 더미를 사용하여 머리, 목, 몸통, 팔, 다리를 분리하는 방법을 설명합니다. SLYNYRD: “Pixelblog - 50 - Human Walk Cycle”

유용한 걷기 사이클 프레임워크에는 접촉(contact), 다운(down), 패싱(passing), 업(up)의 네 가지 포즈가 있습니다. 한 걸음에 대해 이 포즈들을 그린 다음, 반대쪽 다리가 앞서도록 패턴을 반복합니다. 접촉에서는 앞발이 앞으로 뻗고 뒷발은 뒤로 뻗습니다. 다운에서는 앞발이 캐릭터의 체중을 지탱하고 몸이 아래로 내려갑니다. 패싱에서는 뒷발이 통과하면서 다리가 투영 상 교차하고 몸이 올라갑니다. 업에서는 발을 내딛는 다리가 다음 접촉을 향해 앞으로 흔들립니다.

8프레임 루프의 경우, 그림을 왼쪽 접촉, 다운, 패싱, 업, 오른쪽 접촉, 다운, 패싱, 업 순서로 배치합니다. 후반부는 어느 쪽 다리가 앞서는지 반대로 바뀌며, 단순히 복제된 이미지가 아니라 전반부의 짝처럼 느껴져야 합니다. 한 상세한 픽셀 아트 예시에서는 이러한 주요 순간을 명시하고 경제성과 유연성 사이의 균형점으로 8프레임을 사용합니다. 다른 프레임 수는 다른 스프라이트 스타일에 적합할 수 있습니다. SLYNYRD: “Pixelblog - 50 - Human Walk Cycle”

스프라이트의 실제 디스플레이 크기에서 잘 보일 수 있도록 다리를 충분히 벌려 첫 번째 접촉 포즈를 그립니다. 발은 바닥 기준선 위에 유지하세요. 다음 프레임에서는 체중을 지탱하는 다리를 살짝 구부리고 몸통을 약간 낮춥니다. 패싱에서는 발을 더 가깝게 모으고 흔들리는 발을 몸 아래로 이동합니다. 업 포즈에서는 앞으로 이동하는 발이나 발뒤꿈치를 들어 올리고, 다른 쪽 다리는 몸을 지탱합니다. 그런 다음 반대쪽 접촉 포즈를 만들고 순서를 이어갑니다.

각 팔다리를 엉덩이부터 발까지 이어진 하나의 형태로 다루세요. 모든 뼈를 픽셀에 매핑할 필요는 없습니다. 다리 길이를 대체로 일관되게 유지하고 방향이나 윤곽선의 변화를 통해 무릎 굽힘이 드러나도록 하세요. 아주 작은 스프라이트에서는 1~2픽셀만 이동하는 것을 의미할 수도 있습니다. 다리가 하나의 알아보기 힘든 덩어리가 된다면, 다리 사이의 간격을 넓히거나 임시 앞/뒤 색상을 사용하여 어느 쪽이 앞을 지나는지 명확히 하세요. 저해상도 스프라이트 튜토리얼에 따르면 4프레임 걷기는 작은 캐릭터에 효과적일 수 있으며, 다리 음영을 번갈아 주면 4프레임 사이클에서 앞서 나가는 두 다리를 구별하는 데 도움이 될 수 있습니다. Manning Leonard Krull: “Tutorial: Walking animation for low-res sprites”

몸통과 머리를 프레임마다 동일한 일반적인 중심 주변에 고정하세요. 다운 포즈 부근에서는 몸이 내려가고 걸음의 패싱 또는 업 부분에서는 올라가도록 하되, 위아래 흔들림은 절제해야 합니다. 작은 캔버스에서는 1픽셀의 변화도 크게 두드러질 수 있습니다. 팔의 경우, 앞으로 나가는 다리의 반대쪽 팔을 흔들어 보세요. 오른다리가 앞서면 왼팔이 앞으로 나갈 수 있으며, 다음 접촉에서는 이 조합을 반대로 합니다. 손과 발은 팔다리와 명확히 구분될 수 있을 정도로 단순하게 유지하세요.

이는 테스트를 위한 시작 형태일 뿐, 보편적인 수치가 아닙니다. 두꺼운 옷을 입은 캐릭터, 매우 작은 스프라이트, 또는 스타일이 강하게 들어간 디자인은 팔다리 간격을 덜 벌리거나 팔 흔들림을 더 미세하게 해야 할 수 있습니다. 실용적인 픽셀 아트 튜토리얼에서도 마찬가지로 손과 발을 단순화하고, 깊이감을 주기 위해 뒤쪽 팔다리의 톤을 다르게 하며, 캐릭터의 의도된 스타일에 맞게 비율을 선택할 것을 권장합니다. Clip Studio Tips: “Tips and Configuration for Creating a Walking Cycle - PixelArt”

얼굴, 주름, 하이라이트 또는 액세서리를 추가하기 전에 러프 루프를 재생해 보세요. 두 접촉 포즈 사이의 명확한 변화, 몸통 아래 다리의 읽기 쉬운 통과, 옆으로 튀지 않고 정렬을 유지하는 머리 등을 확인합니다. 스프라이트가 제자리걸음을 하거나 발차기를 하는 것처럼 보인다면, 대략적인 팔다리 형태부터 먼저 조정하세요. 디테일이 들어가면 움직임의 문제가 가려지는 동시에 모든 수정 작업이 더 느려질 수 있습니다.

실루엣이 제대로 작동하면 캐릭터의 팔레트를 복원하고 한 번에 한 가지 특징씩 다듬어 나갑니다. 변경 사항은 국소적으로 유지하세요. 먼 쪽 다리의 깊이만 바뀌는 경우 머리와 몸통을 움직이지 않고 해당 다리의 색상이나 겹침만 변경합니다. 머리카락, 헐렁한 소매 또는 작은 액세서리는 몸과 함께 약간 움직일 수 있지만 선택 사항입니다. 4프레임 픽셀 아트 실습에서 Pinnguaq는 기본 사이클을 설정한 후 머리카락이나 모자 장식과 같은 가벼운 디테일에 작은 움직임을 추가하는 방법을 보여줍니다. Pinnguaq: “Pixel Art 4A: Animation Basics In GraphicsGale”

애니메이션을 연속으로 미리 보고 한 프레임씩 넘겨가며 확인하세요. 먼저 8번 프레임과 1번 프레임을 비교합니다. 몸통, 머리, 지면 위치 및 전체 실루엣이 튀는 느낌 없이 자연스럽게 연결되어야 합니다. 그런 다음 두 접촉 포즈가 서로 반대되는 걸음인지, 바닥을 디딘 발이 다른 높이로 튀는 것처럼 보이지 않는지 확인합니다. 캐릭터가 너무 심하게 위아래로 흔들리는 것 같으면 수직 변화를 줄이고, 다리가 뭉개져 보인다면 간격을 벌리거나 겹침 표현을 개선하세요.

한 번에 한 가지씩 수정한 후 다시 재생해 봅니다. 타임라인의 프레임 지연 시간은 각 그림이 화면에 유지되는 시간을 제어하므로 그림을 정지된 이미지로만 판단하지 말고 재생하면서 속도를 테스트하세요. Pinnguaq의 가이드에서는 애니메이션 미리보기와 개별 프레임을 모두 확인하고 프레임 지연 시간을 변경하여 속도를 조정할 것을 권장합니다. Pinnguaq: “Pixel Art 4A: Animation Basics In GraphicsGale”

8프레임은 양쪽 모두에 대해 네 가지 주요 포즈를 보여줄 수 있는 여유를 제공합니다. 스프라이트가 극도로 작다면 그려야 할 미세한 변화가 적은 2프레임 또는 4프레임 사이클이 더 잘 읽힐 수 있습니다. 전환이 부자연스럽게 느껴지고 캔버스에 여유가 있다면 키 포즈 사이에 프레임을 추가하세요. 모든 스프라이트에 들어맞는 단 하나의 프레임 수는 없습니다. Adafruit의 가이드에서는 약 6프레임을 사용하는 단순한 게임 걷기와 최대 약 12프레임을 사용하는 더 부드러운 버전을 설명하며, 저해상도 튜토리얼에서는 2, 4, 8프레임 옵션을 다룹니다. Adafruit: “Pixel Art for LED Matrix Displays”, Manning Leonard Krull: “Tutorial: Walking animation for low-res sprites”

의도한 크기에서 걸음걸이가 명확하게 읽히고 마지막 프레임에서 첫 번째 프레임으로의 전환이 연속적으로 느껴지면 작업을 마무리합니다. 프레임을 추가하거나 2차 움직임을 더하기 전에 이 러프 버전을 저장해 두세요. 디테일이 추가되어 움직임을 파악하기 어려워졌을 때 되돌아갈 수 있는 명확한 기준점이 됩니다.

• “Pixelblog - 50 - Human Walk Cycle,” SLYNYRD

• “Tutorial: Walking animation for low-res sprites,” Manning Leonard Krull

• “Tips and Configuration for Creating a Walking Cycle - PixelArt,” Clip Studio Tips

• “Pixel Art 4A: Animation Basics In GraphicsGale,” Pinnguaq

• “Pixel Art for LED Matrix Displays,” Adafruit Learning System