Case Studies

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

Temps de lecture : 3 min

Pour faciliter encore plus l'écoute 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, qui compte 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 à mettre en relation 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 de développement précieux et d'accroître l'engagement.

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

En présentant la pochette des titres récemment aimés, le nouveau widget "Titres aimés" permet aux utilisateurs d'accéder directement à un titre spécifique ou à leur liste complète de titres depuis leur écran d'accueil. SoundCloud reste ainsi au premier plan pour les auditeurs, en agissant comme 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 "Lecteur" qui permettait aux utilisateurs de contrôler facilement la lecture et d'aimer des titres. Après avoir récemment mis à jour le widget "Lecteur" en fonction des commentaires sur la conception, les développeurs se sont assurés de donner la priorité à une interface personnalisée pour "Titres aimés". Le nouveau widget propose les modes clair et sombre, se redimensionne librement pour s'adapter aux préférences de l'utilisateur et adapte dynamiquement son thème pour compléter le fond d'écran de l'utilisateur. Grâce à Glance, ces choix de conception ont permis de s'assurer que le widget n'est pas seulement facile à utiliser, mais qu'il sert également de passerelle attrayante et personnalisée vers l'application SoundCloud.

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

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

Glance a également joué un rôle essentiel dans la simplification du développement de "Titres aimés". Pour les développeurs déjà compétents dans 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. "L'utilisation de dépôts d'applications exemples est un excellent moyen d'apprendre. Je peux consulter 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 beaucoup accéléré le développement de notre widget."

SoundCloudJetPack3.png

La nature déclarative de l'interface utilisateur de Glance a été particulièrement bénéfique pour les développeurs. Comme ils n'avaient pas à utiliser de fichiers XML supplémentaires lors de la création, les développeurs ont pu créer un code plus propre et plus lisible avec moins de code passe-partout. Glance leur a également permis de travailler séparément avec des modules, 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 états différents sans duplication, ce qui a permis d'améliorer l'efficacité des workflows.

La conception de Glance a également amélioré 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 rendu les développeurs plus productifs, car il leur a permis d'itérer plus rapidement, en affinant le widget pour obtenir un produit final plus abouti.

Améliorer 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. "Avec le nouveau widget "Titres aimés", le déploiement a été très stable", explique Sigute. "Le développement et le processus de test se sont déroulés sans problème." 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
Interaction moyenne des utilisateurs actifs quotidiens avec la fonctionnalité de widget multipliée par deux.

À l'avenir, l'équipe SoundCloud souhaite utiliser davantage Glance pour améliorer les widgets existants, par exemple en adoptant des mises en page canoniques, et même 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 contenu pour enrichir davantage l'expérience utilisateur. Les développeurs espèrent également migrer le widget "Lecteur" vers Glance pour accéder aux options de thème robustes du framework, simplifier les processus de redimensionnement et résoudre certains bugs persistants.

Au-delà des fonctionnalités "Titres aimés" et "Lecteur", l'équipe est enthousiaste à l'idée d'utiliser Glance pour créer un plus large éventail 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.

Commencer à créer des widgets d'application personnalisés avec Jetpack Glance

Développez et déployez rapidement des widgets qui maintiennent votre application visible et attrayante avec Glance.


Cet article de blog fait partie de notre série : Spotlight Week sur les 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 Spotlight Week : Widgets, qui sera mise à jour tout au long de la semaine.

Écrit par :
Lire la suite