JUNIOR NAVER App Interactions

쥬니어 네이버 앱은 유아를 위한 애니메이션과 교육용 콘텐츠를 제공하는 비디오 스트리밍 서비스입니다.

이 앱은 10년 전 플래시를 기반으로 개발되었으나, 현재의 디바이스와 플랫폼에 적합하지 않아 개편이 필요했습니다. 리디자인 프로젝트에서는 인터랙티브 스튜디오가 모션과 인터랙션 디자인을 담당하였습니다.

프로젝트 참여 후, 진행 중인 UI 디자인을 검토하며 모션 및 인터랙션을 구상하던 중, 쥬니어 네이버 앱의 디자인 요소와 스타일이 일러스트로 구성되어 있어 벡터 기반의 애니메이션 작업이 가능하다고 판단했습니다. 그 시점에 Airbnb가 벡터 기반 애니메이션 라이브러리인 Lottie를 오픈소스로 공개하였기에, 이를 도입하기 위해 개발자들을 설득하였고, 결과적으로 플래시에서 Lottie로 애니메이션 플레이어를 교체하였습니다.

Lottie를 적용함으로써 과거의 PNG 시퀀스에 비해 복잡한 애니메이션 표현이 가능해졌고, 앱의 성능도 크게 향상되었습니다. 아래에서 볼 수 있는 캐릭터 및 아이콘 모션은 모두 Lottie를 사용하여 구현되었으며, 비트맵 이미지와 비디오 포맷은 전혀 사용되지 않았습니다.

UI Interaction & Transition

Character Motion

Icon Motion