자주 묻는 질문

JSON 애니메이션 뷰어란 무엇인가요?

JSON 애니메이션 뷰어는 롯티 JSON 파일을 미리 보고 점검하는 브라우저 기반 도구입니다. .json 파일을 선택하거나 놓고, 재생과 배경을 제어하며, 메타데이터와 레이어, 정적 성능·호환성 신호를 확인하고 시작용 코드 스니펫을 만들 수 있습니다. 계정은 필요 없으며 선택한 JSON은 클라이언트에서 파싱됩니다.

롯티 애니메이션이란 무엇인가요?

롯티(Lottie)는 원래 Airbnb에서 개발한 오픈소스 애니메이션 포맷입니다. Adobe After Effects 같은 도구에서 애니메이션을 만들고 Bodymovin으로 JSON을 내보낼 수 있습니다. JSON은 레이어, 도형, 에셋, 타이밍과 키프레임을 설명하고 플레이어 라이브러리가 런타임에서 이를 해석합니다. 벡터 중심 내보내기는 선명하게 확장되고 작을 수 있지만 임베디드 이미지, 효과와 조밀한 키프레임은 파일 크기와 성능을 바꿀 수 있습니다.

내 애니메이션 데이터는 안전한가요?

선택한 JSON은 브라우저에서 파싱되며 애플리케이션 서버에 의도적으로 업로드하거나 제품 데이터베이스에 저장하지 않습니다. 그렇다고 네트워크 요청이 전혀 없다는 뜻은 아닙니다. 사이트는 호스팅 제공자가 전달하고, 활성화된 경우 광고 코드가 실행될 수 있으며, JSON이 외부 이미지나 글꼴을 참조할 수 있습니다. 민감한 파일은 먼저 내용과 브라우저 네트워크 패널을 확인하세요.

어떤 파일 포맷이 지원되나요?

JSON 애니메이션 뷰어는 .json 확장자를 가진 표준 롯티 JSON 파일을 지원합니다. 이들은 일반적으로 Adobe After Effects에서 Bodymovin 플러그인을 사용하여 내보내지만 유효한 롯티 JSON 데이터를 출력하는 모든 도구가 작동합니다. LottieFiles, Haiku Animator, 다양한 Figma-to-Lottie 플러그인의 애니메이션이 포함됩니다. 뷰어는 현재 압축 컨테이너 포맷인 dotLottie(.lottie) 파일을 지원하지 않습니다. .lottie 파일이 있는 경우 LottieFiles 변환기와 같은 도구를 사용하여 먼저 JSON을 추출해야 합니다.

애니메이션이 로드되지 않는 이유는?

애니메이션이 로드되지 않는 몇 가지 일반적인 이유가 있습니다:

• 잘못된 JSON: 파일에 구문 오류가 포함되어 있을 수 있습니다. 텍스트 편집기에서 열어 누락된 쉼표, 괄호 또는 잘못된 데이터를 확인하세요. JSON 유효성 검사기를 실행하면 문제를 식별하는 데 도움이 됩니다.
• 롯티 파일이 아님: 모든 .json 파일이 롯티 애니메이션은 아닙니다. 파일에 롯티 관련 데이터 구조(레이어, 에셋, 애니메이션 속성)가 포함되어야 합니다. 일반 JSON 설정 파일은 애니메이션으로 렌더링되지 않습니다.
• 외부 에셋: 일부 롯티 애니메이션은 JSON 파일에 포함되지 않은 외부 이미지 에셋을 참조합니다. 이미지를 포함하지 않고 애니메이션을 내보냈다면 해당 에셋이 뷰어에서 사용할 수 없으며 애니메이션의 일부가 빈 상태로 나타날 수 있습니다.
• 지원되지 않는 기능: 특정 After Effects 기능은 롯티로 잘 변환되지 않습니다. 복잡한 표현식, 3D 레이어, 일부 블렌드 모드는 이 뷰어를 포함한 어떤 롯티 플레이어에서도 올바르게 렌더링되지 않을 수 있습니다.

휴대폰이나 태블릿에서 사용할 수 있나요?

최신 모바일과 태블릿 브라우저에 맞게 인터페이스가 조정되며 파일 버튼으로 지원되는 기기 저장소를 열 수 있습니다. 드래그 앤 드롭은 기기와 브라우저 지원에 따라 달라집니다. 큰 파일, 임베디드 이미지, 조밀한 키프레임과 렌더러 미지원 기능은 메모리와 재생에 영향을 줄 수 있습니다.

롯티 애니메이션은 어떻게 만드나요?

가장 일반적인 워크플로우는 Adobe After Effects에서 시작합니다. 도형, 경로, 키프레임을 사용하여 애니메이션을 디자인한 다음 Bodymovin 플러그인을 설치하여 롯티 JSON 파일로 내보냅니다. 대안 도구도 있습니다: LottieFiles에는 브라우저 기반 편집기가 있고, Haiku Animator는 독립형 앱을 제공하며, 여러 Figma 플러그인이 디자인을 롯티 포맷으로 변환할 수 있습니다. 자세한 안내는 롯티 애니메이션을 단계별로 만드는 방법 블로그 포스트를 확인하세요.

롯티가 GIF보다 좋은 점은 무엇인가요?

롯티는 압축된 벡터 애니메이션과 프로그래밍 가능한 재생에 유리할 수 있고, GIF는 별도 플레이어 없이 폭넓게 지원됩니다. 더 나은 선택은 실제 에셋, 효과, 브라우저·앱 지원, 접근성 요구와 내보내기 방식에 따라 달라집니다. 임베디드 래스터 이미지나 조밀한 키프레임이 있는 롯티가 자동으로 더 작거나 빠른 것은 아닙니다. 롯티 vs GIF 비교에서 판단 기준을 확인하세요.

JSON 애니메이션 뷰어는 무료인가요?

호스팅된 뷰어는 현재 계정이나 유료 기능 제한 없이 제공됩니다. 공개 저장소의 소스를 확인할 수 있지만 현재 프로젝트 라이선스 파일은 공개되어 있지 않습니다. 이는 현재 상태에 대한 설명이며 호스팅이나 기능이 영원히 바뀌지 않는다는 약속은 아닙니다. 최신 소스와 조건은 GitHub 저장소에서 확인하세요.

뷰어를 내 웹사이트에 임베드할 수 있나요?

이 뷰어는 임베드 가능한 위젯으로 설계되지 않았고 현재 저장소에는 재사용 권리를 부여하는 프로젝트 라이선스가 없습니다. 자신의 웹사이트에 롯티 애니메이션을 표시하려면 공개된 조건에 따라 lottie-web 라이브러리를 직접 사용하는 방식을 고려하세요. React 프로젝트에서는 lottie-react나 @lottiefiles/react-lottie-player 같은 래퍼를 사용할 수 있지만 도입 전에 각 라이브러리의 최신 라이선스와 호환성을 확인해야 합니다.

무료 롯티 애니메이션은 어디에서 찾을 수 있나요?

LottieFiles, IconScout, Lordicon, useAnimations 같은 플랫폼은 서로 다른 조건으로 롯티 에셋을 제공합니다. 제공 여부와 라이선스는 바뀔 수 있으므로 상업용으로 쓰기 전에 해당 에셋의 라이선스를 확인하고 적용 조건을 보관하세요. 선택 기준은 롯티 리소스 평가 가이드를 참고하세요.

아직 질문이 있으신가요?

여기에서 질문에 대한 답변을 찾지 못했다면 GitHub Issues 페이지에서 이슈를 열어주세요. 모든 이슈를 읽고 가능한 빨리 응답합니다. 다른 사람이 이미 같은 질문을 했는지 기존 이슈를 둘러볼 수도 있습니다.