[압량(Amnyang)] #2. 2D Bone Animation으로 주인공 애니메이션 제작하기

 

디자이너님께 오늘 최종 완성된 주인공 캐릭터 리소스를 받았다.
그동안은 주인공 중간 완성본을 가지고 연습했는데, 드디어 본 작업을 진행할 수 있을 것 같다.
심혈을 기울여서 한 번 만들어보자!

 

 

1. 뼈대(Bone) 작업 및 메시(Mesh) 생성 작업하기

 

먼저 캐릭터 리소스를 PSB 파일로 유니티에 받아와서, Skinning Editor에서 편집을 시작했다.
우선, 캐릭터의 움직임에 기반이 될 뼈대 생성 작업부터 해줬다.

각 레이어별로 기반이 될 메인 뼈대를 하나씩 지정해줬다. 예를 들면, 머리 레이어라면 머리 뼈, 오른쪽 팔 레이어라면 윗팔뼈를 루트(Root)로 시작하여 손뼈까지 내려가는 등의 작업을 진행해줬다.

사람의 몸의 특성상, 몸통이 움직이면 목, 머리, 팔, 다리가 다 움직일 수 밖에 없다. 그래서 몸통 뼈가 최상단 루트에 있는 뼈대고, 하위 뼈대로 나머지 뼈대들을 작업을 해줬다.

 

눈은 캐릭터 뼈대 작성 완성 후, 나중에 달아줄겁니다.

 

그 다음, Outline Detail, Alpha Tolerance, Subdivide 값을 적절히 주고, Weights를 체크한 후, Auto Geometry를 눌러
메시(Mesh) 생성 작업을 해줬다.

 

각 뼈대를 움직여보면서 이상이 없는지 확인해본다.

 

제대로 메시가 생성되어 스프라이트와 연결됐는지 뼈대 하나하나를 다 움직여봤다. 테스트 결과, 뼈대가 전부 스프라이트와 제대로 연결되어 있는 것을 확인했다.

 

/*
저번에 테스트 안 하고 그냥 작업했다가, 오른손 뼈가 스프라이트와 연결이 제대로 안 되어 있어서 손은 안 움직이고 뼈대만 움직인 충격적인 썰이 있다....

*/

가중치를 지정해주지 않아, 뼈대를 움직이면 원하지 않는 스프라이트 움직임(전혀 상관없는 부위가 늘어지는 등)이 보이지만, 우선 메시의 가장자리 정점(Vertex)부터 맞춰주기로 했다.

 

메시의 가장자리 정점(Vertex)을 스프라이트에 맞게 맞춰주기

 

Edit Geometry를 누르면, 메시를 편집할 수 있다. 먼저 오른쪽 다리부터 수정을 해줬다.

 

오른쪽 다리 수정 전

 

정점들이 스프라이트 가장자리에 안 맞는 걸 볼 수 있다.

 

오른쪽 다리 수정 후

 

가장자리에 맞게 수정을 진행해줬다.

 

나머지 레이어별 메시들에 대해서도 똑같이 진행해주면 된다.

 

왼쪽 다리 수정 후 모습

 

왼팔 수정 후 모습

 

오른쪽 수정 후 모습

 

머리 수정 후 모습

 

몸통 수정 후 모습

관절이 꺾이는 부분이면, 정점 개수를 좀 줄였다. ( 꺾임에 따라 스프라이트도 꺾이는 수준이 심해지기 때문)
여기까지 작업을 진행한 후, 작업 내용들이 날아가는 것이 두려워 Apply를 눌러 중간 저장을 해줬다...ㅎㅎ
다음으로 뼈대를 움직이면, 원하지 않는 부분의 스프라이트까지 영향을 받던 것을 수정해주는 작업을 해줬다.

 

뼈대에 영향을 받는 스프라이트에 대해 가중치 조절하기

 

우선 각 레이어마다 Auto Weights를 눌러, 우선 자동으로 각각 가중치를 줬다.

 

Auto Weights를 몸통에 적용한 예시

 

이전 글에서도 다뤘지만, 스프라이트에 칠해져 있는 영역의 색깔은 해당 색깔의 뼈대에 영향을 받는다는 걸 의미한다.
Weight Brush를 이용해, 우선 어려운 부위인 다리부터 조정을 했다.

 

관절이 있는 부위는 정점(Vertex) 개수 설정을 잘 해줘야 접히고, 펼 때 자연스럽습니다.

 

안 쪽 무릎(빨간색 칠한 부분)은 관절이 접히면, 안쪽 살이 접혀 들어간다. 정점이 많으면 너무 과도하게 찌그러지니, 정점 개수를 줄이고, 관절 쪽에 정점을 배치를 하지 않는 방향으로 갔다.

바깥쪽 무릎(파란색 칠한 부분)은 관절이 접히면, 오히려 살이 늘어나는 부위다. 그렇기 때문에 정점 개수를 더 추가하여,
무릎살이 자연스럽게 늘어날 수 있도록 배치해줬다.

그리고, 가중치(Weight)를 Weight Brush로 조절해줘서, 해당 뼈가 움직이는데 이상한 스프라이트가 영향을 받는 것을 제거해줬다.

 

작업 후, 오른다리 무릎을 접어 본 사진

 

작업 후, 왼다리 무릎 접어 본 사진

 

나머지 부위들도 이런 부분들을 생각하면서, 정점 및 가중치 조절을 진행해줬다.

 

오른팔 작업 후 테스트 사진

 

왼팔 작업 후, 테스트 사진

 

몸통 작업 후, 다리 밑 팔, 상체 구부렸을 때 옷 접히는 부분 테스트

고도의 집중력이 요구되는 작업이다 보니,,, 생각보다 오래 걸렸다.
/*  디자이너분들 존경합니다.  */

 

대강 다 돼서, 씬(Scene)으로 배치하고 팔, 다리 위치좀 수정한 후에 마지막으로 눈을 붙여줬다.

 

최종 완성된 주인공

 

2. IK(Inverse Kinematic) 적용하기

 

우선, 계층구조를 조금 변경했다. 빈 게임오브젝트를 만들고, 기존에 만들어준 Girl 오브젝트를 자식으로 넣었다.

 

계층구조 변경

 

이렇게 해준 이유는 카메라가 주인공 캐릭터를 따라가는 형식으로 구현될 것 같아서였다.
카메라를 주인공 오브젝트의 하위 오브젝트에 달아서 주인공을 따라가게 하는 형식으로 했을 경우, 주인공 오브젝트가 만약 회전을 할 경우, 카메라도 같이 회전을 하게 된다.

 

그래서 이걸 방지하고자 분리를 해준 것이다. 공부하다가 새롭게 알게 된 내용이었는데, 너무 유익한 것 같아서 바로 적용했다. 우선 그렇게 적용을 해준 후에, Character 오브젝트에 IK Manager 2D 컴포넌트를 달아줬다.

 

관절의 움직임에 의해 발생하는 하위 관절들의 회전 등을 자동으로 계산하여 보정해주는 IK 컴포넌트

 

이게 있으면, 아무래도 애니메이션 작업하는게 수월해진다. 이걸 사용하지 않는다면, 다리를 움직일 때 발목, 정강이, 허벅지 등을 일일히 하나하나 보정해줘야 한다. 하지만 그럴 필요가 없다.

 

오른다리 발목을 잡고 들어도, 자동으로 무릎이 접히는 등의 자연스러운 관절 움직임이 구현된다.

 

이로써, 주인공 캐릭터 에셋(Asset)이 완성되었다. 디자인계열이 아니다보니 나는 인체구조학적인 지식이 없었다.
그래서 관절의 움직임, 그리고 그에 따른 신체의 변화(ex. 무릎을 접으면 안쪽 살은 접히고, 바깥 살은 늘어나는)가 어디 부분에 나타나는지 완벽하게 알진 못했다.

이것저것 참고하면서 최대한 여러 동작의 자세가 자연스럽게 나올 수 있도록 구현하려고 애썼던 것 같다. 그래도 잘 나온 것 같아서 뿌듯했다.

이제 이 캐릭터를 가지고 여러 애니메이션 클립을 딸 차례다.