lottie-react.md

윤뿔소·2023년 12월 19일
0
post-thumbnail

lottie-react

GIF 이후 애니메이션을 나타내는 방식 중 가장 가볍고 성능 좋은 애니메이션인 Lottie 방식을 사용할 수 있는 라이브러리.

Lottie Animation 방식과 라이브러리 사용 이유

  1. 애니메이션의 경량화와 성능 향상
    Lottie는 JSON 형식의 데이터를 사용하여 벡터 기반의 애니메이션을 렌더링. 이는 GIF나 동영상과 달리 이미지 파일이나 비디오 파일로 저장되어 있는 것보다 더 가볍고 성능 향상을 가져올 수 있음.
  2. 스케일링이 용이
    Lottie는 벡터 기반이기 때문에 다양한 화면 크기에 대응하기 쉬움. 따라서 다양한 디바이스에서 일관된 화질의 애니메이션을 제공할 수 있음.
  3. 디자이너와 협업 용이성
    Lottie는 디자이너가 After Effects나 Adobe Illustrator와 같은 디자인 도구에서 만든 애니메이션을 JSON 형식으로 내보낼 수 있도록 지원함. 이는 디자이너와 개발자 간의 협업을 쉽게 만들어줌.
  4. 재사용성
    Lottie는 JSON 데이터로 정의되기 때문에, 동일한 애니메이션을 여러 프로젝트에서 재사용할 수 있음. 이는 개발자가 효율적으로 작업하고 일관된 사용자 경험을 제공하는 데 도움이 됨.
  5. 인터랙티브 요소의 통합
    Lottie는 JavaScript와 상호 작용이 가능하며, 사용자 입력에 따라 애니메이션을 제어할 수 있음. 이는 사용자와의 상호 작용이 필요한 동적인 요소를 만들기에 용이함.
  6. 공식 Lottie Files가 인증한 라이브러리
  7. 번들 파일이 가장 가벼움, 리액트의 기능을 사용한 라이브러리(훅, 컴포넌트) 등의 이유로 사용
profile
코뿔소처럼 저돌적으로

0개의 댓글