lottie2 Lottie 애니메이션 (AE 익스포트, 성능 최적화, 네이티브 통합) 솔직히 이건 예상 밖이었습니다. 온보딩 애니메이션 하나를 MP4로 넣었다가 파일 크기가 2.4MB까지 불어났고, 로딩 지연 컴플레인이 바로 들어왔습니다. 그때 처음 Lottie로 전환했는데, 같은 애니메이션이 240KB로 줄고 로딩 시간이 1.8초에서 0.3초로 뚝 떨어졌습니다. 그 경험 이후로 저는 모바일 앱 외주에서 애니메이션을 MP4로 설계하는 선택지 자체를 지웠습니다.After Effects에서 JSON으로 — Bodymovin 익스포트의 핵심Lottie 워크플로우는 After Effects에서 시작합니다. 여기서 Bodymovin이라는 플러그인이 핵심 역할을 합니다. Bodymovin이란 After Effects에서 제작한 벡터 애니메이션을 JSON 파일 형식으로 변환해주는 무료 익스포트 플러그.. 2026. 5. 20. Rive 상태 기계 (입문, Figma 동기화, 컴포넌트) 애니메이션 툴을 바꾼다고 해서 사용자 반응이 달라질까요? 저는 반신반의하면서 Lottie를 버리고 Rive로 갈아탔고, 결과적으로 NPS가 6에서 9로 뛰었습니다. 도구 하나가 그 차이를 만들었다기보다, 상태 기계(State Machine)라는 개념이 인터랙션 설계 방식 자체를 바꿔놓은 겁니다. 이 글은 그 경험을 토대로 Rive 상태 기계의 구조와 실무 적용법을 논리적으로 풀어봅니다.상태 기계 입문: 노드와 트랜지션의 구조Rive의 애니메이션 작업은 타임라인(Timeline) 방식과 상태 기계(State Machine) 방식으로 나뉩니다. 타임라인은 Lottie와 비슷하게 프레임 단위로 움직임을 정의하는 방식입니다. 반면 상태 기계는 각 애니메이션을 하나의 '상태(State)'로 보고, 상태 간 전환 .. 2026. 5. 19. 이전 1 다음
