728x90
300x250
SMALL
Lottie 애니메이션 만드는 방법
Lottie 애니메이션은 주로 After Effectsㄹ 제작된다. AE에서 애니메이션을 만든 후, Bodymovin이라는 플러그인을 통해 JSON으로 추출한다.
준비물
- Adobe After Effects 설치
- Bodymovin 플러그인 (AE에서 설치 가능)
- 또는 LottieFiles 웹사이트(직접 다운로드 or 편집)
제작 과정
1. AE에서 애니메이션 제작
- 텍스트, 도형, 패스 등을 활용한 벡터 애니메이션 제작
- 이미지 사용 시 JSON 파일 크기 증가 주의!
2. Bodymovin으로 추출
- 윈도우 메뉴 > Extensions > Bodymovin
- 원하는 컴포지션 선택 후 Render클릭
- .json 파일 생성됨
3. 웹에서 미리보기(LottieFiles 추천)
- LottieFiles.com에서 Json업로드해 결과 미리보기 가능
728x90
반응형
LIST
'Front-end > 애니메이션' 카테고리의 다른 글
| Lottie 애니메이션 제어하기(재생/정지/속도 등) (0) | 2025.05.06 |
|---|---|
| 웹사이트에 Lottie애니메이션 적용하기 (0) | 2025.05.06 |
| Lottie란 무엇인가? 초보자도 이해하는 애니메이션 솔루션 (0) | 2025.05.04 |
| GSAP의 .to(), .from(), .fromTo() 차이점과 사용법 (0) | 2025.04.09 |
| css애니메이션 한방에 정리하기!(transition, transform, animation) (0) | 2025.04.04 |
댓글