Mercari는 수백만 명의 사용자가 거의 모든 상품을 쇼핑하고 판매할 수 있게 해줍니다. 2013년 일본에서 설립된 이 회사는 현재 일본 최대의 스마트폰 중심 C2C 마켓플레이스입니다. Mercari의 클라이언트 설계자팀은 2020년, 장기적으로 확장 가능한 최신 솔루션과 기술을 사용하여 새 애플리케이션을 위한 기술 스택을 빌드하는 것을 목표로 Jetpack Compose를 사용하기 시작했습니다.
진행한 작업
Mercari팀은 Android 뷰에서 복잡한 상태 관리 및 스타일 지정을 지원하는 디자인 시스템을 구현해야 했는데, 이는 매우 복잡한 작업이었습니다. Jetpack Compose를 사용하면서 이렇게 복잡한 시스템을 구현할 수 있었을 뿐만 아니라 각 화면을 개발하는 데 드는 시간을 줄일 수 있었습니다.
또한 Jetpack Compose는 디자인 시스템을 활용하여 새 앱의 UI 코드를 작성하여 UI 코드를 간결하고 이해하기 쉽게 만들었습니다. 따라서 팀은 어두운 테마를 실제로 지원하는 등 화면과 비즈니스 로직을 작성하는 데 더 많은 시간을 할애할 수 있습니다.
또한 Mercari팀은 구성요소 디자인에서 UI 코드를 자동으로 생성하는 디자인 시스템과 Figma를 통합하기 위한 개념 증명 도구를 작성했습니다. 팀은 선언적 특성 때문에 Compose를 사용하면 이 도구를 더 쉽게 개발할 수 있다고 말했습니다.
“Android 개발자가 Jetpack Compose 코드 작성에 익숙해지면 다시 돌아가고 싶어 하지 않습니다.” - 앤서니 앨런 콘다, Mercari Android 기술 책임자
결과
Jetpack Compose와 새로운 디자인 시스템 사이에서 Mercari는 화면 작성에 훨씬 적은 코드를 사용할 수 있었습니다. 무한 스크롤 콘텐츠가 있는 화면(일반적인 사용 사례)에서는 실제로 코드를 약 56% 줄였습니다. 그 결과, 동일한 시간 내에 더 많은 화면을 작성할 수 있었기 때문에 비즈니스 로직과 코드의 다른 부분을 작성하는 데 더 많은 시간을 할애할 수 있었습니다.
또한 애니메이션을 통합하고 AnimatedVisibility, Crossfade, Animatable 등의 직관적인 API를 사용하는 등 UI 자체로 더 많은 일을 할 수 있었습니다.
Mercari는 출시될 때까지 새 애플리케이션에서 Jetpack Compose를 계속 사용할 계획입니다. Jetpack Compose로 작성된 Android SDK를 사용하는 디자인 시스템도 Mercari 내의 여러 애플리케이션과 연동되도록 설계되었습니다.
시작하기
Jetpack Compose에 관해 자세히 알아보세요.