AI바라기의 인공지능
VLM : 논문 리뷰 : OmniLottie: Generating Vector Animations via Parameterized Lottie Tokens 본문
VLM : 논문 리뷰 : OmniLottie: Generating Vector Animations via Parameterized Lottie Tokens
AI바라기 2026. 3. 4. 18:30핵심 용어 정리 (Glossary)
- Lottie JSON: 도형, 효과, 애니메이션 파라미터 등을 하나의 JSON 파일에 담아내는 가볍고 해상도에 독립적인 vector animation 포맷입니다.
- Lottie Tokenizer: 이 논문의 핵심 발명품으로, 복잡하고 불필요한 메타데이터가 가득한 날것의 Lottie JSON을 AI가 이해하기 쉬운 압축된 '명령어 시퀀스'로 변환하는 도구입니다.
- Offset-based tokenization: Tokenizer가 파라미터를 변환할 때 공간(Spatial), 시간(Temporal), 색상(Color) 등 각 파라미터 타입별로 겹치지 않는 고유한 어휘 영역(Vocabulary offset)을 할당하여 model 내부의 토큰 충돌을 방지하는 기술입니다.
- MMLottie-2M: 200만 개의 Lottie 애니메이션과 그에 대응하는 multi-modal 주석(텍스트, 이미지, 비디오)을 쌍으로 묶어 구축한 세계 최초의 대규모 vector animation dataset입니다.
- LLM-as-judge: 평가 자동화를 위해 Claude-3.5-Sonnet과 같은 대형 언어 모델을 심판으로 사용하여 생성된 애니메이션의 객체 일치도(Object Alignment)와 모션 일치도(Motion Alignment)를 채점하는 방식입니다.
Purpose of the Paper
- 기존 연구의 한계: 기존의 vector animation 생성 모델들은 단순히 정적인 SVG 이미지에 외부 모션(GIF 또는 Text-to-video 모델)을 덧입히는 방식에 그쳐 진정한 의미의 end-to-end 생성이 불가능했습니다. 대안인 Lottie JSON은 편집과 확장이 용이하지만, 파일 내부에 변하지 않는 구조적 메타데이터와 포맷팅 토큰이 너무 많아 일반적인 VLMs가 학습하면 토큰 낭비와 구문 오류로 인해 생성 성공률이 심각하게 떨어졌습니다.
- 새로운 접근 방식: Lottie JSON의 구조적 군더더기를 제거하고 형태와 모션 파라미터만 추출하는 Lottie Tokenizer를 도입하여, pre-trained VLMs가 multi-modal 지시어를 바탕으로 복잡한 vector animation을 end-to-end로 직접 생성할 수 있도록 하는 OmniLottie framework를 제안합니다.
Key Contributions & Novelty
- OmniLottie framework 제안: Text-to-Lottie, Text-Image-to-Lottie, Video-to-Lottie 세 가지 핵심 task를 단일 모델에서 모두 처리할 수 있는 최초의 multimodal vector animation generation architecture입니다.
- Lottie Tokenizer의 독창성 (Novelty): JSON 구문을 직접 생성하는 기존 방식의 비효율성을 타파했습니다. Offset-based tokenization을 통해 시각적, 시간적 속성을 분리된 토큰 공간에 매핑함으로써 sequence length를 극적으로 줄이고 autoregressive generation의 안정성과 품질을 높였습니다.
- MMLottie-2M dataset 구축: vector animation 연구의 가장 큰 병목이었던 데이터 부족 문제를 해결했습니다. 웹에서 수집한 고품질 Lottie 파일과 정적 SVG에 애니메이션을 합성한 데이터를 결합하여 200만 개 규모의 대규모 학습 환경을 제공합니다.
- MMLottieBench 표준화: LLM-as-judge 기반의 Object Alignment 및 Motion Alignment 지표를 도입하여 향후 이 분야 연구자들이 활용할 수 있는 객관적이고 세밀한 평가 프로토콜을 확립했습니다.
Experimental Highlights
- 주요 실험 결과: OmniLottie는 세 가지 모든 task에서 압도적인 state-of-the-art를 달성했습니다. 특히 Text-to-Lottie task에서 97.3%의 높은 Success Rate를 기록했으며, 이는 기존 open-source 모델들(Qwen2.5-VL 등)이 복잡한 JSON 구문 생성에 실패하여 0%를 기록한 것과 완벽히 대비됩니다.
- 효율성 입증: 제안된 Tokenizer를 적용한 결과, 원본 날것의 JSON 대비 토큰 길이를 평균 81%나 단축하여 연산 비용을 획기적으로 줄였습니다.
- Baselines 비교: AniClipart나 LiveSketch 같은 기존 Optimization-based 모델들이 생성에 수십 분이 걸리고 오류율이 높은 반면, OmniLottie는 고품질의 벡터 파일을 평균 31초 내외로 빠르게 생성해 냈습니다. FVD, CLIP 점수 등 시각적 품질과 의미 정렬 지표에서도 상용 툴인 Recraft나 GPT-5를 뛰어넘었습니다.
Limitations and Future Work
- 명확한 한계점:
- Autoregressive 방식의 본질적 특성상, 구문론적으로는 유효하지만 렌더링 시 투명도가 잘못 설정되거나 객체가 캔버스를 벗어나는 등의 '렌더링 실패(Level 3 Failure)'가 여전히 드물게 발생합니다.
- 지나치게 복잡한 모션이나 매우 긴 context length를 요구하는 애니메이션에서는 생성 성능이 제한됩니다.
- 향후 연구 방향:
- 생성 과정에서 문법 및 구조적 오류를 원천 차단하는 constrained decoding 기법 도입이 필요합니다.
- 모델이 빈 화면이나 보이지 않는 객체를 생성하지 않도록, '렌더링 가능 여부' 자체를 보상 신호로 사용하는 reinforcement learning을 적용하여 실패율을 0에 가깝게 줄이는 연구가 요구됩니다.
- 결과물을 After Effects와 같은 전문 interface에 직접 연동하는 agent 기반 파이프라인 확장이 기대됩니다.
Overall Summary
OmniLottie는 방대한 메타데이터 탓에 기존 VLMs가 다루기 어려워했던 Lottie 포맷을 독창적인 Tokenizer로 효율적으로 압축하여, 텍스트나 비디오 지시어만으로 고품질 vector animation을 생성해 내는 혁신적인 모델입니다. 새롭게 구축한 200만 규모의 MMLottie-2M dataset을 바탕으로 학습되어 기존 baselines의 처참한 성공률과 느린 생성 속도를 모두 극복하며 state-of-the-art 성능을 입증했습니다. 이 연구는 모션 그래픽 전문가들의 수작업 파이프라인을 크게 가속화하고, 일반 사용자도 쉽게 편집 가능한 고해상도 벡터 애니메이션을 즉각적으로 만들어낼 수 있는 길을 열었다는 점에서 큰 의의를 가집니다.
쉬운 설명
이 논문은 복잡하고 불필요한 코드가 섞인 두꺼운 요리책(Raw Lottie JSON)을 AI에게 통째로 외우게 하는 대신, "썰기, 볶기, 간하기"와 같이 직관적이고 핵심만 담긴 **'동작 명령어 요약본(Lottie Tokenizer)'**으로 바꾸어 학습시킨 아이디어입니다. 잡다한 기호나 구조적 포맷에 신경 쓸 필요가 없어진 AI는, 사용자가 텍스트나 참고 영상을 주기만 하면 스스로 부드럽게 움직이면서 언제든 색상과 크기를 자유롭게 수정할 수 있는 깔끔한 '벡터 애니메이션'을 순식간에 뚝딱 만들어낼 수 있게 되었습니다.
Abstract
OmniLottie는 multi-modal instructions로부터 고품질의 vector animations를 생성하는 다목적 framework입니다.
유연한 모션 및 visual 콘텐츠 제어를 위해, 우리는 모양과 애니메이션 동작 representation 모두를 위한 가벼운 JSON formatting인 Lottie에 중점을 둡니다.
그러나 원시 Lottie JSON 파일은 광범위하고 불변하는 구조적 metadata와 formatting tokens를 포함하고 있어, vector animation generation을 learning하는 데 상당한 어려움을 제기합니다.
따라서 우리는 JSON 파일을 모양, 애니메이션 기능 및 제어 parameters를 나타내는 명령어 및 parameters의 구조화된 sequences로 변환하는 잘 설계된 Lottie tokenizer를 도입합니다.
이러한 tokenizer는 pretrained vision-language models를 기반으로 OmniLottie를 구축하여 multi-modal interleaved instructions를 따르고 고품질의 vector animations를 생성할 수 있도록 해줍니다.
vector animation generation 분야의 연구를 더욱 발전시키기 위해, 우리는 textual 및 visual annotations와 짝을 이루는 전문적으로 디자인된 vector animations의 대규모 dataset인 MMLottie-2M을 구축했습니다.
광범위한 실험을 통해, 우리는 OmniLottie가 multi-modal human instructions를 밀접하게 준수하며 생생하고 semantically aligned 된 vector animations를 생성할 수 있음을 검증했습니다.
1. Introduction
Vector animation은 raster videos 대신 vector graphics를 사용하여 만들어진 컴퓨터 애니메이션의 한 유형입니다. raster videos와 비교하여, vector animations는 외형, 스타일 효과 및 모션 속성의 직관적인 조작을 용이하게 하는 가볍고, 편집하기 쉬우며, 해상도에 독립적인 representation을 제공합니다. 따라서 vector animation은 현대적인 디자인 워크플로우 전반에 널리 채택되고 있습니다. multi-modal instructions로부터 vector animations를 generation할 수 있는 autonomously 작동 시스템을 개발하는 것은 창작의 진입 장벽을 크게 낮추고 전문적인 디자인 파이프라인을 크게 가속화할 잠재력을 가지고 있습니다.
vector animation generation을 위한 이전의 접근 방식들은 주로 레퍼런스 GIF나 text-to-video generator로부터 파생된 모션 사전 지식(motion priors)을 수동으로 디자인된 정적 vector graphics에 적용하는 데 중점을 둡니다. 컴퓨터 애니메이션의 더 넓은 범위를 고려할 때, diffusion 기반의 video generation models 또한 texts와 images로부터 래스터화된 이미지 애니메이션을 generation하는 데 놀라운 능력을 입증했습니다. 위에서 언급된 models가 visually 뛰어난 애니메이션을 generation할 수 있음에도 불구하고, 그들의 outputs는 본질적으로 vector 포맷이 제공하는 편집 가능성, 크로스 플랫폼 호환성 및 해상도 확장성이 부족합니다.
본 연구에서 우리는 단일 JSON 파일 내에 모든 모양, 효과 및 모션 parameters를 저장하는 널리 채택된 vector animation 포맷인 Lottie representation에 중점을 둡니다. Lottie는 visual 요소들과 모션 효과들을 통합하기 위해 레이어와 상속을 가진 복잡한 계층적 representation입니다. 또 다른 널리 채택된 vector graphics representation과 비교할 때, 즉 SVG는 모양을 위해 rects, circles, paths를 쌓고 애니메이션을 위해 CSS codes를 임베드합니다. Lottie의 우수한 크로스 플랫폼 호환성은 이를 SVG보다 더 인기 있게 만듭니다. Large Language Models (LLMs)의 급속한 발전과 함께, 우리는 일부 기존 models가 JSON 텍스트 파일을 생산함으로써 Lottie 애니메이션을 generation할 수 있음에도 불구하고, Lottie의 중첩된 JSON representations의 엄격한 formatting과 instruction-following 성능으로 인해 불만족스러운 generation 성공률을 겪고 있음을 확인했습니다.
우리는 원시 Lottie JSONs를 직접적으로 generation하는 것은 비효율적이라고 주장합니다. formatting tokens와 metadata가 의미 있는 기하학적 또는 모션 단서보다 tokens의 더 큰 부분을 차지하기 때문입니다. vector animation generation의 견고성, 효율성 및 신뢰성을 향상시키기 위해, 우리는 Lottie 파일을 관련 parameters와 함께 모양, 효과 및 애니메이션 commands의 컴팩트한 sequences로 변환하는 Lottie tokenizer를 제안합니다.
제안된 Lottie tokens의 직렬화는 VLM training의 모범 사례를 사용하여 large scale datasets에서 auto-regressive models를 end-to-end로 train할 수 있게 해줍니다. 이를 위해, 우리는 통합된 framework 하에서 Text-to-, Text-Image-to-, 그리고 Video-to-Lottie generation에 대한 연구를 촉진하기 위해 text descriptions, keyframe images, 그리고 렌더링된 비디오들로 annotated된 vector animations의 포괄적인 dataset인 MMLottie-2M을 구축합니다. MMLottie-2M을 기반으로, 우리는 multi-modal Lottie generation에 맞춤화된 표준화된 evaluation 프로토콜을 추가로 확립합니다. 우리의 실험은 OmniLottie가 visual 충실도와 multimodal inputs와의 semantic alignment 모두에서 강력한 baselines를 크게 능가하며, 다양한 프롬프트와 modalities에 걸쳐 고품질의 vector animations를 제공함을 보여줍니다.
요약하자면, 우리의 기여는 다음과 같습니다:
- 우리는 multi-modal instructions로부터 직접 vector animations를 generation할 수 있는 최초의 end-to-end framework인 OmniLottie를 소개합니다.
- 우리는 향후 연구를 촉진하기 위해 공개적으로 배포된, 짝을 이루는 text descriptions, 레퍼런스 images, 비디오 데모가 포함된 200만 개의 Lottie 애니메이션의 large-scale multi-modal dataset인 MMLottie-2M을 큐레이션합니다.
- 우리는 원시 JSON을 간결한 command sequences로 변환하여 training 효율성과 generation 품질을 모두 향상시키는 새로운 Lottie tokenizer를 제안합니다.
- 광범위한 평가는 OmniLottie가 고품질의 vector animations를 생성하고 visual 충실도와 semantic alignment 모두에서 SOTA 성능을 달성함을 보여줍니다.
OmniLottie: 1. Introduction 정리 노트
연구 배경 및 기존의 한계 (Problem Statement)
- Vector Animation의 중요성: Raster video 대비 가볍고, 편집이 용이하며, 해상도에 독립적이어서 현대 디자인 워크플로우의 핵심 요소임.
- 기존 생성 모델의 한계: * Diffusion 기반 Video Generation: 시각적 품질은 뛰어나나 Vector 포맷 특유의 편집 가능성이나 확장성이 결여됨.
- 기존 LLM 기반 Lottie 생성: Lottie(JSON 포맷)를 직접 생성하려 했으나, 엄격한 계층적 구조와 방대한 메타데이터/포맷팅 토큰 때문에 생성 성공률(Success Rate)과 Instruction-following 성능이 매우 저조함. 기하학적/모션 정보보다 잉여 토큰이 더 많은 비효율성 발생.
핵심 제안 및 기술적 혁신 (Proposed Method & Innovation)
- OmniLottie 프레임워크: Multi-modal instruction을 입력받아 End-to-End로 고품질 Vector Animation을 생성하는 최초의 모델.
- Lottie Tokenizer 도입 (가장 핵심적인 기여): 원시 JSON 파일을 형태, 효과, 애니메이션 Command와 파라미터로 구성된 압축된 Sequence로 직렬화(Serialization)함.
- 학습 효율성 극대화: Tokenizer를 통해 압축된 Sequence를 활용함으로써, 기존 VLM 학습의 모범 사례를 적용하여 Auto-regressive 모델을 대규모 데이터셋에서 End-to-End로 학습할 수 있게 됨.
데이터셋 및 성과 (Dataset & Results)
- MMLottie-2M 구축 및 공개: Text, Reference Image, Video demonstration이 페어링된 200만 개 규모의 대규모 Multi-modal Lottie 데이터셋 구축. (Text-to-, Text-Image-to-, Video-to-Lottie 통합 연구 촉진)
- 평가 및 성능: Multi-modal Lottie 생성에 맞춘 표준화된 Evaluation 프로토콜을 확립했으며, 시각적 충실도와 Semantic Alignment 양측 모두에서 압도적인 SOTA 달성.
쉬운 설명 : 1. Introduction
이 논문의 도입부를 한마디로 요약하면 **"복잡한 애니메이션 코드를 AI가 소화하기 좋게 알약으로 압축해서, 완벽한 벡터 애니메이션 생성기를 만들었다"**입니다.
우리가 웹이나 앱에서 보는 깔끔한 애니메이션들은 보통 Lottie라는 파일(JSON 형식)로 만들어집니다. 기존의 똑똑한 AI(LLM)들에게 "이 Lottie 파일 좀 짜줘"라고 시켜봤더니, 진짜 필요한 그림이나 움직임 정보보다 괄호 닫고 열고, 형식 맞추고 하는 쓸데없는 껍데기 코드가 너무 많아서 AI가 헷갈려하고 자꾸 에러를 냈습니다. 효율이 엄청나게 떨어졌던 것이죠.
그래서 연구진은 Lottie Tokenizer라는 아주 똑똑한 번역기(압축기)를 발명했습니다. AI가 헷갈려하는 껍데기 코드는 다 쳐내고, "어떤 모양이야?", "어떻게 움직여?" 같은 진짜 알맹이(명령어)만 짧게 추려서 AI에게 먹여준 것입니다.
결과적으로 AI는 이 압축된 명령어를 바탕으로 훨씬 더 쉽고 정확하게 애니메이션을 학습할 수 있게 되었습니다. 텍스트나 이미지, 비디오를 던져주면 그에 딱 맞는 고품질 Lottie 애니메이션을 뚝딱 만들어내는 OmniLottie가 탄생한 것입니다. 게다가 이 똑똑한 AI를 훈련시키기 위해 200만 개짜리 어마어마한 정답지(MMLottie-2M 데이터셋)까지 직접 만들어서 동네방네 공개했다는 내용입니다.
2. Related Work
Vector Animation은 구조화된 모양, 효과 및 제어 parameters를 통해 외형과 시간적 역학(temporal dynamics)을 인코딩하는 가볍고 해상도에 독립적인 representation을 제공합니다. 초기 SVG 기반 방법들은 단순한 보간(interpolation)에 의존했으며, 이는 motion 표현력을 제한합니다. 이후의 접근 방식들은 레퍼런스 GIFs 또는 Text-to-video models로부터 외부 motion priors를 통합했으며, LottieFiles Motion Copilot과 같은 상용 도구들은 수동 워크플로우를 완화하기 위해 keyframe generation을 자동화합니다. 그러나 이러한 기술들은 외형과 motion을 분리하여, 사전 정의된 dynamics에 의존하거나 선택된 요소들에만 효과를 적용함으로써 완전히 벡터화된 end-to-end animation synthesis를 방해합니다.
대신 우리는 단일 JSON representation 내에 모양, 효과 및 애니메이션을 통합하는 Lottie 포맷을 채택합니다. 이것의 단순성은 현대의 VLMs가 강력한 instruction-following 및 multimodal reasoning을 활용할 수 있게 하여, OmniLottie가 다양한 multimodal 설정 전반에서 end-to-end vector animation generation을 학습할 수 있도록 합니다.
Vector Graphics는 UI/UX, 브랜딩 및 디지털 출판에서 널리 채택됩니다. 이전 연구들은 SVG synthesis를 위해 diffusion-based 접근 방식들뿐만 아니라 RNN-, VAE-, 그리고 transformer 기반 models를 제안했습니다. LLMs/VLMs의 부상과 함께, autoregressive SVG generators는 강력한 기하학적 및 스타일적 충실도를 입증했습니다. 정적인(static) vector graphics와 달리, vector animation은 시간적 및 효과 dynamics를 추가적으로 모델링합니다. OmniLottie는 통합된 autoregressive framework에서 외형, 효과 및 motion을 공동으로 합성함으로써 이 분야를 발전시킵니다.
Visual Autoregressive Generation. Autoregressive models는 visual 콘텐츠를 token sequences로 취급하며 images, videos, vector graphics, 그리고 3D에 적용되어 왔습니다. 최근 연구는 이산형(discrete) 헤드를 diffusion-based continuous predictors로 대체하고, multimodal understanding을 위해 pretrained VLMs를 통합합니다. 우리는 이 패러다임을 vector animation으로 확장합니다. Lottie JSON을 컴팩트한 command-parameter sequences로 변환함으로써, 우리는 복잡한 애니메이션을 sequence modeling에 적합하게 만듭니다. pretrained VLM을 기반으로 구축된 OmniLottie는 multimodal instructions를 처리하고 autoregressively하게 Lottie commands를 generation하여, 제어 가능하고 충실도가 높은 vector animation synthesis를 가능하게 합니다.
OmniLottie: 2. Related Work 정리 노트
1. 기존 Vector Animation 생성 방식의 근본적 한계
- 문제점: 초기 SVG 보간법이나 외부 motion priors(GIF, Text-to-video 모델 등)를 활용하는 기존 방식들은 외형(appearance)과 모션(motion)을 철저히 분리하여 처리함.
- 결과적 한계: 사전 정의된 dynamics에 의존하거나 특정 요소에만 효과를 적용하게 되어, 완전한 벡터 기반의 end-to-end animation synthesis가 불가능함.
2. Lottie 포맷 채택을 통한 End-to-End 통합
- OmniLottie의 접근: 모양, 효과, 애니메이션을 단일 JSON representation으로 통합하는 Lottie 포맷을 전략적으로 채택.
- 기대 효과: 이 통합된 구조 덕분에 최신 VLM의 강력한 instruction-following 및 multimodal reasoning 능력을 그대로 활용하여, 다양한 multimodal 설정에서 end-to-end vector animation generation을 학습할 수 있게 됨.
3. 정적(Static) Vector Graphics에서 동적(Dynamic) 영역으로의 확장
- 기존 연구의 한계: 기존의 RNN, VAE, transformer, diffusion 및 최근의 autoregressive SVG generators는 기하학적, 스타일적 충실도는 높였으나, 시간적(temporal) 및 효과 dynamics를 다루지 못하는 정적 그래픽 생성에 머무름.
- OmniLottie의 기여: 단일 autoregressive framework 내에서 외형, 효과, 모션을 공동으로 합성(joint synthesis)하여 정적 그래픽 생성의 한계를 돌파함.
4. Visual Autoregressive Generation 패러다임의 최초 적용
- 기존 동향: Visual 콘텐츠를 token sequences로 취급하여 이미지, 비디오, 3D 등에 적용하고 있으며, 최근에는 pretrained VLM을 결합해 multimodal understanding을 강화하는 추세임.
- 기술적 혁신: 이 패러다임을 vector animation 영역으로 확장함. 복잡하고 방대한 Lottie JSON을 압축된 command-parameter sequences로 변환(Tokenizer 활용)함으로써, 복잡한 애니메이션을 sequence modeling에 적합하게 만들고 autoregressively하게 생성할 수 있는 구조를 완성함.
쉬운 설명 : 2. Related Work
이 섹션은 **"기존 모델들은 왜 벡터 애니메이션을 한 번에 만들지 못했고, 우리는 어떤 아이디어로 이 문제를 해결했는가?"**를 설명하는 대목입니다.
과거 연구들은 벡터 애니메이션을 만들 때 '그림 그리기'와 '움직임 주기'를 따로따로 분리해서 생각했습니다. 정지된 그림(SVG)을 먼저 만들고, 그 위에 비디오나 GIF의 움직임을 억지로 덧씌우는 식이었죠. 이러다 보니 AI가 처음부터 끝까지 스토리를 이해하고 하나의 완벽한 애니메이션을 통째로 만들어내는 것(end-to-end)이 불가능했습니다. 기존에 이미지나 코드를 순서대로 잘 만들어내는 AI 기술(Autoregressive 모델)이 많이 발전했지만, 이 역시 정지된 그림에만 머물러 있었습니다.
그래서 연구진은 발상을 전환했습니다. 그림의 모양, 색깔, 그리고 움직임에 대한 정보가 하나의 파일에 몽땅 들어있는 'Lottie'라는 형식을 사용하기로 한 것입니다. 그리고 이 복잡한 Lottie 파일을 AI가 순서대로 읽고 쓰기 편하도록 짧은 명령어로 압축했습니다.
결과적으로, 이미 똑똑하게 학습된 기존의 AI(VLM)에게 이 압축된 명령어를 순서대로 뱉어내게(Autoregressive) 만들었더니, 그림과 움직임을 따로 놀게 하지 않고 한 번에 완벽한 애니메이션으로 만들어낼 수 있었다는 것이 이 섹션의 핵심입니다.
3. The MMLottie-2M Dataset
multi-modal vector animation generation의 training과 evaluation을 지원하기 위해, 우리는 최초의 large-scale Lottie dataset인 MMLottie-2M을 구축합니다.
이 섹션에서는 multi-modal generation tasks를 위한 standardized evaluation protocol인 MMLottie-Bench뿐만 아니라 우리의 data curation 및 processing pipeline을 자세히 설명합니다.
3.1. MMLottie-2M
Lottie Data Curation. 우리는 LottieFiles, IconScout, Flaticon, Iconfont, 그리고 Icons8을 포함한 여러 주요 온라인 플랫폼에서 Lottie animations를 수집하여 MMLottie-2M dataset을 구성합니다. 웹 크롤링된 Lottie files는 종종 base64 image layers, non-visual layers (오디오, 카메라), 그리고 properties를 동적으로 수정하는 After Effects expressions와 같은 무관한 요소들을 포함합니다. 이러한 구성 요소들은 parameterization을 복잡하게 만들며 렌더링에 필수적이지 않습니다. 따라서 우리는 깨끗하고 완전히 parameterizable data를 보장하기 위해 이러한 요소들을 제거하고 non-parameterizable layers를 포함하는 files를 폐기합니다.
SVG-Lottie Data Curation. Lottie files로부터의 직접적인 learning은 복잡한 JSON structure, 얽힌 layer indexing, 그리고 얽혀있는 visual 및 motion semantics 때문에 어렵습니다. training을 단순화하기 위해, 우리는 대규모 OmniSVG collection을 기반으로 predefined motions (예: translations, zooms, rotations)를 사용하여 static SVGs를 애니메이션화함으로써 보조 Lottie dataset을 generate합니다. 이는 motion에서 content를 분리(decouple)하여, visual components와 animation conditions 간의 alignment를 향상시킵니다.
Data Normalization. training 및 evaluation 절차를 표준화하기 위해, 모든 Lottie JSON files는 spatially하게 $512 \times 512$ canvas로, temporally하게 0-16 timestamp 범위로 정규화되며, 정사각형이 아닌 animations에 대해서는 aspect ratio를 유지하는 중앙 정렬이 적용됩니다.
Motion Library for Data Augmentation. 기본(native) Lottie animations의 부족을 완화하고 static SVG conversions와 authentic motion graphics 사이의 분포 격차를 줄이기 위해, 우리는 motion transfer pipeline을 개발합니다. 우리는 100만(1M) 개의 기본 Lottie files를 분석하여 keyframes 전반에 걸친 transform trajectories (rotation, scale, position, opacity)를 추출하고, temporal patterns를 인코딩하는 motion signatures를 generate합니다 (예: "fade-in + upward motion + scale-down"). semantically 유사한 patterns를 그들의 caption keywords와 함께 clustering함으로써, 우리는 수많은 canonical motion templates를 추출합니다. 그런 다음 이러한 templates는 automated keyframe injection을 통해 static SVG 파생 Lottie files에 적용되어, 엄청난 규모의 잠재적인 training instances를 산출합니다. 이 접근 방식은 path distribution 격차를 대폭 최소화하는 동시에 animated layer coverage를 크게 확장하여, 추가적인 수동 애니메이션 작업 없이도 다양한 motion dynamics에 대한 model의 노출을 실질적으로 향상시킵니다.
Lottie Data Annotation.
실용적인 vector animation generation을 지원하기 위해, 우리는 text-to-, image-text-to-, 그리고 video-to-Lottie의 세 가지 tasks에 집중합니다. Lottie files는 VLM-based annotation을 위해 무작위 밝은 색상 배경을 가진 비디오로 렌더링됩니다. frame 제한으로 인해, 우리는 coarse-to-fine strategy를 채택합니다. VLM은 먼저 subjects, objects, motion, color, 그리고 style을 설명하는 간략한 전체 caption을 generate한 다음, "begins with" 및 "then"과 같은 cues를 사용하여 frames 전반에 걸쳐 더 미세한 temporal details를 제공합니다. text-following accuracy를 향상시키기 위해 geometry와 motion을 강조하는 Keywords가 강조 표시됩니다. Text-Image-to-Lottie의 경우, 렌더링된 비디오에서 single frame이 무작위로 선택되며, VLM은 foreground object motions에 집중하도록 prompt가 주어집니다. Video-to-Lottie의 경우, 렌더링된 비디오가 직접 multi-modal instructions 역할을 하여 annotation을 단순화합니다.
3.2. MMLottie-Bench
vector animation generation을 위한 성숙하고 standardized benchmarks와 metrics의 부족은 (1) generate된 vector animations의 품질과 (2) generators가 multi-modal instructions를 얼마나 충실히 따르는지를 evaluating하는 데 상당한 어려움을 제기합니다. 이러한 문제들을 해결하기 위해, 우리는 multi-modal vector animation generation을 위한 포괄적인 evaluation protocol인 MMLottie-Bench를 도입합니다.
우리의 목표는 (1) 실제 시나리오에서 model의 실용적 유용성을 신뢰할 수 있게 반영하고 (2) 기존 dataset 분할에서 흔히 발생하는 train-test 중복을 피하는 benchmark를 구축하는 것입니다. 이를 위해, 우리는 전문 디자이너들로부터 수집된 아티스트가 디자인한 Lottie animations에서 큐레이션된 450개의 samples로 구성된 Real Subset이라는 evaluation set을 구축합니다. 모든 evaluation samples는 training data와 엄격하게 분리되어(disjoint), 완전히 본 적 없는(unseen) 실제 콘텐츠에 대한 평가를 보장합니다. 구체적으로, Text-to-Lottie task를 위해 실제 Lottie animations에서 파생된 150개의 textual prompts를 포함합니다. Text-Image-to-Lottie task의 경우, 150개의 실제 Lottie samples 각각에서 해당하는 textual description과 함께 하나의 rendered frame을 추출합니다. Video-to-Lottie task의 경우, 150개의 렌더링된 애니메이션 비디오를 포함합니다.
또한, 우리 benchmark의 공정성과 장기적인 robustness를 더욱 보장하기 위해, 특히 지나치게 유사한 data로 학습된 미래 models로부터의 잠재적인 contamination(오염)을 완화하기 위해, 우리는 state-of-the-art generative models를 사용한 instruction-based synthesis를 통해 보완적인 Synthetic Subset을 구축합니다. 구체적으로, Text-to-Lottie task를 위해 우리는 GPT-4o를 사용하여 각 Lottie subset에 대한 150개의 textual prompts를 합성(synthesize)합니다. Text-Image-to-Lottie task의 경우, evaluation을 위한 해당 motion descriptions와 함께 Gemini3.1-Pro Image를 사용하여 150개의 vector-style images를 합성합니다. Video-to-Lottie task의 경우, 우리는 motion descriptions와 쌍을 이루는 150개의 추가 shape descriptions를 generate한 다음, 이를 Seedance 1.0에 주입하여 레퍼런스 비디오를 생산합니다. benchmark의 투명성을 향상시키기 위해, 우리는 Synthetic Subset에 대한 전체 data synthesis process를 기록하고 배포합니다.
MMLottie-Bench는 visual quality와 제공된 multi-modal inputs와의 semantic alignment라는 두 가지 핵심 차원에 따라 models를 평가합니다.
OmniLottie: 3. The MMLottie-2M Dataset 정리 노트
1. 데이터 정제 및 형태 분리 (Data Curation & Decoupling)
- 노이즈 제거: 웹 크롤링된 Lottie 파일에서 모델 학습에 방해되는 non-visual 레이어(오디오 등), base64 이미지, 동적 표현식(After Effects expressions)을 철저히 제거하여 100% parameterizable data로 정제함.
- Content와 Motion의 Decoupling: 정적인 SVG 데이터(OmniSVG)에 사전 정의된 모션(translation, zoom 등)을 부여하여, visual components와 animation conditions 간의 alignment를 명확히 학습할 수 있는 보조 데이터셋을 구축함.
2. 대규모 Motion Augmentation 파이프라인 (핵심 기술)
- 문제점: Native Lottie 데이터의 절대적 부족 및 정적 SVG 애니메이션화 과정에서 발생하는 실제 모션 그래픽과의 분포 격차(distribution gap).
- 해결책 (Motion Transfer): 100만 개의 실제 Lottie 파일에서 transform trajectories(회전, 비율, 위치, 투명도 등)를 추출하여 temporal pattern을 인코딩함. 이를 클러스터링하여 'canonical motion templates'를 만들고, 정적 SVG 기반 Lottie 파일에 자동 주입(automated keyframe injection)함.
- 효과: 추가적인 수동 라벨링 비용 없이 모델이 학습하는 모션 다이내믹스의 커버리지를 극적으로 넓히고 distribution gap을 해소함.
3. VLM 기반의 Coarse-to-fine Annotation
- 렌더링된 비디오를 바탕으로 VLM을 활용해 라벨링 수행.
- 전체적인 프롬프트(객체, 모션, 스타일)를 먼저 생성(Coarse)한 뒤, 시간순에 따른 미세한 디테일을 추가(Fine)하는 방식을 채택. 기하학과 모션 키워드를 명시적으로 강조하여 text-following accuracy를 높임.
4. MMLottie-Bench: Data Contamination을 방지한 평가 프로토콜
- Real Subset (450개): 학습 데이터와 철저하게 분리된(strictly disjoint), 전문가가 디자인한 실제 Lottie 샘플로 구성하여 unseen 데이터에 대한 zero-shot 성능을 정확히 평가.
- Synthetic Subset (장기적 Robustness 확보): 미래의 강력한 모델들이 평가 데이터를 사전 학습하여 발생하는 벤치마크 오염(contamination)을 방지하기 위한 선제적 조치. 최신 SOTA 모델(GPT-4o, Gemini 3.1 Pro Image 등)을 활용해 프롬프트, 벡터 이미지, 레퍼런스 비디오를 합성하여 평가의 공정성과 지속 가능성을 확보함.
쉬운 설명 : 3. The MMLottie-2M Dataset
이 섹션은 **"AI를 똑똑하게 가르치기 위해 완벽한 교과서(데이터셋)와 절대로 컨닝할 수 없는 시험지(벤치마크)를 어떻게 만들었는가?"**에 대한 내용입니다.
먼저 교과서를 만들기 위해 인터넷에서 애니메이션 파일들을 긁어모았는데, 쓸데없는 찌꺼기 코드가 너무 많아서 AI가 읽기 좋게 깔끔히 청소했습니다. 그런데 진짜 화려하게 움직이는 고품질 파일의 수가 너무 부족했습니다. 그래서 연구진은 기발한 아이디어를 냅니다. 기존 애니메이션들에서 '움직이는 패턴(예: 서서히 나타나면서 위로 올라가기)'만 공식처럼 쏙 뽑아낸 다음, 인터넷에 널려있는 정지된 그림들에 이 움직임 공식을 자동으로 갖다 붙인 것입니다. 덕분에 사람이 일일이 그리지 않고도 엄청난 양의 학습용 애니메이션 데이터를 만들어낼 수 있었습니다.
시험지(MMLottie-Bench)도 아주 정교하게 짰습니다. AI가 학습할 때 절대 본 적 없는 전문가들의 진짜 작품들만 모아서 실력을 테스트합니다. 더 나아가, 나중에 새로 나올 다른 AI들이 인터넷에 있는 이 시험지 데이터를 몰래 학습해서 점수를 높게 받는 꼼수(데이터 오염)를 부릴까 봐, 최고 성능의 다른 AI들을 시켜서 만든 완전히 새로운 '가짜 문제'들까지 섞어두었습니다. 정말 치밀하게 평가 시스템을 구축한 것이죠.
4. Proposed Method: OmniLottie
OmniLottie는 Lottie JSON 파일을 압축된 discrete tokens의 sequences로, 또는 그 반대로 인코딩/디코딩하는 잘 설계된 Lottie tokenizer와, auto-regressive Lottie generation을 위해 images, videos, 그리고 texts를 교차된(interleaved) multi-modal instructions로 처리할 수 있는 well-trained VLM으로 구성됩니다. 생성된 Lottie tokens는 그 후 Fig. 3에 설명된 것처럼 vector animations를 위해 Lottie JSONs로 detokenize 됩니다.
4.1. Preliminary: Lottie Layer Properties
Lottie layer attributes는 세 가지 범주로 그룹화될 수 있습니다:
Base layer properties는 식별자 (nm, mn), layer type ty, 인덱싱 및 계층 구조 (ind, parent), 그리고 ddd (3D) 및 hd (hidden)와 같은 flags를 포함한 근본적인 metadata를 포착합니다. Timing attributes (sr, ip, op, st)는 애니메이션 타임라인을 따라 각 layer의 배치를 정의합니다.
Visual layer properties는 기하학적 변환 (ks), 방향 (ao), 매트 관계 (tt, tp, td), masks (hasMask, masksProperties), 효과 (ef), 스타일 (sy), 블렌드 모드 (bm), 그리고 렌더링 태그 (cl, ln)를 포함하여 외형과 렌더링 동작을 제어합니다. ct flag는 transformation 축소를 제어합니다.
특정 layer properties는 layer type에 따라 다릅니다: shape layers를 위한 모양(shapes); precomp, image, audio, 그리고 data assets를 연결하기 위한 refId; precomp 클리핑 또는 solid-layer 크기 조정을 위한 치수 (w, h); 시간 재매핑을 위한 tm; text 콘텐츠를 위한 t; 그리고 너비, 높이, 색상을 정의하는 solid-layer parameters (sw, sh, sc)가 있습니다.
4.2. OmniLottie
Lottie Structure. 현대의 VLMs는 JSON을 직접 generate할 수 있지만, 전체 Lottie JSON을 생산하는 것은 vector animation synthesis에 비효율적입니다. 이 포맷은 광범위하고 대체로 불변하는 구조적 metadata를 포함하고 있어, models가 애니메이션과 관련된 priors를 learning하는 대신 formatting tokens를 재현하는 데 용량을 낭비하게 만듭니다. 이러한 중복성은 sequence 길이를 늘리고 모양, 효과, 그리고 temporal dynamics와 같은 semantically 중요한 요소들로부터 model의 주의를 분산시킵니다.
이를 완화하기 위해, 우리는 Lottie representation을 핵심 properties 세트 (v, fr, ip, op, w, h, nm, ddd, layers)와 특정 layer types에서 요구될 때만 나타나는 조건부 properties (assets, markers, fonts, chars)로 재구성합니다. 없는(absent) 조건부 필드에는 빈 값이 할당되어, 더 간결하고 구조화된 Lottie representation을 산출합니다.
Lottie Tokenizer는 Lottie animations를 animation commands와 제어 parameters의 압축된 sequences로 추상화하여, 완전한 generative 유연성을 보존하면서 중복되는 metadata를 제거합니다. tokenizer는 5가지 기본 layer types를 지원하며, 각각은 고유한 type parameter에 의해 식별됩니다: Precomposition (ty=0), Solid (ty=1), Null (ty=3), Shape (ty=4), 그리고 Text (ty=5). 각 layer type은 구조적 무결성과 temporal 정확성을 유지하기 위해 특화된 parsing strategies를 필요로 합니다.
각 layer type의 뚜렷한 attributes를 기반으로, Lottie tokenizer는 입력 JSON을 기본 properties (v, ip, op, h, w, nm, ddd 포함)와 다양한 layer attribute 분류에 해당하는 5개의 분류된 Python 객체로 캡슐화합니다. 우리는 Lottie animation을 다음과 같은 구조화된 계층으로 공식화합니다:
여기서 $M = {v, fr, ip, op, w, h, nm, ddd}$는 기본 metadata를 나타내고, $L_i$는 개별 layers를 나타냅니다. 각 layer는 그 type $\tau \in {0, 1, 3, 4, 5}$와 attributes 정보 $A_\tau$에 의해 parameterize 됩니다:
여기서 $T_i$와 $E_i$는 각각 transformations와 효과(effects)를 나타냅니다.
따라서, Lottie tokenizer는 부모-자식 관계를 통해 전체 씬(scene) 계층을 재구성하여, JSON 포맷의 무손실 압축(lossless compression)을 제공하는 트리 구조의 representation을 산출합니다. 이 parameterize 된 representation은 압축되고 semantically 풍부한 token sequence를 generation 하기 위한 기반 역할을 합니다.
변환은 각 Lottie layer를 체계적으로 순회하며, 공통 attributes를 직렬화(serializing)한 다음 type에 특화된 properties를 순차적인 tokens로 직렬화합니다. low-level JSON formatting을 무시함으로써, model은 필수적인 generative 콘텐츠에 집중합니다. Lottie Tokenizer는 이 과정을 공식화하여 (Algorithm 1), metadata를 먼저 파싱한 다음 각 layer를 그 type과 attributes와 함께 처리합니다. Fig. 3에 표시된 것처럼, 근본적인 attributes는 animation v="..."와 같이 직렬화되며, null layers도 유사하게 인코딩되어, 효율적인 VLM 처리에 적합한 구조화되고 계층적인 텍스트 representation을 산출합니다.
pretrained VLMs를 Lottie generation에 적응시키기 위해, 우리는 오프셋 기반 체계를 사용하여 Lottie의 계층적 구조를 통합된 discrete vocabulary로 매핑합니다. token 충돌을 피하면서 semantic 일관성을 보존하기 위해 parameter types (temporal, spatial, transformations, 그리고 styles)에 고유한 범위가 할당됩니다.
우리의 오프셋 기반 tokenization은 연속적인 Lottie parameters를 discrete tokens로 매핑합니다:
여기서 $x$는 parameter 값, $t$는 parameter type, $s_t$는 type에 특화된 스케일 팩터(scale factor), 그리고 $o_t$는 vocabulary 오프셋입니다. 완전한 discrete token representation은 다음과 같습니다:
Model architecture. 오프셋 기반 tokenization 체계를 통해 generation 된 token sequences $T$를 기반으로, 우리는 이 discrete vocabulary 공간에 표현된 Lottie animations의 근본적인 분포를 learning 하도록 우리 model을 train 합니다. interleaved 된 multimodal instructions를 처리하기 위해, 우리는 OmniLottie의 백본(backbone)으로 pre-trained VLM, 구체적으로 Qwen2.5-VL을 채택합니다. 우리는 Lottie tokenizer에 의해 생산된 command 및 parameter 구조를 표현하기 위해 무작위로 초기화된 Lottie vocabulary embeddings의 추가적인 세트를 model에 도입합니다. Qwen2.5-VL 백본은 interleaved 된 비디오, 이미지, 텍스트 instructions를 조건으로 간결한 응답 generation을 위한 다양한 VLM tasks에 대해 광범위하게 pre-trained 되어 있으므로, pre-trained 된 가중치는 multi-modal instructions를 준수하는 Lotties를 generation 하기 위한 효과적인 초기화를 제공합니다.
Training Objective. LLMs를 training 하는 것과 유사하게, 우리는 제공된 multi-modal instructions $x_c$뿐만 아니라 모든 이전 tokens $x_s^{[<i]}$를 조건으로 새로운 Lottie tokens $x_s^{[i]}$를 generation 하도록 표준 교차 엔트로피 손실(cross-entropy loss)을 사용하여 OmniLottie를 train 합니다.
OmniLottie: 4. Proposed Method 정리 노트
1. 문제 제기: Raw JSON 생성의 비효율성
- Context 낭비: 기존 LLM/VLM이 Lottie의 JSON을 직접 생성할 경우, 애니메이션 동작과 무관한 방대한 구조적 메타데이터와 포맷팅 토큰(대괄호, 쉼표 등)을 재현하는 데 모델의 Capacity를 낭비하게 됨.
2. 핵심 혁신: Lottie Tokenizer 설계
- 계층적 속성 분리: JSON의 방대한 속성을 Core 속성(항상 존재)과 Conditional 속성(특정 레이어에만 존재)으로 엄격히 분리하여 잉여 데이터를 제거함.
- 트리 구조의 Lossless 압축: 5가지 기본 Layer type(Precomp, Solid, Null, Shape, Text)을 기준으로, 각 레이어를 $L_i = (\tau_i, A_{\tau_i}, T_i, E_i)$ 형태로 매개변수화(parameterize)함. 이를 통해 부모-자식 관계의 트리 구조를 유지하면서 JSON을 완전히 압축해 냄.
3. 연속형 데이터의 이산화: Offset-based Tokenization
- Token Collision 방지: 공간, 시간, 변환 등 서로 다른 속성의 연속형(Continuous) 파라미터 값들이 동일한 토큰으로 맵핑되어 의미가 혼동되는 것을 막기 위해, 타입별로 고유한 Offset($o_t$)을 부여하는 스케일링을 적용함.
- 이산화 수식: 파라미터 $x$는 다음 수식을 통해 이산 토큰(Discrete token)으로 변환됨.(여기서 $s_t$는 스케일 팩터, $o_t$는 고유 오프셋)
- $\text{token}(x, t) = \lfloor x \cdot s_t \rfloor + o_t$
4. Model Architecture & Training
- Backbone: Interleaved multi-modal instruction 처리에 강력한 성능을 보이는 pre-trained VLM인 Qwen2.5-VL을 채택.
- Lottie Vocabulary 확장: 기존 VLM에 Lottie Tokenizer가 만들어낸 Command 및 Parameter 구조를 표현하기 위해 무작위로 초기화된 Lottie Vocabulary Embeddings를 추가로 도입함.
- Objective: 전통적인 LLM 학습 방식과 동일하게, 이전 토큰과 멀티모달 조건을 기반으로 다음 토큰을 예측하는 Auto-regressive Next-token Prediction (Cross-entropy loss) 방식으로 학습함.
- $$\theta^* = \arg \min_\theta -\sum_{i=1}^L \log P\left(x_s^{[i]} | x_c; x_s^{[<i]}; \theta\right)$$
쉬운 설명 : 4. Proposed Method
이 섹션의 핵심은 **"복잡한 애니메이션 설계도(JSON)를 AI가 찰떡같이 알아들을 수 있는 전용 언어(Token)로 번역하는 규칙"**을 만든 것입니다.
Lottie 파일 원본(JSON)은 마치 불필요한 서식이 잔뜩 들어간 복잡한 공문서와 같습니다. AI에게 이 공문서를 처음부터 끝까지 똑같이 쓰라고 하면, 진짜 중요한 내용(그림이 어떻게 움직이는지)보다 줄 맞추기나 괄호 열고 닫기 같은 문서 양식을 외우는 데 힘을 다 빼버립니다.
그래서 연구진은 Lottie Tokenizer라는 똑똑한 비서를 만들었습니다. 이 비서는 공문서에서 불필요한 껍데기는 다 버리고, "어떤 모양인가?", "어디로 이동하는가?" 같은 핵심 알맹이만 뽑아냅니다.
하지만 여기서 문제가 하나 더 생깁니다. AI는 숫자로 세상을 이해하는데, '크기 100'과 '위치 100'이 똑같은 숫자 100이면 AI가 헷갈려 할 수 있습니다. 그래서 오프셋(Offset) 기반 토큰화라는 기술을 써서, 크기를 나타내는 숫자는 1000번대 방에, 위치를 나타내는 숫자는 2000번대 방에 따로따로 번호표를 붙여서 깔끔하게 정리해 주었습니다.
결과적으로, 이미 눈치 빠르고 똑똑한 인공지능(Qwen2.5-VL)에게 이 깔끔하게 정리된 'Lottie 전용 단어장'만 쥐여주었더니, AI가 헷갈리지 않고 완벽하게 애니메이션 코드를 순서대로 탁탁 써 내려갈 수 있게 된 것입니다.