Lottie 애니메이션을 쉽게 편집하고 커스터마이징하세요
웹 기반 편집기를 사용해 Lottie를 편집하고, 조정하고, 맞춤 설정할 수 있습니다. 언제 어디서나 쉽고 편리하게 Lottie를 편집해 보세요.
영상 보러가기
선택하고, 편집하고, 저장하세요
이제 애니메이션 레이어를 직관적으로 선택 & 편집한 후, 기존 로티 애니메이션에 반영할 수 있어요.
강력한 레이어 선택 기능
캔버스에서 애니메이션 레이어를 선택하고 원하는 대로 레이어를 재정렬할 수 있습니다.
원하는 컬러 적용, 창의적.
레이어 색을 쉽고 빠르게 변경하고 애니메이션을 다채롭게 만들어 보세요.
색 변경, 클릭 한 번으로
불필요한 레이어를 숨기고 삭제하세요.
레이어를 재정렬하거나 필요 없는 레이어를 삭제할 수 있습니다. 삭제하지 않고 숨길 수도 있어요.
만 개 이상의 기업에서 만 명 이상의 디자이너 & 개발자에게 사랑받고 있어요.
직관적인 레이어 재정렬
쉽고 직관적으로 레이어를 재정렬해 애니메이션에 신선한 느낌을 더하세요.
텍스트 편집 및 이미지 교체
애니메이션의 텍스트를 변경하고 이미지 레이어를 교체할 수 있어 더 깊이 있는 수준의 커스터마이징이 가능합니다.
향상된 선택 기능을 위한 엑스레이 모드
엑스레이 모드의 개요 보기 기능을 통해 안쪽에 있는 레이어를 확인하고 선택하기 쉽습니다.
이름과 태그가 포함된 대상 레이어
수정하고 싶은 레이어를 선택한 후, 속성(Attributes) 섹션을 열고 ID나 class를 추가하세요.
웹페이지에 렌더링될 때 이 태그들은 CSS 또는 JavaScript로 선택할 수 있습니다.
완전히 새로운 방식의 애니메이션 커스터마이징
언제 어디서나 애니메이션을 더 쉽게 커스터마이징하고 싶으신가요? LottieFiles 모바일 앱에서 모션 편집기, 템플릿, 스티커 등 다양한 기능을 사용하실 수 있습니다.
Lottie Editor란?
Lottie Editor는 코딩 없이 Lottie JSON 파일을 커스터마이징하고 최적화할 수 있는 온라인 애니메이션 편집기입니다.
색상, 레이어, 이미지, 텍스트를 수정하고, 웹사이트, 모바일 앱, 디자인 툴 등 다양한 환경에서 사용할 수 있도록 배포할 수 있습니다.
(LottieFiles 모바일 라이브러리, 웹 플레이어, Webflow와 같은 통합 도구를 활용)
아래와 같은 경우에 자주 사용돼요.
애니메이션의 색상을 브랜드 가이드라인에 맞게 업데이트
플레이스홀더 이미지를 제품 사진이나 아이콘으로 교체
시즌성 문구나 캠페인 텍스트를 새로 만들지 않고 변경
웹/모바일 퍼포먼스를 위해 파일 크기 최적화
Lottie Editor의 새 기능은?
이제 LottieFiles의 라이브러리, IconScout, 내 워크스페이스에 있는 프라이빗 애니메이션까지 모두 로티 에디터에서 바로 수정할 수 있습니다.
Lottie Editor에서 애니메이션을 불러오면 다음과 같은 속성들을 수정할 수 있어요:
레이어(Layers): 숨기기, 보이기, 삭제, 순서 변경
색상(Colors): 개별 요소의 색상 또는 배경색 변경
이미지 교체 및 텍스트 수정: 애니메이션 속 이미지를 교체하거나 텍스트 레이어의 텍스트를 수정
Unique Colors와 All Colors의 차이는?
Unique Colors를 수정하면, 선택한 레이어 내의 동일한 색상 전체가 일괄 변경되고, All Colors를 수정하면, 각 색상 인스턴스를 개별적으로 수정할 수 있어 더 정교한 컨트롤이 가능합니다.
레이어에 ID 태그와 클래스를 어떻게 추가하나요?
수정하고 싶은 레이어를 선택한 후, 속성(Attributes) 섹션을 열고 ID나 class를 추가하세요.
웹페이지에 렌더링될 때 이 태그들은 CSS 또는 JavaScript로 선택할 수 있습니다.
애니메이션의 텍스트를 편집할 수 없는 이유는 무엇인가요?
Lottie 애니메이션의 텍스트가 편집되지 않는 경우, 보통 내보낼 때 서브셋 폰트 처리가 되어 있기 때문이에요. 이 경우 사용 가능한 글리프(문자)가 제한되어 전체 텍스트 변경이 어렵습니다.
Lottie Editor는 무료인가요?
네, 기본 편집은 무료로 제공되며, 일부 고급 기능은 LottieFiles Pro 요금제가 필요할 수 있습니다.
Lottie Editor를 사용하려면 After Effects가 필요한가요?
아니요. Lottie Editor는 100% 온라인 기반으로 작동하며, After Effects 없이도 Lottie JSON 파일을 업로드하고 편집할 수 있어요.
Lottie Editor에서 파일 크기를 최적화할 수 있나요?
네. 불필요한 레이어 제거, 코드 정리, dotLottie 포맷으로 압축하여 파일 크기를 줄일 수 있습니다.
LottieFiles 마켓플레이스에서 다운로드한 애니메이션도 편집할 수 있나요?
물론이죠. 마켓플레이스에서 애니메이션을 다운로드하거나 열어서, 색상, 이미지, 텍스트 등을 변경한 뒤 저장할 수 있습니다.
Lottie Editor는 dotLottie 파일도 지원하나요?
네. .lottie 확장자를 가진 dotLottie 형식도 업로드 및 편집이 가능합니다. (dotLottie란?: 여러 Lottie 애니메이션 혹은 테마 설정 등의 부가 기능을 하나의 파일로 묶은 초경량 로티 확장자)
Lottie Creator와 Lottie Editor의 차이는 무엇인가요?
Lottie Creator는 브라우저에서 도형, 텍스트, 세그먼트, 매트 등 다양한 도구를 사용해 애니메이션을 처음부터 만들 수 있고 전문적인 키프레임 편집이 가능한 모션 편집 툴입니다. Lottie Editor는 전문 모션 지식 없이도 기존 애니메이션의 색상, 텍스트, 이미지 등을 빠르게 편집하는 데 특화되어 있어요.
LottieFiles를 사랑하는 디자인 팀들
Lottie는 제 워크플로우에 빠르게 통합되고 용량이 작아요. 덕분에 팀원들과 빠르게 아이디어를 나눌 수 있죠.
Brian Lee
헤드스페이스 시니어 애니메이터
모든 제품과 서비스에 LottieFiles를 사용해 개인화된 경험을 제공합니다.
Vinu Remesan
고잭 모션 디자인 헤드
직접 만들고, 함께 협업하며, 쉽게 전달하기.
모든 디자인 요소에 모션을 더해 보세요. 상상력을 마음껏 발휘해 디자인에 생동감을 불어 넣으세요.