도드의 개발노트#4 - 유니티 본 애니메이션 스프라이트 2D 스켈레톤 모델!

whats my age again?

도드의 개발노트#4 - 본 애니메이션 스프라이트 2D 스켈레톤 모델

유니티 본 애니메이션 그러니까 뼈대 형태를 갇춘 스켈레톤 2D 스프라이트 모델을 만드는 방법과

애니메이션 제작 방법을 간단히 정리해봄.

1. 스프라이트 시트를 만든다.

- 김프/포토샵/플래쉬등 아트 소프트를 이용해서 머리 몸통 윗팔 아래앗팔 윗다리 아랫다리 손 발..

2. 스프라이트 시트를 유니티 프로젝트 패널에 불러온다.

3. 불러온 스프라이트 시트 설정을 다음과 같이 한다.

4. Sprite Editor 를 열어서 Slice를 눌러줘서 자동으로 나눠지게 한다.

Slice가 비활성 상태라면 Sprite 모드가 Multiple로 설정되지 않아서 일거다 (그니까 위대로 하라고 ㅠㅠ)

5. 각 바디파트의 이름을 예의 바르게 설정하고 피봇 포인트를 인체와 유사하게 만든다.

예의 바르게? : "모델이름_파트이름_넘버_앞뒤여부" 이런식으로 체계적이게 구성해놔야 고생안함.

인체와 유사하게? : 팔다리몸통머리 회전할때 중심축을 인체와 같게 만듬. 예를들어 "손" 같은 경우 손맨뒤가 피봇포인트가 됨. 몸통같은경우 허리쪽인 몸통 맨아래가 피봇포인트가 됨. 머리통도 당연히 피봇포인트는 맨아래 목부위쪽.

6. 빈 오브젝트를 생성해서 그걸부모로 잡고 만들어놓은 신체부위로 캐릭터를 만들어줌.

- 부모자식 관계 인체처럼 그리고 애니메이션 할때 움직이기 쉽게 잘 설정하고 특히 스프라이트 소팅레이어 그러니까 스프라이트가 보여질 순서도 부위별로 만들어야함.

7. 바디 파트 전부를를 Ignore Raycast 레이어에 몽땅다 집어놓고 Edit > Project Settings > Physics 2D 에 들어가서 레이어간 충돌설정에서 자기들끼리는 절대 충돌하지 않게 설정함. 

8. 모든 바디파트에 rigidbody 2D 하고 box collider 2D 넣어줌. 그리고 rigidbody는 kinetic으로 설정.

** 뜬금없는 핵꿀 애드온 소개 **

스프라이트 시트 피봇 설정등 그대로 복사하는 애드온

EasySpriteSheetCopy.zip

이게 유용한 이유가 만약에 어떤 인간 모델을 만들었다고 해봄. 이 인간모델에 다양한 옷, 외모, 헤어스타일을 적용하고 싶은데 새로운 스프라이트를 불러와서 다시 이름다 짓고 피봇만들고 할 필요가 없어짐. (동일한 스프라이트 시트 작업했을때 기준)

사용법

1) 위에서 만든 기준 스프라이트 시트를 에셋에서 클릭한다.

2) 인스펙터 우측상단에 톱니바퀴 모양을 눌러서 Copy All... 을 눌러서 설정을 복사한다.

3) 새 스프라이트 시트의 인스펙터 우측상단 톱니바퀴에서 Paste 를 해서 설정을 붙여넣기한다.

4) 바뀐 새 스프라이트 시트에서 바디파트의 이름들만 수정해준다.

이렇게 해주면 기존 모델의 바디파트의 스프라이트만 바꿈으로써 옷이나 장비를 바꾸는 효과를 줄수있음.

같은 이미지를 기반으로 만든 스프라이트 시트이므로 피봇 포인트가 같아서 그냥 바꿔주기만해도 그대로 작동함.

작업효율 200% 향상!

유니티 본 애니메이션 2d 스켈레톤 모델 만들기

1. 애니메이션 윈도우를 하단 UI에 배치해서 작업할 준비를함.

2. 위에서 만든 모델을 클릭함 (당연히 최상위 부모)

3. 애니메이션 패널에서 새 애니메이션 만들기를 클릭함

4. 첫 애니메이션은 Idle 이라고 이름짓고 가만히 있는 상태(Idle)일때의 애니메이션을 만들준비를함.

5. 애니메이션 패널에서 녹화버튼 ● 을 클릭하고 원하는 시간대로 키 프레임, 붉은 선을 움직여놓고

모델에 원하는 변화를 줌. 그러면 자동적으로 애니메이션이 생성됨.

6. 주의점

- 변화를 줄때 최상위 부모요소의 position 자체가 변경되면 절대안됨.

캐릭터 움직임과 처리에서 여러가지 문제를 초래함. 어쩌다 position이 들어가면 지우면됨.

유니티 스켈레톤 본 애니메이션은 놀라울정도로 쉽고 체계적인 다양한 애니메이션을 만들수있는데 아쉬운 점이라면

도트 기반으로한 애니메이션 같은경우 움직임이 무슨 3d모델처럼 부드럽다는거? ㅋㅋㅋ 배가부른 불평일수도있는데

움직임이 너무 살아있는것같아서 이상한느낌. ㅠㅅㅠ

애니메이션간의 자연스러운 이어짐?

타 애니메이션간의 자연스러운 이어짐을 만들려면 애니메이터 윈도우를 띄우고

Make Transition 으로 이어주고 Has Exit Time 해제 해주고 트랜시션간의 조건 설정해주고 스크립트로 그 조건 충족시키면서 애니메이션 불러내면 됨.