언리얼 엔진에서 키프레임 애니메이션 작업 방법

언리얼 엔진으로 키프레임 애니메이션을 작업하고 싶으신가요? 그렇다면 이 페이지를 주목하세요! 여기에서는 키프레임 애니메이션에 대해 살펴보고 이를 작업하는 방법을 단계별로 알아봅니다.


키프레임 애니메이션이란 무엇인가요?

애니메이팅 방법을 학습하면서 키프레임이라는 단어를 들어본 적이 있을 것입니다. 키프레임이란 정확히 무엇이고, 애니메이션과 어떤 관련이 있을까요? 

애니메이션은 프레임으로 구성되어 있습니다. 프레임이란 빠른 속도로 재생할 때 사람의 눈에 연속적인 동작으로 인식되는 일련의 그림, 렌더링 또는 사진을 의미합니다. 영화도 마찬가지입니다. 영화 필름에 찍힌 개별 이미지가 고속으로 재생되면서 실제로 움직인다고 믿게 만드는 것이죠.
애니메이션 제작 시, 아티스트가 애니메이션 타이밍을 조절하기 위해 키프레임을 사용하는 경우가 많습니다. 키프레임은 트랜지션의 시작 또는 종료 지점을 설정하므로, 그 중간의 프레임은 개별적으로 채울 수 있습니다. 예를 들어, 1초 동안 캐릭터의 팔을 위로 들어 올린다고 가정해 보세요. 게임은 주로 30fps로 제작되기 때문에 1초 동안의 동작을 만들기 위해 30개의 이미지/프레임이 필요합니다. 캐릭터가 1초 동안 팔을 올리도록 하려면 프레임 1과 프레임 30에 각각 키프레임을 설정하면 됩니다. 애니메이션 소프트웨어에서 작업물을 재생하면 두 키프레임 사이의 프레임이 자동으로 '채워지고' 팔이 1초 동안 부드럽게 올라갑니다.

애니메이션을 손으로 그리던 시절에는 선임 애니메이터가 키프레임을 정해주면 신입 애니메이터가 그 중간의 프레임을 그리는 방식으로 작업하곤 했습니다. 컴퓨터 애니메이션에서는 아티스트가 키프레임만 설정하면 소프트웨어가 중간 프레임을 채워줍니다. 출력을 보다 세밀하게 제어해야 하는 고급 워크플로에서는 퍼포먼스 캡처, 게임 메커니즘 등을 사용하여 진행할 수도 있습니다.
 

언리얼 엔진으로 애니메이팅하기

언리얼 엔진은 게임 엔진입니다. 원래 3D 게임 개발을 위한 플랫폼으로 만들어진 언리얼 엔진에는 키프레임을 비롯하여 수많은 애니메이션 기능이 포함되어 있습니다. 덕분에 점점 더 많은 스튜디오에서 콘텐츠 제작을 위한 기반 툴로 사용하고 있습니다. 

다음 안내에 따라 언리얼 엔진으로 첫 번째 애니메이션 제작을 시작해 보세요. 이 강좌에서는 미닫이 문을 애니메이팅합니다. 이 단축키/세팅 가이드는 시간 절약에 큰 도움이 되니 꼭 확인해 보시기 바랍니다.
 

사양

이 튜토리얼에 필요한 모든 툴과 에셋은 무료로 다운로드할 수 있습니다. 하지만 이를 사용하려면 꽤 성능이 뛰어난 컴퓨터와 36GB의 여유 디스크 공간이 필요합니다. 하드웨어 사양에 대한 자세한 내용은 이 언리얼 엔진 문서를 확인하세요.

시작하기 전에 에픽게임즈 런처를 다운로드 및 설치하고 언리얼 엔진을 설치해야 합니다. 런처를 처음 실행하면 무료 에픽게임즈 계정을 만들거나 로그인하라는 메시지가 표시됩니다. 적절한 로그인 방법을 선택하세요.
언리얼 엔진을 설치하려면 왼쪽에서 언리얼 엔진(Unreal Engine) 탭을 클릭한 후 런처 오른쪽 상단에서 엔진 설치(Install Engine)를 클릭합니다. 최신 버전의 언리얼 엔진이 설치되는 동안 잠시 기다려 주세요. 디스크 공간을 절약하려면 필수 컴포넌트만 설치하도록 선택할 수 있습니다.

에픽게임즈 런처 및 언리얼 엔진 설치 방법에 대한 단계별 안내는 이 비디오를 참고하세요.
 

오브젝트 애니메이팅 방법

언리얼 엔진이 설치되었으니, 마켓플레이스 씬을 찾아서 엔진에서 열어보겠습니다. 마켓플레이스에는 언리얼 엔진에서 즉시 사용할 수 있는 오브젝트, 캐릭터, 이미지, 오디오 파일 등 다양한 에셋이 있습니다.
  1. 에픽 런처에서 마켓플레이스(Marketplace) 탭을 클릭합니다.
  2. 마켓플레이스에서 '공상과학 통로'를 검색합니다.
  1. 검색된 에셋을 클릭하고 무료(Free)를 클릭한 다음 프로젝트 생성(Create Project)을 클릭합니다. 프로젝트 이름 및 위치 선택(Choose Project Name and Location) 대화창이 표시되면 폴더 위치와 프로젝트 이름을 선택하고 생성(Create)을 클릭합니다. 프로젝트가 컴퓨터에 다운로드되는 동안 잠시 기다려 주세요.
  1. 다운로드한 프로젝트를 찾아서 실행하려면 화면 상단의 라이브러리(Library) 탭을 클릭합니다. 공상과학 통로 프로젝트가 목록에 표시됩니다. 언리얼 엔진에서 프로젝트를 더블클릭하여 엽니다. 프로젝트를 로딩하는 동안 잠시 기다려 주세요. 
화면 좌측 상단에 '라이팅을 다시 빌드해야 합니다(LIGHTING NEEDS TO BE REBUILT)'라는 메시지가 표시될 수 있습니다. 이 메시지를 무시해도 문제가 되지는 않지만, 이 메시지를 없애고 싶다면 빌드(Build) 메뉴 > 라이팅만 빌드(Build Lighting Only)를 클릭하고 라이팅이 리빌드될 때까지 몇 분 정도 기다리면 됩니다. 이후 언제라도 프로젝트를 작업하는 동안 이 메시지가 표시되면 동일한 방식으로 메시지를 없앨 수 있습니다.
언리얼 엔진에는 뷰포트 상하좌우 컨트롤과 함께 씬을 표시하는 원근 뷰포트가 포함되어 있습니다. 3D 모델링 소프트웨어를 사용해본 경험이 있다면 이미 뷰포트와 컨트롤 시스템에 익숙할 것입니다.

뷰포트는 라이트 오브젝트, 리플렉션 스피어 등 여러 비렌더링 오브젝트를 표시합니다.
  1. 뷰포트를 클릭하고 G를 눌러 비렌더링 오브젝트를 숨기면 실제 렌더링 가능한 씬을 볼 수 있습니다.
  1. 잠시 시간을 들여 뷰포트 탐색 컨트롤을 사용해 보며 씬을 살펴보세요.
왼쪽 마우스 버튼 + 드래그 앞뒤로 이동하고 좌우로 회전합니다.
오른쪽 마우스 버튼 + 드래그 뷰를 회전합니다.
왼쪽 및 오른쪽 마우스 버튼 + 드래그 위아래 또는 좌우로 이동합니다.

여러 가지 방법으로 뷰포트를 탐색할 수 있습니다. 이중 일부는 익숙할 수도 있습니다. 예를 들어, 커서 키와 마찬가지로 Maya에 사용되는 표준 키도 여기에서 작동합니다. 뷰포트 조작법에 대한 자세한 정보는 뷰포트 조작법 도움말 페이지를 확인하세요.
  1. 양쪽에 식물이 있는 주황색 문을 바라보도록 아래 이미지와 비슷하게 뷰를 조정합니다.
  1. 왼쪽 주황색 문을 클릭하여 선택합니다. 화면 우측 상단의 아웃라이너(Outliner) 창에 Fond_Wall_3 오브젝트가 선택된 것으로 표시됩니다. 문을 선택하면 문 좌측 하단에 작은 삼각 축이 표시됩니다.
참고: 삼각 축이 표시되지 않으면 키보드의 W를 누르세요. 그러면 삼각 축이 표시됩니다.

다음으로는 이 오브젝트를 애니메이팅할 수 있도록 시퀀서 모듈에 추가하겠습니다. 시퀀서는 비선형 에디터와 비슷한 키프레임 에디터 역할을 합니다.
  1. 메인 툴바에서 영화 슬레이트처럼 생긴 시네마틱(Cinematics) 버튼을 클릭하고 레벨 시퀀스 추가(Add Level Sequence)를 선택합니다. 에셋을 다른 이름으로 저장(Save Asset As) 대화창이 표시되면 이름(Name) 필드의 이름을 확인하고 저장(Save)을 클릭합니다. 그러면 시퀀서 모듈이 열립니다.
참고: 시퀀서를 실수로 닫은 경우, 화면 하단의 콘텐츠 드로어(Content Drawer)를 클릭하거나 Ctrl + 스페이스 바를 눌러 다시 열 수 있습니다.
  1. 시퀀서에서 창 좌측 상단의 트랙(Track) 버튼을 클릭합니다. 액터를 시퀀서로(Actor to Sequencer) 옵션을 선택하고 Fond_Wall_3 오브젝트를 선택합니다. 검색 필드에 오브젝트 이름을 일부 입력하면 목록에서 오브젝트를 빠르게 찾을 수 있습니다.
그러면 시퀀서에 문 오브젝트에 대한 트랙이 생성됩니다. 다음으로는 문을 위로 밀어서 위치를 애니메이팅하겠습니다.
  1. 시퀀서에서 트랜스폼(Transform) 왼쪽 화살표를 클릭하여 3개의 트랜스폼 트랙을 확장합니다. 이제 위치(Location) 트랙을 애니메이팅할 수 있습니다.
참고: 0000 위치에 있는 주황색 마커를 플레이헤드라고 부릅니다. 플레이헤드의 현재 위치는 키프레임 영역 왼쪽에 주황색 텍스트로 표시됩니다.
  1. 대부분의 애니메이터가 fps(초당 프레임 수)를 사용하므로, 시간 스케일은 기본적으로 프레임 번호로 표시됩니다.  이 튜토리얼에서는 입문자도 쉽게 알아볼 수 있도록 표시되는 시간 스케일을 초로 바꾸겠습니다. 그렇게 하려면 시퀀서 툴바에서 초당 프레임(Frames Per Second) 메뉴를 찾습니다. 시간을 다음으로 표시(Show Time As)를 선택하고 시간 표시를 초(Seconds)로 변경합니다.
  1. 이제 벽 위치의 키프레임 시간을 0.00으로 설정하겠습니다. 위치 트랙에서 + 버튼을 클릭하여 0.00에 키프레임을 추가합니다.
  1. 다음 작업은 문의 키를 시퀀서에서 3초로 설정하는 것입니다. 먼저 주황색 플레이헤드를 3.00 눈금까지 드래그합니다.
  1. 왼쪽 문이 선택되었는지 확인하고 뷰포트에서 문 좌측 하단의 삼각 축을 찾습니다. 축 위쪽 화살표를 위로 드래그하여 문을 밀어서 엽니다.
  1. 위치 트랙에서 + 버튼을 클릭하여 3.00초에 키프레임을 추가합니다.
  2. 플레이헤드를 드래그하여 애니메이션을 스크럽합니다. 문이 0.00초의 닫힘 위치에서 3.00초의 열림 위치로 움직이는 것을 볼 수 있습니다. 축하합니다. 애니메이션을 만들었습니다!
이제 키프레임 설정 방법을 알았으므로, 시퀀서에 트랙으로 추가하고 이를 이동하여 무엇이든 원하는 대로 애니메이팅할 수 있습니다. 예를 들어, 문 선택, 키프레임으로 이동, 문 이동, 키 설정이라는 동일한 프로세스를 적용하여 다른 문도 열 수 있습니다.

이제 확인을 위해 애니메이션을 출력하는 방법을 알아보겠습니다. 이를 위해서는 먼저 씬에 카메라가 필요합니다.
  1. 시퀀서 툴바에서 카메라 생성(Create Camera) 버튼(카메라 아이콘)을 클릭하여 씬에 카메라를 만듭니다. 그러면 애니메이션 프레임을 볼 수 있는 카메라 컷(Camera Cuts)을 비롯하여 여러 카메라 트랙이 생성됩니다.
카메라에 보이는 것을 표시하도록 뷰포트가 변경되고, 왼쪽 상단에는 '파일럿 활성화(Pilot Active)' 라벨이 표시됩니다. 이 라벨은 뷰포트 탐색 컨트롤을 사용하여 카메라를 '조종'할 수 있음을 의미합니다. 이러한 컨트롤을 사용하여 원하는 렌더링 방식으로 뷰를 표시할 수 있습니다.

이제 애니메이션을 무비 파일로 출력할 준비가 되었습니다. 언리얼 엔진에서 이 씬을 렌더링하면 프레임당 1초도 안 되는 속도로 렌더링이 수행됩니다. 
  1. 시퀀서 툴바에서 렌더(Render) 버튼(슬레이트 아이콘)을 클릭하여 렌더 무비 세팅(Render Movie Settings) 대화창을 엽니다.
  1. 렌더 무비 세팅 대화창에서 이미지 출력 포맷(Image Output Format)비디오 시퀀스(avi)(Video Sequence (avi))로 설정되었는지 확인합니다. 
  2. 출력 디렉터리(Output Directory) 필드 오른쪽의 점 세 개 아이콘을 클릭하여 프로젝트의 콘텐츠(Content) 폴더를 엽니다.
  3. Renders 폴더를 생성합니다. 이 폴더를 선택하고 렌더 무비 세팅 대화창으로 돌아갑니다.
  4. 무비 캡처(Capture Movie)를 클릭하여 무비를 폴더에 렌더링합니다. 콘텐츠 저장 대화창에서 '선택 저장(Save Selected)'을 클릭하여 렌더링하기 전에 씬을 저장합니다.
렌더링이 완료되는 데 몇 초 정도 걸립니다. 이제 렌더링된 무비를 감상할 수 있습니다.
  1. 언리얼 엔진 외부에서 시스템 폴더 탐색 툴(예: Windows 파일 탐색기)을 사용하여 Renders 폴더로 이동합니다. 폴더에서 비디오를 더블클릭하여 원하는 비디오 플레이어로 감상합니다. 
 

키프레임 애니메이션 여정 계속하기

애니메이션 학습을 계속하려면 위의 씬을 계속 애니메이팅하거나 언리얼 엔진 마켓플레이스에서 다른 학습 항목을 선택할 수 있습니다. 또한 에픽 디벨로퍼 커뮤니티에서 애니메이션 강좌를 포함하여 수백 시간 분량의 온라인 러닝을 찾아볼 수 있습니다.

언리얼 엔진 문서에는 애니메이션에 시퀀서 사용 방법에 관한 여러 유용한 내용이 포함되어 있습니다. 또한 애니메이션 허브 및 무료 애니메이션 현장 가이드에서 애니메이션에 언리얼 엔진을 사용하는 전문 스튜디오로부터 영감을 얻을 수 있습니다.

캐릭터 애니메이팅을 시작하고 싶다면 리얼타임 캐릭터 애니메이션 교육 소개도 확인해 보세요.

더 많은 리얼타임 알아보기


리얼타임 알아보기

영화 속 애니메이션

리얼타임 알아보기

증강현실이란 무엇일까요?

관련 블로그


애니메이션

4월 말, 언리얼 엔진, 트윈모션, 리얼리티캡처의 가격이 업데이트됩니다

애니메이션

3월 언리얼 엔진 마켓플레이스 세일: 2,000개 이상의 에셋을 50% 할인된 가격으로 만나보세요

애니메이션

2월 마켓플레이스 세일: 2,000개 이상의 에셋을 50% 할인된 가격으로 만나보세요