Case study

SoundCloud utilizza Jetpack Glance per creare il widget Tracce piaciute in sole 2 settimane

3 minuti di lettura

Per semplificare ulteriormente l'ascolto su Android, gli sviluppatori di SoundCloud, una piattaforma musicale che mette al primo posto gli artisti, si sono rivolti a Jetpack Glance per creare un widget Tracce piaciute per la loro app con una valutazione elevata, che vanta 4,6 stelle e oltre 100 milioni di download. Con un catalogo di oltre 400 milioni di brani di più di 40 milioni di creator, SoundCloud si impegna a mettere in contatto artisti e fan tramite la musica e questo ultimo aggiornamento della sua app per Android offre agli ascoltatori un modo ancora più comodo per ascoltare i loro brani preferiti. Grazie a Glance, il team è riuscito a completare il progetto in sole due settimane, risparmiando tempo di sviluppo prezioso e aumentando il coinvolgimento.

Massimizzare la visibilità con punti di contatto intuitivi

Mostrando la copertina dei brani piaciuti di recente, il nuovo widget Tracce piaciute consente agli utenti di passare direttamente a un brano specifico o di accedere all'elenco completo delle tracce direttamente dalla schermata Home. In questo modo, SoundCloud rimane in primo piano per gli ascoltatori, fungendo da scorciatoia per le loro raccolte personali e incoraggiandoli a sintonizzarsi di nuovo.

Tracce piaciute non è il primo widget di SoundCloud. Più di dieci anni fa, gli sviluppatori di SoundCloud hanno utilizzato RemoteViews per creare un widget Player che consentiva agli utenti di controllare facilmente la riproduzione e di mettere Mi piace ai brani. Dopo aver aggiornato di recente il widget Player in base al feedback sul design, gli sviluppatori si sono assicurati di dare la priorità a un'interfaccia personalizzata per Tracce piaciute. Il nuovo widget è disponibile in modalità chiara e scura, si ridimensiona liberamente per adattarsi alle preferenze dell'utente e adatta dinamicamente il tema per completare lo sfondo dell'utente. Grazie a Glance, queste scelte di design hanno fatto sì che il widget non solo fosse facile da usare, ma fungesse anche da gateway accattivante e personalizzato per l'app SoundCloud.

souncloudJetPack2.png
Il widget Tracce piaciute di SoundCloud in azione.

Accelerare i cicli di sviluppo con Glance

Glance ha svolto un ruolo fondamentale anche nella semplificazione dello sviluppo di Tracce piaciute. Per gli sviluppatori già esperti di Compose, il design intuitivo di Glance è risultato familiare, riducendo la curva di apprendimento e accelerando l'onboarding del team. Anche la raccolta di esempi di codice della piattaforma ha fornito un punto di partenza utile, aiutando gli sviluppatori a comprendere rapidamente le sue funzionalità e le best practice. "L'utilizzo dei repository di app di esempio è un ottimo modo per imparare. Posso controllare un intero repository e verificare il funzionamento del codice", ha affermato Sigute Kateivaite, ingegnere capo di SoundCloud nel team Android. "Ha accelerato notevolmente lo sviluppo dei nostri widget".

SoundCloudJetPack3.png

La natura dichiarativa dell'UI di Glance è stata particolarmente utile per gli sviluppatori. Poiché non dovevano utilizzare file XML aggiuntivi durante la creazione, gli sviluppatori potevano creare codice più pulito e leggibile con meno boilerplate. Glance ha anche consentito loro di lavorare con i moduli separatamente, il che significa che i componenti potevano essere scritti e integrati uno alla volta e riutilizzati per le iterazioni successive. Isolando i componenti, gli sviluppatori potevano testare rapidamente i moduli, identificare e risolvere i problemi e creare per stati diversi senza duplicazioni, il che ha portato a flussi di lavoro più efficienti.

Il design di Glance ha anche migliorato la qualità complessiva del codice. La possibilità di apportare modifiche utilizzando il supporto di Android Studio per l'anteprima in tempo reale di Glance ha consentito agli sviluppatori di creare componenti in isolamento senza dover integrare il componente UI nel widget o eseguire il deployment del widget completo sul telefono. Potevano rappresentare vari stati, visualizzare tutti i casi pertinenti e rivedere le modifiche ai componenti senza dover compilare l'app completa. In poche parole, Glance ha reso gli sviluppatori più produttivi perché ha consentito loro di eseguire iterazioni più rapide, perfezionando il widget per un prodotto finale più rifinito.

Migliorare i widget delle app con la potenza di Glance

Grazie a nuovi flussi di lavoro efficaci e senza problemi di sviluppo importanti, il team di SoundCloud elogia Glance per aver semplificato una produzione di successo. "Con il nuovo widget Tracce piaciute, il lancio è stato davvero stabile", ha affermato Sigute. "Lo sviluppo e il processo di test sono andati molto bene". I dati iniziali mostrano anche risultati promettenti: in media, gli utenti attivi interagiscono con il widget per accedere all'app più volte al giorno.

SoundCloud4.png
Interazione utente media degli utenti attivi giornalieri con la funzionalità del widget: 2 volte.

In futuro, il team di SoundCloud è ansioso di utilizzare più Glance per migliorare i widget esistenti, ad esempio adottando layout canonici, e persino svilupparne di nuovi. Sebbene il widget Tracce piaciute attuale si concentri principalmente sulla visualizzazione delle immagini, il team è interessato a includere altri tipi di contenuti per arricchire ulteriormente l'esperienza utente. Gli sviluppatori sperano anche di eseguire la migrazione del widget Player a Glance per accedere alle robuste opzioni di applicazione di temi del framework, semplificare i processi di ridimensionamento e risolvere alcuni bug di lunga data.

Oltre alle funzionalità Tracce piaciute e Player, il team è entusiasta del potenziale di utilizzo di Glance per creare una gamma più ampia di widget. L'architettura modulare basata su componenti del widget Tracce piaciute, con elementi riutilizzabili come UserAvatar e Logo, offre una base solida per lo sviluppo futuro, promettendo di semplificare i processi fin dall'inizio.

Inizia a creare widget per app personalizzati con Jetpack Glance

Sviluppa ed esegui rapidamente il deployment di widget che mantengono la tua app visibile e coinvolgente con Glance.


Questo blog post fa parte della nostra serie: Spotlight Week sui widget, in cui forniamo risorse (blog post, video, codice campione e altro ancora) progettate per aiutarti a progettare e creare widget. Puoi scoprire di più nella panoramica di Spotlight Week: Widget, che verrà aggiornata durante la settimana.

Scritto da:
Continua a leggere