Framer x 29CM Seoul 밋업 참여 후기

https://lu.ma/k5mm0lp7?locale=ko

최근 재미있게 사용하고 있는 프레이머에서 29CM와 함께 밋업을 주최한다는 소식을 접했다.

신청은 Luma라는 서비스에서 이루어졌는데 UI와 인터랙션이 예뻐서 놀랐다. 덕분에 화면 이곳 저곳을 탐색하며 인사이트를 얻었다.

나는 빠르게 신청한 덕분에 해당 밋업에 참여할 수 있게 되었다.

입구에서는 프레이머와 로띠의 굿즈들을 무료로 나눠주셨다.

로띠파일즈의 스티커는 앱을 실행하여 카메라로 비춰보면 스티커 위로 AR 애니메이션이 재생된다.

약 4년 전, 나도 해당 기술을 이용해 인스타그램 AR 필터를 제작해본 경험이 있다. 오랜만에 생각이 나서 반가웠다.

세션 시작 전에는 저녁식사 겸 네트워킹 시간이었는데 피자와 마실것을 제공해주셨다.

나는 옆자리 디자이너분과 대화를 나누었다. 비록 짧았지만 각자의 고충과 생각을 나눌 수 있어 의미있는 시간이었다.

또한 최근 로티파일즈로 이직하신 디자이너 이상효님도 보았다. 밋업에 오신다는 것은 알고 있었지만 실제로 보게되어 신기했다. (팬입니다…)

프레이머 본사에서 오신 무함마드의 인사를 시작으로 세션이 시작되었다.

첫번째 세션은 29CM에서 프레이머 도입 후기에 대한 내용이었다.

https://brunch.co.kr/@29cm/235

(작성중입니다)

두번째 세션은 와이즈트래커이다.

프레이머는 컴포넌트에 코드를 입힐 수 있는 Code Overrides 기능이 있는데 이를 통해 클릭 등 이벤트가 발생되는 것을 트래킹할 수 있다는 내용이었다.

얼마전 나도 Code Overrides를 활용한 경험이 있어서 세션 내용이 무척 흥미로웠다.

블로그 하단 공유 버튼에 코드를 추가하여 현재 웹 주소를 복사할 수 있는 기능을 구현했다.

덕분에 리액트 공부를 해보고 싶어졌다.

세번째 세션은 로티파일즈(LottieFiles)의 세션이었다.

모션이 주는 장점과 닷 로티(.lottie)에 대해 소개해주셨다. 기존 로티(.json) 보다 더 가볍고 테마를 지원한다는 점이 흥미로웠다.

나도 최근 간단한 애니메이션이 필요한 경우, 피그마에서 로티파일즈 플러그인으로 제작하고 있다. 에프터 이펙트에 비해 훨씬 쉽게 출력되어서 사용할 때 마다 놀랍다. 세션 마지막 즈음에, 로티 파일즈는 플랫폼과 플랫폼 사이를 연결하는 역할이라는 소개말이 인상적이었다.

"모션을 비밀 소스처럼 적절히 사용해야 한다, 과한 애니메이션은 없는 것 만 못하다."

추가로, 하나 더 흥미로웠던 것은 로티 수료증에 대한 소개였다. 아래의 링크를 통해 확인해볼 수 있다.

https://lottiefiles.com/courses

네번째 세션은 플랭이다.

프레이머를 이용한 스크롤 인터랙션과 Localization 기능 도입 실패 사례를 소개해주셨다.

플랭의 웹사이트는 스크롤시 좌측의 디바이스 화면이 실제 서비스처럼 동작하고, 이것에 맞추어 우측의 설명이 바뀐다.

이 연출을 View-height를 활용하여 제작한 방법에 대해 소개해주셨다.

종종 웹사이트에서 볼 수 있는 기법이지만 프레이머에서는 어떻게 제작하는지 알 수 있어서 유용했다.

Localization 기능 도입 실패사례에 대한 내용 흥미로웠는데 다국어 지원 웹사이트를 만드는게 생각보다 고려할 요소가 많다는 것이었다.

마지막으로, 이메일 추첨을 통해 3명에게 프레이머 플랜 구독권을 제공했다. 아쉽게도 나는 받지 못했다.

좋은 기회를 만들어주신 프레이머와 29CM 및 행사 관계자분들에게 감사의 말씀을 전한다.