Études de cas

SoundCloud utilise Jetpack Glance pour créer un widget "Titres aimés" en seulement deux semaines

Temps de lecture : 3 min

Pour permettre aux utilisateurs d'écouter encore plus facilement de la musique sur Android, les développeurs de SoundCloud, une plate-forme musicale axée sur les artistes, ont utilisé Jetpack Glance pour créer un widget "Titres aimés" pour leur application très bien notée (4,6 étoiles et plus de 100 millions de téléchargements). Avec un catalogue de plus de 400 millions de titres de plus de 40 millions de créateurs, SoundCloud s'engage à connecter les artistes et les fans grâce à la musique. Cette dernière mise à jour de son application Android offre aux auditeurs un moyen encore plus pratique de profiter de leurs titres préférés. Grâce à Glance, l'équipe a pu terminer le projet en seulement deux semaines, ce qui lui a permis de gagner un temps précieux sur le développement et de booster l'engagement.

Maximisez la visibilité grâce à des points de contact conviviaux

En affichant les pochettes des titres récemment aimés, le nouveau widget "Titres aimés" permet aux utilisateurs d'accéder directement à un titre spécifique ou à la liste complète de leurs titres depuis l'écran d'accueil. Cela permet aux auditeurs de garder SoundCloud au premier plan, en leur offrant un raccourci vers leurs bibliothèques personnelles et en les encourageant à revenir.

"Titres aimés" n'est pas le premier widget de SoundCloud. Il y a plus de dix ans, les développeurs de SoundCloud ont utilisé RemoteViews pour créer un widget de lecteur permettant aux utilisateurs de contrôler facilement la lecture et d'aimer des titres. Après avoir récemment mis à jour le widget du lecteur en fonction des commentaires sur la conception, les développeurs ont veillé à donner la priorité à une interface personnalisée pour les titres aimés. Le nouveau widget propose des modes clair et sombre, se redimensionne librement pour s'adapter aux préférences de l'utilisateur et adapte son thème de manière dynamique pour s'harmoniser avec le fond d'écran de l'utilisateur. Grâce à Glance, ces choix de conception ont permis de créer un widget non seulement fluide, mais aussi attrayant et personnalisé, qui sert de passerelle vers l'application SoundCloud.

souncloudJetPack2.png
Widget "Titres aimés" de SoundCloud en action.

Accélérez les cycles de développement avec Glance

Glance a également joué un rôle crucial dans la simplification du développement de Liked Tracks. Pour les développeurs maîtrisant déjà Compose, la conception intuitive de Glance leur a semblé familière, ce qui a minimisé la courbe d'apprentissage et accéléré l'intégration de l'équipe. La collection d'exemples de code de la plate-forme a également fourni un point de départ utile, aidant les développeurs à comprendre rapidement ses fonctionnalités et ses bonnes pratiques. "Les dépôts d'applications exemples sont un excellent moyen d'apprendre. Je peux extraire un dépôt entier et inspecter le fonctionnement du code", explique Sigute Kateivaite, ingénieure principale de SoundCloud dans l'équipe Android. "Cela a considérablement accéléré le développement de nos widgets."

SoundCloudJetPack3.png

La nature déclarative de l'UI de Glance a été particulièrement bénéfique pour les développeurs. Comme ils n'avaient pas besoin d'utiliser de fichiers XML supplémentaires lors de la compilation, les développeurs ont pu créer un code plus propre et plus lisible, avec moins de code récurrent. Glance leur a également permis de travailler avec des modules séparément, ce qui signifie que les composants pouvaient être écrits et intégrés un par un, puis réutilisés pour des itérations ultérieures. En isolant les composants, les développeurs ont pu tester rapidement les modules, identifier et résoudre les problèmes, et créer des composants pour différents états sans duplication, ce qui a permis d'améliorer l'efficacité des workflows.

La conception de Glance a également permis d'améliorer la qualité globale du code. La possibilité d'apporter des modifications à l'aide de la compatibilité d'Android Studio avec l'aperçu en temps réel de Glance a permis aux développeurs de créer des composants de manière isolée, sans avoir à intégrer le composant d'interface utilisateur dans le widget ni à déployer le widget complet sur le téléphone. Ils pouvaient représenter différents états, afficher tous les cas pertinents et examiner les modifications apportées aux composants sans avoir à compiler l'application complète. En d'autres termes, Glance a permis aux développeurs d'être plus productifs, car ils ont pu effectuer des itérations plus rapidement et affiner le widget pour obtenir un produit final plus soigné.

Améliorez les widgets d'application grâce à la puissance de Glance

Grâce à de nouveaux workflows efficaces et à l'absence de problèmes de développement majeurs, l'équipe SoundCloud félicite Glance pour avoir simplifié une production réussie. "Le déploiement du nouveau widget Liked Tracks (Titres aimés) a été très stable", a déclaré Sigute. "Le processus de développement et de test s'est très bien déroulé." Les premières données montrent également des résultats prometteurs : les utilisateurs actifs interagissent désormais avec le widget pour accéder à l'application plusieurs fois par jour en moyenne.

SoundCloud4.png
Les utilisateurs actifs par jour interagissent deux fois plus avec la fonctionnalité de widget.

L'équipe de SoundCloud est impatiente d'utiliser davantage Glance pour améliorer les widgets existants, par exemple en adoptant des mises en page canoniques, et même d'en développer de nouveaux. Bien que le widget "Titres aimés" actuel se concentre principalement sur l'affichage d'images, l'équipe souhaite inclure d'autres types de contenus pour enrichir davantage l'expérience utilisateur. Les développeurs espèrent également migrer le widget du lecteur vers Glance pour accéder aux options de thèmes robustes du framework, simplifier les processus de redimensionnement et corriger certains bugs de longue date.

Au-delà des fonctionnalités "Titres aimés" et "Lecteur", l'équipe est enthousiasmée par le potentiel de Glance pour créer une plus grande variété de widgets. L'architecture modulaire basée sur des composants du widget "Titres aimés", avec des éléments réutilisables tels que UserAvatar et Logo, offre une base solide pour le développement futur, promettant de simplifier les processus dès le départ.

Premiers pas avec la création de widgets d'application personnalisés avec Jetpack Glance

Développez et déployez rapidement des widgets qui permettent à votre application de rester visible et d'engager les utilisateurs avec Glance.


Cet article de blog fait partie de notre série Spotlight Week on Widgets, dans laquelle nous fournissons des ressources (articles de blog, vidéos, exemples de code, etc.) conçues pour vous aider à concevoir et à créer des widgets. Pour en savoir plus, consultez la présentation de la Spotlight Week : Widgets, qui sera mise à jour tout au long de la semaine.

Written by:
Continuer la lecture