ZEPETO planea migrar al menos el 80 % de la interfaz de usuario de la aplicación a Jetpack Compose

ZEPETO es un universo social en 3D construido por NAVER-Z con más de 300 millones de usuarios en más de 200 países. Esos usuarios pueden crear avatares únicos, fomentar amistades y explorar reinos virtuales de su propio diseño. ZEPETO se compromete a crear espacios que prioricen la experiencia del usuario. Para sus ingenieros, eso significó hacer el cambio a Jetpack componerel conjunto de herramientas moderno de Android para crear una interfaz de usuario nativa.

Abrazando Jetpack Compose

ZEPETO se diseñó y desarrolló originalmente con Views, Unity y OpenGL, pero hoy en día, el 20 % de la interfaz de usuario escrita originalmente en Views se reescribió con Jetpack Compose. Los desarrolladores de ZEPETO comenzaron a integrar secuencialmente el conjunto de herramientas sabiendo que resolvería una serie de puntos de fricción de ingeniería recurrentes. Con el sistema Vistas, implementar una interfaz de usuario personalizada con algunas formas específicas, como controles deslizantes o interruptores, requería implementar el método onDraw con un lienzo. Jetpack Compose permite a los desarrolladores de ZEPETO implementar este tipo de interfaz de usuario en Kotlin sin necesidad de implementar clases personalizadas, lo que simplifica el proceso y elimina los pasos adicionales necesarios.

Limpiando el código base

Con Jetpack Compose, los desarrolladores de ZEPETO reescribieron funciones de interfaz de usuario complejas. Construyeron un sistema de diseño que ayudó a organizar las fuentes y los tamaños de una manera más intuitiva, mejorando la capacidad de mantenimiento, la eficiencia y la UX. “Usando Compose, reescribimos partes de la aplicación donde la interfaz de usuario es relativamente compleja y existen varias lógicas comerciales, como la tienda de personajes, la entrega de regalos y la decoración de la cara”, dijo el desarrollador de Android Hojung Kim. En lugares como el buscapersonas y las áreas de cuadrícula de la tienda de personajes, Las funciones componibles ayudaron a reducir la cantidad de código en más del 10%.

El equipo de ZEPETO decidió migrar también sus componentes de diálogo comunes a Compose. Esto permitió a sus ingenieros utilizar el tipo de diálogo deseado que se necesitaba en todas las partes de la aplicación. “Cada elemento del diálogo común ahora se puede convertir en un componente, lo que hace posible crear un diálogo común, al igual que ensamblar un Lego”, dijo Juhyung Park, desarrollador de Android en ZEPETO. La modularización del código permitió a los ingenieros implementar componentes de aplicaciones de uso común mucho más rápido que antes. Al migrar estos componentes de diálogo, el equipo pudo limpiar Más de 1600 líneas de códigohaciéndolo mucho más legible, comprensible y significativamente más fácil de mantener.

Refinar la experiencia del desarrollador

Jetpack Compose aumentó drásticamente la eficiencia de la vista previa, el desarrollo y la implementación de la interfaz de usuario al permitir que los desarrolladores reutilicen y compartan elementos de la interfaz de usuario. Los desarrolladores de ZEPETO ya han creado más de 230 funciones de vista previa para probar y depurar funciones sin esfuerzo en toda la aplicación.

También fue relativamente fácil para el equipo aprender a usar Jetpack Compose. “Los desarrolladores familiarizados con el sistema Android View existente no tardan mucho en llegar a un nivel en el que puedan usar Compose en la práctica”, dijo Hojung.

Avanzando con Compose

El equipo de ZEPETO está motivado por el creciente apoyo de Google a Jetpack Compose, ya que está claro que Compose es una gran prioridad para Google. Están entusiasmados con la forma en que Google está integrando más API de Android con Compose y esperan un mayor desarrollo del conjunto de herramientas.

Varias de las funciones de ZEPETO ahora se crean con Jetpack Compose junto con los gráficos creados con Unity y OpenGL, como la tienda de personajes, los editores de video y fotos y los componentes de diálogo, pero el equipo no planea detenerse ahí. Dadas las mejoras que han visto con la velocidad de desarrollo, el mantenimiento del código y la reducción del código, continuarán migrando las pantallas existentes y creando nuevas funciones con Compose. “A la larga”, finalizó Hojung, “más del 80 % de la interfaz de usuario se escribirá con Compose”, mientras que la interfaz de usuario y los gráficos restantes se escribirán con Unity y OpenGL.

Optimiza tu aplicación

Aprenda cómo puede actualizar su desarrollo de interfaz de usuario con Jetpack componer.