무료 Lottie 에셋 구하는 곳과 라이선스 주의점

RESOURCE

모든 모션을 직접 만들 수는 없습니다. 프로토타입이나 사이드 프로젝트라면 공개 에셋으로 시작하는 것이 현실적입니다. 다만 "무료"의 조건은 소스마다 다르므로, 어디서 구하고 무엇을 확인해야 하는지 알아야 합니다.

대표 소스

상업 프로젝트에서 확인할 것 4가지

• 상업적 사용 허용 여부 — "free"와 "free for commercial use"는 다릅니다.
• 출처 표기(attribution) 요구 — 앱 설정 화면의 오픈소스 고지에 넣을 수 있는지, UI에 노출해야 하는지 확인.
• 재배포 조건 — 에셋을 수정해 다시 배포하는 것(예: 오픈소스 프로젝트에 포함)이 허용되는지.
• 상표·캐릭터 요소 — 유명 캐릭터를 닮은 에셋은 라이선스와 무관하게 상표권 리스크가 있습니다.

받은 에셋, 그대로 쓰지 말고 손보기

공개 에셋을 프로젝트에 넣기 전 체크리스트입니다.

• 규격 확인 — 캔버스가 512×512처럼 큰 경우가 많습니다. 우리 스펙에 맞는지 Lottie Inspector에서 규격선으로 확인하세요.
• 용량 확인 — 마켓 에셋은 데모용으로 화려하게 만든 경우가 많아 수백 KB짜리도 흔합니다. 최적화 글의 방법으로 다이어트하세요.
• 색상 정리 — 브랜드 색과 맞추려면 색 교체가 필요합니다. 레이어 구조를 확인하고 keypath로 바꾸거나, 디자이너에게 색 변경본을 요청하세요.
• 루프 확인 — 첫/끝 프레임이 이어지지 않는 에셋이 의외로 많습니다. 반복 재생으로 확인하세요.

색 교체, 실제 작업 흐름

위 체크리스트의 "색상 정리"를 조금 더 풀어 보겠습니다. 받은 에셋의 색을 브랜드 색으로 맞추는 작업은 제 경우 항상 같은 순서로 진행합니다.

먼저 뷰어에 파일을 올려 레이어 구조부터 확인합니다. 여기서 보는 것은 두 가지입니다. 바꿔야 할 색이 몇 개의 fill과 stroke에 흩어져 있는지, 그리고 그라데이션이나 이미지 레이어가 섞여 있는지입니다. 단색 fill 두세 개 수준이면 디자이너를 부를 것 없이 코드에서 keypath로 교체하는 쪽이 빠릅니다.

// iOS — 특정 fill 색을 런타임에 교체
let provider = ColorValueProvider(brandOrange.lottieColorValue)
animationView.setValueProvider(
  provider,
  keypath: AnimationKeypath(keypath: "**.Fill 1.Color"))

반대로 그라데이션이 들어 있거나, 같은 색이 수십 개의 셰이프에 퍼져 있거나, 명도 차이로 입체감을 낸 에셋이라면 keypath 교체는 포기하고 디자이너에게 After Effects에서 색을 바꿔 재수출해 달라고 요청합니다. 억지로 와일드카드 keypath를 넓게 걸면 바뀌면 안 되는 색까지 같이 바뀌는 사고가 나기 쉽고, 색을 하나씩 정확히 짚더라도 원본의 명도 관계가 깨져 결과물이 어색해지는 경우가 많았습니다. 제 판단 기준은 단순합니다. 바꿀 색이 3개 이하이고 전부 단색이면 keypath, 그 외에는 재수출입니다.

출시 직전 라이선스 검토에서 실제로 걸렸던 사례

앞에서 라이선스 대장을 만들라고 권한 이유는, 제가 정확히 그 문제로 곤란해진 적이 있기 때문입니다. 의료기기 앱은 스토어 심사와 별개로 내부 검토 절차가 까다로운 편인데, 출시 직전 점검에서 온보딩 화면에 쓰던 로딩 애니메이션의 출처를 묻는 질문이 나왔습니다. 파일명은 loading_final2.json 같은 식이었고, 받은 지 1년쯤 지난 파일이라 어느 마켓에서 어떤 라이선스로 받았는지 팀의 누구도 기억하지 못했습니다.

LottieFiles에서 비슷한 에셋을 검색해 원본으로 보이는 페이지를 찾긴 했지만, 우리가 가진 파일이 그 에셋이라고 확신할 근거가 없었습니다. JSON 내부의 nm 필드와 레이어 이름으로 대조해 봐도 중간에 수정을 거친 파일이라 일치하지 않았고요. 결국 "출처를 증명하지 못하는 에셋은 쓸 수 없는 에셋과 같다"는 결론이 났고, 일정에 쫓겨 디자이너가 새로 만든 애니메이션으로 교체한 뒤에야 검토를 통과했습니다.

이 일 이후 팀 위키에 에셋 대장을 만들었습니다. 항목은 네 가지면 충분합니다. 파일명, 다운로드 URL, 라이선스 종류, 받은 날짜. 여기에 에셋을 추가하는 커밋에는 대장 갱신을 함께 요구하는 규칙을 걸어 두었더니, 그 뒤로는 같은 질문이 나와도 바로 답할 수 있게 됐습니다. 대장을 만드는 데 든 시간보다 에셋 하나를 급하게 다시 만드는 데 든 시간이 훨씬 길었습니다.