Casos de éxito

SoundCloud usa Jetpack Glance para compilar el widget de Liked Tracks en solo 2 semanas

Lectura de 3 min

Para que los usuarios puedan escuchar contenido en Android con mayor facilidad, los desarrolladores de SoundCloud, una plataforma de música que prioriza a los artistas, recurrieron a Jetpack Glance para crear un widget de Liked Tracks para su app mejor calificada, que cuenta con 4.6 estrellas y más de 100 millones de descargas. Con un catálogo de más de 400 millones de pistas de más de 40 millones de creadores, SoundCloud se dedica a conectar a artistas y fans a través de la música, y esta última actualización de su app para Android ofrece a los oyentes una forma aún más conveniente de disfrutar de sus pistas favoritas. Gracias a Glance, el equipo pudo completar el proyecto en solo dos semanas, lo que permitió ahorrar tiempo de desarrollo valioso y aumentar la interacción.

Maximiza la visibilidad con puntos de contacto fáciles de usar

Al mostrar la portada de las pistas que les gustaron recientemente, el nuevo widget de Liked Tracks permite a los usuarios ir directamente a una canción específica o acceder a su lista de reproducción completa desde la pantalla principal. Esto mantiene a SoundCloud en primer plano para los oyentes, ya que actúa como un acceso directo a sus bibliotecas personales y los alienta a volver a sintonizar.

Liked Tracks no es el primer widget de SoundCloud. Hace más de una década, los desarrolladores de SoundCloud usaron RemoteViews para crear un widget de Player que permitía a los usuarios controlar fácilmente la reproducción y marcar pistas como favoritas. Después de actualizar recientemente el widget de Player en función de los comentarios sobre el diseño, los desarrolladores se aseguraron de priorizar una interfaz personalizada para Liked Tracks. El nuevo widget incluye modos claro y oscuro, cambia de tamaño libremente para adaptarse a las preferencias del usuario y adapta de forma dinámica su tema para complementar el fondo de pantalla del usuario. Con el respaldo de Glance, estas opciones de diseño garantizaron que el widget no solo sea fácil de usar, sino que también sirva como una puerta de entrada atractiva y personalizada a la app de SoundCloud.

souncloudJetPack2.png
El widget de Liked Tracks de SoundCloud en acción.

Acelera los ciclos de desarrollo con Glance

Glance también desempeñó un papel fundamental en la optimización del desarrollo de Liked Tracks. Para los desarrolladores que ya dominan Compose, el diseño intuitivo de Glance les resultó familiar, lo que minimizó la curva de aprendizaje y aceleró la incorporación del equipo. La colección de muestras de código de la plataforma también proporcionó un punto de partida útil, lo que ayudó a los desarrolladores a comprender rápidamente sus capacidades y prácticas recomendadas. Usar repositorios de apps de ejemplo es una excelente manera de aprender. Puedo consultar un repositorio completo y revisar cómo funciona el código”, dijo Sigute Kateivaite, ingeniera principal de SoundCloud en el equipo de Android. “Aceleró mucho el desarrollo de nuestro widget”.

SoundCloudJetPack3.png

La naturaleza declarativa de la IU de Glance fue especialmente beneficiosa para los desarrolladores. Como no tenían que usar archivos XML adicionales durante la compilación, los desarrolladores podían crear código más limpio y legible con menos código estándar. Glance también les permitió trabajar con módulos por separado, lo que significa que los componentes se podían escribir e integrar de a uno y reutilizar para iteraciones posteriores. Al aislar los componentes, los desarrolladores podían probar rápidamente los módulos, identificar y resolver problemas, y compilar para diferentes estados sin duplicación, lo que generaba flujos de trabajo más eficientes.

El diseño de Glance también mejoró la calidad general del código. La capacidad de realizar cambios con la compatibilidad de Android Studio para la vista previa en tiempo real de Glance permitió a los desarrolladores compilar componentes de forma aislada sin necesidad de integrar el componente de la IU en el widget ni implementar el widget completo en el teléfono. Podían representar varios estados, ver todos los casos pertinentes y revisar los cambios en los componentes sin tener que compilar la app completa. En pocas palabras, Glance hizo que los desarrolladores fueran más productivos porque les permitió iterar más rápido y definir mejor el widget para obtener un producto final más pulido.

Mejora los widgets de apps con el poder de Glance

Con nuevos flujos de trabajo eficaces y sin problemas de desarrollo importantes, el equipo de SoundCloud elogia a Glance por optimizar una producción exitosa. “Con el nuevo widget de Liked Tracks, el lanzamiento fue muy estable”, dijo Sigute. “El desarrollo y el proceso de prueba se realizaron sin problemas”. Los datos iniciales también muestran resultados prometedores: los usuarios activos ahora interactúan con el widget para acceder a la app varias veces al día en promedio.

SoundCloud4.png
Interacción promedio diaria de usuarios activos con la función de widget.

De cara al futuro, el equipo de SoundCloud está ansioso por usar más Glance para mejorar los widgets existentes, como adoptar diseños canónicos, e incluso desarrollar otros nuevos. Si bien el widget de Liked Tracks actual se centra principalmente en la visualización de imágenes, el equipo está interesado en incluir otros tipos de contenido para enriquecer aún más la experiencia del usuario. Los desarrolladores también esperan migrar el widget de Player a Glance para acceder a las sólidas opciones de temas del framework, simplificar los procesos de cambio de tamaño y abordar algunos errores de larga data.

Además de las funciones de Liked Tracks y Player, el equipo está entusiasmado con el potencial de usar Glance para compilar una gama más amplia de widgets. La arquitectura modular basada en componentes del widget de Liked Tracks, con elementos reutilizables como UserAvatar y Logo, ofrece una base sólida para el desarrollo futuro, lo que promete simplificar los procesos desde el principio.

Comienza a compilar widgets de apps personalizados con Jetpack Glance

Desarrolla e implementa rápidamente widgets que mantengan tu app visible y atractiva con Glance.


Esta entrada de blog forma parte de nuestra serie: Spotlight Week on Widgets, en la que proporcionamos recursos (entradas de blog, videos, código de muestra y mucho más) diseñados para ayudarte a diseñar y crear widgets. Puedes obtener más información en la descripción general de Spotlight Week: Widgets, que se actualizará durante toda la semana.

Escrito por:
Continuar leyendo