소소한 나의 하루들

2d 플랫포머(2) - 아틀라스와 애니메이션 본문

개발/유니티

2d 플랫포머(2) - 아틀라스와 애니메이션

소소한 나의 하루 2024. 1. 22. 01:16

출처: https://youtube.com/playlist?list=PLO-mt5Iu5TeYI4dbYwWP8JqZMC9iuUIW2&feature=shared

 

📚 유니티 기초 강좌

유니티 게임 개발을 배우고 싶은 분들을 위한 기초 강좌

www.youtube.com

#1. 아틀라스

유니티에서 ‘아틀라스’는 여러 개의 스프라이트(sprite)를 한 장의 큰 텍스쳐에 모아놓은 것이라고 볼 수 있다.

아틀라스를 분리해서 사용하는 방법을 알아본다.

여러 2d 스프라이트가 모인 아틀라스의 Inspector의 Sprite Mode를 확인한다.

갖고 온 이미지가 오로지 단일 sprite라면 Single로 설정하고, 여러 sprite(=아틀라스)라면 Multiple로 설정한다.

 

Sprite Mode를 설정했으면, Sprite Editor를 연다.

Sprite Editor: 스프라이트 정보를 편집할 수 있는 창

 

Sprite Editor 위쪽에서 Slice를 클릭하면 Type을 선택할 수 있다.

Type이 Automatic으로 되어있는데, 이것은 이미지를 분석해서 자동으로 잡아주는 모드이다.

우측 상단 RGB 색상 아이콘을 누르면 색 대비로 어떻게 잘라냈는지 명확히 보여준다.

Type을 Grid By Cell Size로 하면, 입력한 사이즈대로 균일하게 자른다. Padding은 여백을 뜻하는데, 각 셀 사이 여백을 어느정도로 설정할지 입력 가능하다. (위 사진은 Grid By Cell Size [Pixel Size: x16 y16/Padding: x1 y1]로 설정)

Grid By Cell Count로 하면, 입력한 개수대로 균일하게 자른다. C(열), R(열)에 몇 개씩 자를지 입력하면 된다. (현재 Grid By Cell Count [C: 3 R: 3/Padding: x1 y1]로 설정)

※Padding에서 취급하는 1 단위가 Grid By Cell Count와 살짝 다르다.

Apply누르면 Cell 이미지 하나가 구분된다.

 

Sprite Editor에서 설정까지 적용한 후, 다시 Inspector에서 Apply를 누르고 Project 내 Sprites에서 아틀라스 이미지를 확인하면, 재생 아이콘이 생긴다.

재생 아이콘을 클릭하면 잘라진 Cell 이미지가 표시되는것을 확인할 수 있다.

 

새 오브젝트를 하나 생성하고, 이름을 Item으로 설정한다. sprites에서 아이템 이미지를 갖다 적용시킨다.

오브젝트 추가 후, Enemy로 이름 설정하고 몬스터 이미지 리소스를 적용시킨다.

그래서 보통 2d 게임개발할 때는 여러 cell이 포함된 아틀라스 상태로 작업을 진행한다.

 

이렇게 하나의 이미지로 묶어서 작업을 하게되면 Game 창 상단에 Statistic(상태)를 볼 수 있다.

Batch는 Draw call을 말하고, 그래픽을 그리기 위해 메모리와 CPU를 사용한 횟수를 말한다.

이미지를 하나의 파일로 묶어서 작업하면 그 횟수를 줄일 수 있다. (최적화)
*아틀라스의 스프라이트끼리는 Batch가 늘지 않는다.


#2. 애니메이션

이제 나눈 cell들 중 하나의 에니메이션으로 제작하고싶은 이미지를 다중선택한다. (ctrl로 개별선택 or shift로 연속선택)

이미지들을 다중선택해서 오브젝트에 그대로 적용한다. (드래그 앤 드롭)

그러면 애니메이션 파일이 새로 생성된다. (Animation 폴더 생성 후 Walk1 이름으로 저장)

 

애니메이션 파일을 생성하면, Player 오브젝트에 Animator 오브젝트가 추가된다.

Animator 컴포넌트: 애니메이션을 관리하는 컴포넌트 (=Animation Controller)

*애니메이션 파일 생성 전 직접 추가해도 괜찮다.

애니메이션 파일을 생성하면 하위 폴더에 'Animation 폴더'와 직접 설정한 이름으로 오브젝트의 이름으로 'Animator Controller'가 생성된다.

실행시키면, 적용한 애니메이션대로 캐릭터가 움직인다. 그냥 쭉 재생이 된다. 보통 이런 애니메이션을 페이지 애니메이션이라고 한다.

 

이제 Window 메뉴>Animation을 클릭해서 창을 열어본다.

이제 이 Animation 창을보면, animation walk1이 어떻게 흘러가는지 쭉 나와있다.

각 하나하나의 이미지를 Key Frame이라고 하는데, Key Frame은 애니메이션 값을 가진 프레임을 말한다.

지금 각 프레임 간 시간이 0.01초로 되어있는데, 시간 간격을 맘대로 늘려서 조절할 수 있다.

그리고 실행하면 애니메이션이 자동적으로 반복되고있는데, 현재 애니메이션 클립 파일로 가서 Loop Time을 체크해제하면 반복되지 않는다.


#3. 애니메이터

그리고 이미 애니메이션을 적용한 오브젝트에 다른 애니메이션을 적용하려고 드래그 적용하고 파일 생성을 하여도, 실행하면 그대로인 경우가 있다.

그러면 오브젝트에 이미 애니메이션을 적용했으면, 다른 오브젝트로 변경이 불가능한건가?

Window 메뉴>Animation>Animator를 연다.

 

Animator(또는 메카님)이라는 창에서는 오브젝트에 대해서 어떤 상황에서 어떤 애니메이션을 실행시킬지 흐름을 결정할 수 있다.

Anitmator에 떠있는 박스 하나는 State라고 부르는데, 애니메이션 상태를 관리하는 애니메이터 단위이다.

'Entry'는 맨 처음 시작할 때 start같은 존재이다. (맨 처음 어떤 것을 기준으로 잡을 것인가)

변경하려는 애니메이션의 State(박스)를 누르고, 마우스 우클릭>Set at Layer Default State를 클릭한다. (기본 State로 바꿈)

다시 실행시키면 애니메이션이 적용된 것을 볼 수 있다.

재생하는 애니메이션의 속도가 너무 빠르면, 아까 살펴본 Animation 창에서 시간초를 조절하거나(1) / Animator에서 해당 애니메이션 state를 클릭하면 나오는 Speed 옵션을 조절한다.(2)

*만약 Animation창에서 시간 초를 조절했을 때 마지막 프레임에서 첫번째 프레임으로 바로 넘어가서 부자연스러워보이면, 마지막 프레임을 전 프레임과 동일한 간격으로 마지막 다음에 위치시켜주면 된다. [첫번째→마지막→첫번째]

Animation 창에서 Transform을 움직이거나, Capsule Collider를 켜고 끄거나 등의 설정할 수 있다.

Comments