유니티 강좌 05. 화면 흔들림 효과

게임 속에는 다양한 효과들이 적용되어 있습니다. 일반적으로는 알지 못하는 효과이더라도 모두 게임을 역동적으로 만들어주는 중요한 역할을 하고 있죠. 그 중 하나가 바로 화면 흔들림 효과입니다. 플레이어가 땅에 착지하거나, 총을 쏘거나, 공격을 받거나 할 때 화면이 조금씩 흔들리면 어떠한 충격이 있다는 것을 간접적으로 전달할 수 있죠. 이번 강좌에서는 유니티 애니메이션 기능을 활용해서 화면 흔들림 효과를 구현해 보도록 하겠습니다.

---

유니티 강좌 03. 2D 플레이어 추적 AI 만들기

유니티 강좌 04. 2D 랜덤 패트롤 AI

---

유니티는 기본적으로 매우 강력한 애니메이션 기능을 제공하고 있습니다. 상단 메뉴에서 Windows > Animation > Animation 항목을 클릭하시면 위 사진과 같은 창이 열립니다. 여기에서 저희는 필요한 애니메이션을 직접 만들 수 있죠. 우선 Hierarchy 탭에서 메인 카메라 오브젝트를 선택한 뒤 Animation 창에 활성화되는 Create 버튼을 클릭해 줍시다.

이제 생성한 애니메이션을 저장할 위치를 지정해야 합니다. 저는 Asset 폴더에 저장하도록 하겠습니다. 이름은 Idle로 설정해 줍시다.

애니메이션을 생성하고 나면 Animation 창에 위 사진처럼 타임라인이 생성됩니다. 여기에 직접 이미지들을 추가하면서 애니메이션을 만들 수도 있지만, 저희는 오브젝트의 Transform 값들을 수정해가면서 애니메이션을 만들어 보도록 하겠습니다. 이렇게 하면 매우 간단하게 애니메이션을 만들 수 있죠. 우선 좌측 상단에 있는 빨간 녹화 버튼을 눌러줍시다. 이 버튼을 누르게 되면 오브젝트에 생기는 변화들이 기록되면서 애니메이션화 됩니다.

프레임을 0에 둔 상태에서 카메라의 position 값을 0,0,-10로 변경해 줍시다. 그러면 위 사진과 같이 키 프레임이 생성되는 걸 볼 수 있습니다. Idle은 한마디로 대기 상태, 즉 평소에 카메라가 가만히 있을 위치라고 생각하시면 됩니다. 흔들림 애니메이션을 실행할 때가 아니라면 Idle 상태를 유지하도록 하는 거죠.

이제 흔들리는 애니메이션을 생성해 봅시다. Animation 창 좌측 상단에 저희가 방금 만들었던 Idle 이름을 클릭하시면 카메라 오브젝트에 소속된 애니메이션들이 뜨고, 그 아래 Create New Clip 버튼이 있습니다. 클릭해서 Shake라는 새로운 애니메이션을 만들어 줍시다.

Idle 애니메이션과 같이 녹화를 통해 카메라의 position 위치를 기록해 줄 겁니다. 녹화 버튼을 클릭한 다음 0프레임에 -0.2,0,-10, 4 프레임에 0.1, 0, -10, 8 프레임에 -0.1, 0, -10, 12 프레임에 0.2, 0, -10을 각각 기록해 줍시다. 그 다음 플레이 버튼을 한번 클릭해서 만든 애니메이션을 확인해 보겠습니다. 카메라가 알아서 기록된 위치로 왔다 갔다 하는 게 보이시나요? 유니티 애니메이션의 강점은 바로 모든 프레임에 값을 입력하지 않아도 된다는 것입니다. 저희가 방금 했던 것처럼 큰 포인트들만 찍으면 자동으로 부드럽게 작동하는 애니메이션이 만들어집니다. 이걸 응용하면 캐릭터 움직임과 같은 복잡한 애니메이션도 간편하게 만들 수 있죠. 

애니메이션을 만들었으니 이제 애니메이션을 서로 연결시켜 줘야겠죠. Windows > Animation > Animator을 클릭하시면 Animator 창이 열립니다. 하나씩 살펴보도록 할까요? 일단 다섯 가지 상자들이 있는 걸 볼 수 있습니다. Entry, Any State, Exit, Idle, Shake 가 있는데요, Idle 과 Shake는 저희가 방금 만들었던 애니메이션이고, Entry, Any State, Exit 상자는 어떤 상태에서 애니메이션을 시작할지 연결해 주는 상태창이라고 생각하시면 됩니다. 

Idle 상자를 보시면 주황색으로 되어있고, Entry 상자와 연결되어 있습니다. 제일 처음 생성한 애니메이션이 기본 애니메이션으로 설정되는데요, 저희의 경우에는 Idle 애니메이션이죠. 게임을 시작하면 Entry 상자를 통해 기본 애니메이션인 Idle 애니메이션이 자동으로 실행되게 됩니다.

애니메이션들을 서로 연결하기 전에 어떤 상황에 애니메이션을 실행할지 알려주는 파라미터(Parameter)를 생성해야 합니다. 파라미터는 나중에 코드에서 애니메이션을 실행시켜줄 연결고리 역할을 합니다. Float, Int, Bool, Trigger 이렇게 네 가지 형식으로 만들 수 있습니다. 저희는 한 번씩 트리거하는 형식으로 애니메이션을 실행할 것이기 때문에 Trigger 파라미터를 만들도록 하겠습니다. Animator 창 좌측 상단에서 Parameters 탭으로 들어간 + 버튼을 클릭해서 Trigger 파라미터를 하나 생성해 줍시다. 이름은 shake로 설정하겠습니다.

Shake 애니메이션은 Idle 상태일 때만 실행되어야 하기 때문에 Idle 상자와 연결시켜 줄 겁니다. Idle 상자를 우클릭하고 Make Transition을 선택하면 연결 선이 생기는데요, 그대로 Shake 상자를 클릭해서 서로 연결시켜 줍시다. 흔들리는 애니메이션이 끝나면 다시 기본 상태로 돌아가야 하기 때문에 같은 방법으로 Shake와 Idle 상자도 연결시켜 줍시다. 완료했다면 위 사진처럼 양방향으로 연결되어  있을 겁니다.

Idle에서 Shake로 이어지는 선을 클릭하면 Inspector 창에서 변수들을 조절할 수 있습니다. 하단에 있는 Conditions 칸에서 + 버튼을 클릭하면 저희가 아까 만든 파라미터가 뜨는데요, shake 파라미터가 맞게 들어갔는지 확인해 줍시다. 그 다음 Has Exit Time 옵션을 해제하고 Settings 칸을 펼쳐서 Transition Duration을 0으로 바꿔줍시다. 

이번에는 Shake에서 Idle로 넘어가는 부분을 수정해 봅시다. Shake 애니메이션이 끝나면 자동으로 Idle로 넘어가도록 해야 하기 때문에 Conditions는 따로 추가할 필요가 없습니다. Has Exit Time 옵션은 활성화해주고 Exit Time은 1, Transition Duration은 0으로 설정해 줍시다.

코딩으로 넘어가기 전에 마지막으로 설정해야 할 한 가지가 남았습니다. 프로젝트 탭에서 Shake 애니메이션을 찾은 후 Inspector 탭에서 Loop Time 옵션을 해제해 줍시다. 이게 활성화 되어있으면 애니메이션이 반복해서 작동되게 됩니다. 저희는 한 번만 작동하기 원하기 때문에 해제해야 합니다.

using UnityEngine;

public class Shake : MonoBehaviour
{
    public Animator anim;

    private void Update()
    {
        if (Input.GetKeyDown(KeyCode.Space))
        {
            anim.SetTrigger("shake");
        }
    }
}

자 이제 기본적인 설정이 다 끝났습니다. 본격적으로 코딩 작업을 시작해 보도록 하죠. Shake 스크립트를 생성해서 플레이어 오브젝트에 적용시켜 줍시다. 이번 코드는 매우 간단하네요.

public Animator anim;

저희가 사용할 변수는 하나 밖에 없습니다. 메인 카메라에 적용시켰던 애니메이터를 불러와야 하기 때문에 public 변수인 anim 하나만 만들어 주도록 하겠습니다. 

private void Update()
{
    if (Input.GetKeyDown(KeyCode.Space))
    {
        anim.SetTrigger("shake");
    }
}

스페이스 바를 누르면 화면이 흔들리도록 만들어 보겠습니다. Input.GetKeyDown() 함수는 키보드 버튼 입력을 확인하는 함수입니다. 그 중 저희는 KeyCode.Space, 즉 스페이스 바 입력을 확인해야 하죠. 스페이스 바 입력이 확인되면 애니메이션을 실행하게 됩니다. 저희가 아까 애니메이터에서 만들었던 파라미터는 Trigger 형식이었죠. 그렇기 때문에 저희는 SetTrigger() 함수를 사용해서 만들었던 shake 파라미터를 트리거 해줍시다. 

테스트하기 전에 플레이어 Inspector 창으로 들어와서 메인 카메라를 Anim 항목에 드래그해 적용시켜 줍시다. 그러면 자동으로 메인 카메라에 있는 애니메이터가 변수에 입력됩니다.

자, 이제 테스트만 남았네요. 유니티 중앙 상단에 있는 플레이 버튼을 클릭해서 화면이 잘 흔들리는지 살펴보도록 하겠습니다. 스페이스 바를 누르면 화면이 잘 흔들리네요. 성공입니다!

---

유니티 강좌 05. 2D 플랫포머 이동