Radio for SoundCloud

Making it easier to find your favorite tracks

thirteen23
Jun 15, 2015 · 3 min read
Promo video to announce the app’s launch

Music in Motion

The player view was our biggest challenge. This view required different animations to be assigned to different layers with literally every element on the screen animating in different ways. Keeping this motion-rich UI snappy was a challenge. It required balancing the memory demands of loading images and playing the next track, while also keeping animations smooth.

Transition from player to playlist

What We Learned

We’re not new to Core Animation, but building the Radio for SoundCloud application allowed us to spend a little more time in the deep end of the pool. We needed to figure out how to elegantly create a group of animations that a user can scrub through and match up with finger tracking. To get the player triangle to animate to a circle we had to chain up to 14 simple animations across five different layers per animation.

What’s Next?

We’ll give you a hint: Your favorite tracks might soon be accessible from your wrist. Until then, we hope that you’ll enjoy Radio for SoundCloud as much as we do.


The Garage

Read more about our team’s thoughts and experiments at thirteen23, a digital product studio in Austin, Texas.

thirteen23

Written by

We bridge the space between art and science to build intelligent digital products. http://thirteen23.com

The Garage

Read more about our team’s thoughts and experiments at thirteen23, a digital product studio in Austin, Texas.