핼러윈 할인: −40% 11월 4일까지 itch.io에서 Pixor가 $19.99 $11.99 →

모든 각도의 자동차와 우주선 스프라이트

탑다운 레이서의 자동차나 Asteroids 같은 슈터의 우주선은 어느 방향으로든 돕니다. 엔진에서 스프라이트 하나를 회전시키면 픽셀이 깨지고, 각도 32개를 손으로 그리려면 며칠이 걸립니다. 3D 모델이라면 각도마다 렌더 한 번이면 됩니다.

무료 라이브러리의 우주선, Pixor로 렌더링
무료 라이브러리의 레이싱 카
위에서 본 픽셀 아트 우주선이 32개 방향을 돕니다
32방향 헤딩, 탑다운

탈것에 각도가 이렇게 많이 필요한 이유

탑다운 RPG의 캐릭터는 네 방향이나 여덟 방향으로 걸으니 방향 네 개나 여덟 개면 됩니다. 탈것은 다릅니다. 조향을 합니다. 모퉁이를 도는 자동차나 스틱에 따라 도는 우주선은 그 사이의 모든 방향을 지나가므로, 스프라이트가 여덟 방향만 보여 줄 수 있다면 눈에 띄는 45도 단위로 뚝뚝 끊기며 넘어갑니다.

게임은 이를 세 가지 방법 중 하나로 해결합니다.

  1. 엔진에서 스프라이트 하나를 회전. 값싸지만, 픽셀 아트를 회전시키면 리샘플링됩니다. 90도의 배수가 아닌 각도에서는 선이 깨지고, 픽셀 하나가 두 배가 되거나 사라지며, 스무딩을 켜면 가장자리가 흐려집니다. 더는 픽셀 아트로 보이지 않습니다.
  2. 모든 각도를 손으로 그리기. 보기에는 맞지만 일이 많습니다. 자동차의 32개 각도에, 파손 버전, 팀 색상마다 또 있습니다. 디자인을 바꿀 때마다 전부 다시 그려야 합니다.
  3. 3D 모델에서 모든 각도를 렌더링. 1990년대 레이싱과 슈팅 게임이 프리렌더 스프라이트로 한 방식이고, Pixor가 카메라 링으로 하는 방식입니다.

각도는 몇 개가 필요할까

각도 단계 적합한 경우
8 45° 탱크와 천천히 도는 유닛, 전략 게임
16 22.5° 대부분의 탑다운 레이서와 슈터, 터렛
32 11.25° 부드러운 조향, 자유롭게 회전하는 우주선
64 5.6° 큰 탈것 스프라이트, 느리고 정밀한 회전

스프라이트가 클수록 각도가 더 필요합니다. 16픽셀 우주선은 가까운 두 방향 사이에서 거의 달라지지 않지만, 64픽셀 자동차는 눈에 띄게 튑니다.

탑다운, 바로 위에서

위에서 본 우주선이나 자동차는 탑다운 뷰와 방향 링으로 렌더링하세요.

pxr render race-car.glb --preset selout --view top-down --size 40 --ring 16 \
  --clip none --export png,json -o car.png

바로 위에서 16개 각도로 본 빨간 레이싱 카, 여덟 개씩 두 줄

--ring 16은 모델 주위에 카메라 16개를 앞에서부터 반시계 방향으로 놓습니다. 방향마다 하나이고, 모두 같은 크기와 같은 미터당 픽셀 배율을 공유하므로 자동차가 어느 방향에서든 같은 크기이고 고정된 피벗 하나를 중심으로 돕니다. 시트에는 방향마다 한 행이 있고, JSON이 각각의 이름을 담고 있어 게임이 헤딩으로 프레임을 고릅니다. --ring은 1에서 64까지이며, --sides 0,10,20,...는 대신 원하는 각도 목록을 받습니다.

앱에서는 아웃라이너의 +로 카메라를 추가하고 카메라 용도… › 탑다운 슈팅(바로 아래를 향함, 16방향, 32 px)을 고르거나, 남 카메라의 뷰를 설정하고 모델 주위 링으로 4, 8, 16, 32방향을 쓰세요.

레이싱 뷰

아케이드 시대의 탑다운 레이서는 흔히 비스듬히 내려다보았기 때문에 각도마다 자동차의 옆면도 보였습니다. 레이싱 카메라가 그렇게 합니다. 12° 아래를 향하고, 16방향, 64 px입니다.

pxr render race-car.glb --preset selout --camera racing --clip none -o car-racing.png

낮게 기울인 카메라에서 16개 각도로 본 빨간 레이싱 카

제자리에 있는 빛, 또는 자동차와 함께 도는 빛

기본적으로 키 라이트는 카메라를 따라갑니다. 모든 뷰에서 같은 쪽에 있습니다. 탑다운 게임에서는 이쪽이 원하는 경우가 많습니다. 모든 헤딩이 똑같이 조명을 받아 스프라이트가 어디를 향하든 똑같이 보이기 때문입니다.

빛이 월드에 고정되어 있어야 한다면, 즉 태양을 등진 자동차의 그늘진 면이 플레이어를 향하게 하려면 키 라이트의 카메라 따라가기를 끄세요(--light-space world). 위의 애니메이션은 세 번째 방법을 씁니다. --turntable 32은 카메라 하나 아래에서 모델 자체를 한 바퀴 돌려 32프레임짜리 액션으로 만드므로, 돌면서 빛이 선체를 가로질러 미끄러집니다.

모든 각도에서 애니메이션

탈것은 돌면서 움직이는 경우가 많습니다. 바퀴가 돌고, 엔진이 깜빡이고, 터렛이 목표를 따라갑니다. 클립을 주면 모든 방향이 모든 프레임을 갖습니다.

pxr render spaceship.glb --preset selout --view top-down --size 48 --ring 32 \
  --clip all --export png,json,godot

32방향이면 시트가 빠르게 커집니다. --max-height 4096는 키가 큰 시트를 클립 단위로 페이지에 나누고, --dedupe는 같은 프레임을 한 번만 저장합니다. 라이브러리의 우주선, 경주용 자동차, 경찰차는 써 볼 수 있는 무료 CC0 모델입니다.

변형은 덤으로

모든 각도가 하나의 모델에서 나오므로 변형을 그리는 데 드는 비용이 없습니다. --variant hit-flash는 피해를 입었을 때의 섬광 버전을 쓰고, --team과 --variant team:blue는 팀 색을 바꾸며, --material-colour는 자동차에 새 도색을 입힙니다. 모두 매뉴얼의 팔레트 변형 절에 있습니다. 회전하지 않고 화면 위로 날아가는 우주선은 슈팅 게임 스프라이트를 보세요.

질문

탑다운 자동차 스프라이트에는 회전 각도가 몇 개 필요한가요?

부드러운 조향에는 16개가 일반적인 최소이고, 32개면 대부분의 속도에서 부드러워 보이며, 64개는 큰 스프라이트나 느리고 정밀한 회전에 맞습니다. Asteroids 스타일 게임의 우주선은 흔히 16개나 32개입니다. 16개 미만이면 끊겨 보입니다.

엔진에서 스프라이트 하나를 회전하면 안 되는 이유는?

픽셀 아트를 90도의 배수가 아닌 각도로 회전하면 리샘플링됩니다. 선이 깨지고, 픽셀 하나가 두 배가 되거나 사라지며, 필터링을 하면 가장자리가 흐려집니다. 각도마다 렌더링하면 모든 헤딩에서 깔끔한 1픽셀 선이 유지됩니다.

탈것에도 각도마다 애니메이션을 넣을 수 있나요?

네. 클립이 있으면 모든 방향이 모든 프레임을 갖습니다. 16방향에서 우주선의 추진 깜빡임이나 자동차의 도는 바퀴가 방향마다 한 행인 시트 하나가 됩니다.

다음 읽을거리

브라우저에서 내 모델로 무료로 써 보거나, 정식 버전을 구매하세요.

브라우저에서 체험 Pixor 구매