앱을 운영하고 있거나 기획하는 사람이라면 자신의 앱에 톡톡튀는 애니메이션을 넣고 싶은 욕심이 들때가 있습니다.
너무 과도한 애니메이션은 앱의 리소스를 잡아먹고 오히려 사용성을 저해할 수 있습니다. 하지만 적당히 사용한다면 사용자에게 또 다른 보는 즐거움을 제공할 수 도 있습니다.
이런 애니메이션을 넣고 싶다..
하지만 이 애니메이션을 구현하려면 상당히 많은 시간과 디자인 리소스가 필요합니다. 그리고 개발자들의 노가다스러움도 뒤따르게 됩니다.
꼭 애니메이션이 들어가야 하나요? 중요한 것 같지도 않은데.. 괜히 공수만 많은데..
저도 욕심이 있어서 애니메이션을 넣고 싶었지만.. 시간, 리소스, 비용 등등을 생각해보니 포기하게 되더군요.
하지만.. 우연히 조금 쉽게(?) 애니메이션을 적용하는 방법을 알아서, 다음에 기회가 된다면 저희 앱에 넣어볼까 합니다.
오픈소스 애니메이션 툴 lottie (https://airbnb.design/introducing-lottie)
Lottie는 After Effects 애니메이션을 실시간으로 렌더링하는 iOS, Android 및 React Native 라이브러리이며 기본 앱이 정적 자산을 사용하는 것처럼 쉽게 애니메이션을 사용할 수 있도록합니다.
홈페이지를 정독해 보니 After Effects에 플러그인을 설치하면 애니메이션을 JSON 포맷으로 추출할 수 있고 이것을 안드로이드나, iOS등에서 사용하면 되는 겁니다.
즉, 디자이너나 누군가가 After Effects로 애니메이션을 만든 다음 JSON으로 정보를 추출하면 개발자는 이 정보를 적용만 하면 되는겁니다.
실제로 해보지는 않아서, 위의 말처럼 쉽게 구현이 가능할지는 모르겠습니다. 하지만 After Effects에 익숙한 디자이너나 사람이 있다면 한번 시도해 볼만한 방법 같습니다.
그리고 lottie로 만들어진 파일들을 공유하는 커뮤니티도 있으니 만들기 전에 확인해 보시길 ^^
Lottiefiles (https://www.lottiefiles.com/)