LottieFiles After Effects 플러그인 사용법 및 신규기능 총정리 - 로티 애니메이션 파일 만들기, 저장하기, 불러오기

안녕하세요 재키입니다!
LottieFiles가 오랜만에 After Effects 플러그인을 대규모로 업데이트했어요. 애니메이션 작업을 주로 하는 디자이너라면 이번 업데이트가 정말 반가운 소식일 거예요. 특히, 에펙에서 애니메이션을 수정하고 완성도를 높이는 작업을 하는 분들에게 꼭 필요했던 기능들이 추가됐거든요. 작업 시간을 줄여주고, 효율성을 높이는 변화가 가득합니다. 그래서 이번 글에서는 새롭게 추가된 기능과 그 활용법을 직접 써본 경험을 바탕으로 쉽게 풀어드리려고 해요. 자, 지금부터 하나씩 알려드릴게요.

잠깐, 아직 Lottie 에프터 이펙트 플러그인을 설치하지 않았다면 아래 포스트를 참고해서 플러그인을 다운로드해주세요!

[Lottie] 로티 애니메이션 만들기 3편 - 에프터 이펙트에 로티 플러그인 설치하기 (어도비 플러그인

 

들어가기 전에 몇 가지 팁을 알려드릴게요
1. 에펙에서 로티 플러그인 켜는 법: [Window > Extensions > LottieFiles] 클릭해 주세요

 
2. 에펙 플러그인 패널 옮기는 법: 플러그인 패널의 상단 탭 이름을 클릭 후, 드래그하면 원하는 곳으로 옮길 수 있어요.

 

로티 파일즈 에펙 플러그인
사용법 및 신규기능 총정리

Lottiefiles 플러그인의 새로운 화면 구성은 총 3가지 타입으로 나뉘어요. 먼저 Comps(컴포지션), Workspaces, Imports로 각각의 기능을 순서대로 소개하고 새로 추가된 기능들을 설명해 드릴게요. 

 

1. Comps탭.  컴포지션 작업 파일 확인 및 미리 보기

첫 번째 탭은 Comps(컴포지션)으로 애프터이펙트에서 만든 컴포지션들을 한 번에 렌더링 할 수 있고, 파일을 저장하기 전에 preview를 통해 영상이 잘 추출될 수 있는지 확인할 수 있는 탭이에요. 제가 만든 애니메이션이 파일이 잘 열리는지 확인해 볼게요. 

귀엽게 점프하는 필로의 애니메이션으로 설명해 드리겠습니다 ㅎㅎ

 

1. Comps에서 추출할 컴포지션을 선택하고, Render을 선택해 주세요.

 

2. Save file and render를 눌러주세요

 

3. 렌더링 완료!

이렇게 렌더링이 끝나면, 에프터 이펙트에서 작업한 파일의 프리뷰를 Comps 탭에서 확인할 수 있어요. 매니저님에게 듣기로는 이번에 여러 컴포지션을 한 번에 렌더링 할 수 있는 멀티 컴포지션 렌더링 기능이 추가되어 작업 속도가 훨씬 빨라졌다고 해요. 이와 함께, 이번 업데이트의 핵심 포인트인 새로운. lottie 그래픽 엔진이 도입되면서 성능과 확장성이 크게 개선되었다고 합니다.
 

Comps 탭의 나머지 부분은 기존에 있었던 기능이지만 UI가 좀 더 내용을 보기 좋게 개편됐어요. 간단하게 하나씩 소개해드릴게요. 재생 바 우측에 아이콘들은 각각 Looping 기능과 preview 배경색 변경 기능이에요.

Looping은 말 그대로 애니메이션을 무한 반복해서 볼 수 있고, preview에서는 배경색을 바꿔서 애니메이션을 확인해 볼 수 있어요.

Download 다운로드에서는 로티 애니메이션을 어떤 형식으로 저장할지 선택할 수 있어요. 가장 위에는 로티파일즈의 개발 자체 그래픽 엔진 기술이 들어간. lottie 형식으로 추출할 수 있어요. 기존의. json 형식이 아니기 때문에 디자이너인 경우, 개발자와 논의 후 사용할 수 있는지 확인해 보시면 좋을 것 같아요. 
 

Feature Checker를 통해 에펙에서 지원되는 기능과 그렇지 않은 기능을 미리 확인할 수 있고, 문제가 있는 경우 어떤 기능을 고쳐야 할지 알 수 있어요.

그 외에서 Rander Graph를 확인하고, 모바일에서 렌더링을 미리 확인해 보일 수 있는 Mobile Test 옵션이 있어요. 모바일 테스트 기능은 LottieFiles app으로 사용할 수 있고 그 전에 이 파일을 workspace에 업로드해야 해요.
 

2. Workspaces탭. 작업 파일 관리 및 저장하기

이제 에펙으로 영상 작업을 마쳤다면 파일을 저장해야겠죠. Json 파일을 저장하는 2가지 방법이 있는데요, 하나는 LottieFiles의 클라우드 저장공간인 Workspaces에 저장하거나 직접 로컬(나의 컴퓨터)에 저장하는 방법이 있어요. Workspaces에서는 작업한 파일을 로컬에 저장하려면 Pro 계정이 필요하지만, 무료 사용자는 워크스페이스에 파일을 업로드해 브라우저에서 바로 확인할 수 있어요.

이어서 렌더링이 끝난 파일을 workspace에 저장하는 법을 안내해 드릴게요. 우선 아까 전과 동일하게 Comp탭에서 저장할 파일을 선택 > Render 버튼까지 눌러준 상태에서 시작해 주세요.

1. 아래 Save to workspace 버튼을 눌러주세요.

 

2. 저장할 곳을 선택하고 Save 버튼을 눌러주세요

 

3. workspace에 업로드 완료!

Insert to AE 기능은 워크스페이스에 저장된 파일을 클릭 한 번으로 에펙에 불러올 수 있다고 하네요. 아직 베타 기능이지만 버그만 줄어들면 유용할 것 같아요.
반대로 New Version 기능을 활용하면 에펙에서 수정된 파일을 Workspace에 새로운 버전으로 저장할 수 있어 빠르게 업데이트된 파일을 확인할 수 있답니다.
 

3. Imports탭.  Json 파일 불러오기

이번에 새롭게 추가된 Import 탭은 많은 디자이너들이 기다리던 기능이에요! 기존에는 Bodymovin 플러그인을 설치해야 Json 파일을 에펙으로 불러올 수 있었지만, 이제는 LottieFiles 플러그인만으로 json 파일을 간편하게 불러올 수 있게 되었어요. 

 
로티애니메이션 (json파일)을 에펙에 불러오는 법을 하나씩 안내해 드릴게요. 

Json 파일을 애프터이펙트로 불러오는 방법

1. 먼저 Browse 버튼 > json 파일 선택해 주세요.

 

2. preview가 잘 작동되는지 확인 후, "Insert to AE"를 눌러주세요

 

3. Import 완료!

짠! 이렇게, 레이어마다 키프레임들이 모두 불러와진 걸 확인할 수 있네요!
 

 
Import 기능은 특히 Figma나 Phase, Lottie Creator로 간단히 제작한 애니메이션을 에펙으로 가져와 더 정교하게 수정할 수 있다는 점이 큰 장점이에요. 참고로 Imports는 아직 베타 기능이라 복잡한 애니메이션은 버그가 있으니, 문제 상황이 생긴다면 이 메일 주소로 james@lottiefiles.com 매니저님에게 리포트를 보내시면 하나씩 확인해 주실 거예요. 메일을 보내실 때, 영상 첨부까지 하면 더 빠르게 대응해 주실 수 있다고 하십니다.

 
LottieFiles의 After Effects 플러그인은 이번 업데이트로 더욱 강력하고 편리한 도구가 되었어요. 작업 효율을 높여주는 다양한 기능과 새로운 Import 탭은 여러 모션 그래픽 툴을 번갈아가며 쓰던 저에겐 특히 반가운 소식이었어요. 아직 베타 단계인 기능에서는 복잡한 그래픽을 불러올 땐 버그가 있을 수 있지만, 적극적으로 피드백을 제공하면 더 나은 개선을 기대할 수 있을 것 같아요.

저도 이번 업데이트를 통해 작업 과정이 훨씬 수월해졌는데, 여러분도 꼭 한번 사용해 보시길 추천드려요. 플러그인의 다양한 가능성을 탐구하며 모션 그래픽 작업을 더 쉽고 재미있게 만들어 보세요!

추가로 더욱 자세한 내용이 궁금하다면, 댓글을 남겨주시거나 로티파일즈 코리아 커뮤니티 단톡방에서 편하게 질문 남겨주세요.

LottieFiles 애니메이션
사용법 시리즈

에펙 없이 피그마에서 바로 로티 애니메이션 만드는 방법! 👇

[LottieFiles] Figma 피그마에서 Lottiefiles 플러그인으로 애니메이션 만드는 5단계