티스토리 뷰

https://a-kdh.tistory.com/314

 

 

LottieFiles | 지엄한 애니메이션의 역할

최근 디자인 트렌드는 매우 급격하게 변해가는듯 보인다. 많은 트렌드가 물 흐르듯 지나가고 복고풍이 자리잡고 뉴노멀이 생기고, 이미지에서 영상이 만들어 졌다 다시 이미지의 특별함이 살아

a-kdh.tistory.com

 
예전에 LottieFiles 공부를 하면서, 이런 글을 쓴 적이 있다.

Body Mobbin 플러그인을 이용한 인앱에 가볍게 사용할 수 있는 애니메이션 도구로원래 Airbnb에서 만든 플러그인이라고 들었는데, 어느새 하나의 기업이 되고 점점 더 커져서 피그마에서도 쉽게 만들 수 있게 되거나.. Phase 서비스가 오픈하면서 엄청 쉬워졌다. 


 
- UXUI 디자이너의 새로운 놀이도구: 애니메이션


본인은 AfterEffect 를 이용해 온 터라서, 플로그인을 통해 삽입/배포를 하는데 이게 이게 보통 물건이 아니다. 피그마, Phase, Rive.app 등 더 쉽게 애니메이션을 만들기 위한 도구들이 나와서 엄청 대중화되고 많은 앱들이 이를 애용하고 있긴 한데 왜 좋냐면, 앱에 들어가는 리소스들은 무조건 용량을 줄여야 로딩이나 설치 유도하기에 도움이 된다. 

안 그래도 하드코딩 하는 앱에다가 라이브러리 소스들 집어넣고, 클린코드들 집어넣고 하더라도 점점 커지는 용량은 개발자와 디자이너의 식은땀이 느껴지게 할 정도이다. 이런 점에서 LottieFiles 을 이용해서 많은 정보를 전달할 수 있는 장점이 있다. 

: 저용량, 고함량 정보, 스토리텔링

 
- High VS Low 퀄리티싸움?
개인적으로 그리고, 매우 현실적으로 좀 생각 하자면.. 부드러운 로띠를 앱에서 보여주고 싶다면.. AfterEffect 플러그인을 추천한다. 물론, 빠르고 그래픽 리소스를 재활용하거나 다른 Omni 채널방식을 쓰고 있다면 다른 도구를 더 추천한다.
 

1. 퀄리티보다 스토리라인과 스피드가 중요하다 = 피그마
2. 편하고 쉽게 관리 = PhaseRive.app 
3. 앱의 외부 의존성을 줄여야 한다 = Figma, AfterEffect 
로 정리할 수 있을것 같다.


기록자의 사적의견: 갠적으로는 AfterEffect 플러그인 추천한다.
 
+ 240819 추가
그 사이에.. 로띠 정책의 업데이트가 있었다. 더 정확히는 LottieFiles.com 의 정책.

원문: https://help.lottiefiles.com/hc/en-us/articles/16240626895385-Update-on-Upload-Limits-in-Free-Workspace

이제 계정에 #10번업로드제한 정책 적용으로 JSON 다운로드가 가능하고, 이후에는 리셋되지 않는다.
 
고로 10번 사용만 가능한 상태가 되었다. 피그마, 에펙 등 모두 적용되어 있다.
운영상의 비용도 있고.. 이해는 되는데.. 확장자 (.lottie) 사용은 오픈소스라서  자유롭게 가능하지만,
잘 쓰던 제작도구가  유료로 바뀌게 되니 ㅠㅠ 당황스럽기도하고.. 슬프기도 하고.. 이해가 되기도 하고...ㅎ

Phase (https://www.phase.com/ko-KR) 가 아직까지 무료로 쓸 수 있으니 참고하기를 바란다.

*(Phase 현재까지는 유료 계획이 없다더군요.)
 

이외에도 다른 대안으로 이런 도구들이 있었습니다. 

    1. https://www.svgator.com/pricing

로띠제작 도구로 로티파일즈와 같은 제작 스튜디오로 볼 수 있는데, 한 달에 3개까지 Export 할 수 있고, 월 20달러로 로띠와 동일하다.

사적의견: 해당 도구를 사용한다면, 차라리 로띠를 사용하는 것이 더 용이하다. 에펙을 이용하는 것이 사용성과 활용면에서 비교할 수 없는 정도. 단, 에펙이 익숙한 사용자의 입장이기 때문에 의견이 다를 수 있다.
  1. https://www.haikuanimator.com/

시스템에 설치해서 사용하는 하이쿠는 오픈소스로 쓸 수 있다. Github 에서 다운받아서 설치하나, Node, Yarn 사용 등 약간의 시스템을 이해하고 사용하는 개념을 알고 있어야 한다.
 

 

728x90