Goal

At the end of the previous post, we ended up having a component with a circular progress bar, to finish the component we need to add few fancy animated transformation to the cover.

Observations

Let’s start watching the original component again, maybe at the lowest speed:

Watching it carefully, we can see that there are three different animations:

  • the transformation from square to circle
  • the blurring of the artwork

All those appears when the play is pressed, and smoothly disappear when is stopped.

Let’s implement them one by one starting from the previous project at this…


A while ago Facebook implemented the feature of sharing a song from an external streaming app, like Spotify, Deezer or Apple Music.

Leaving aside all the considerations about what it could mean for sharing music, the thing I liked the most was the smooth animation that transforms the artwork in a spinning record-like; also, the button presents a circular progress bar to indicate the progress of the song.

Goal

We want to replicate in full the Facebook Music Stories animation. Since it would take too much time do it in the same tutorial, we’ll split into two blog posts: in the…


“Effective: from Latin effectivus, from efficere ‘accomplish’. Successful in producing a desired or intended result — Oxford Dictionary of English

As it’s hard to describe yourself, I think the best way to define myself is “effective software developer.”

I’m pragmatic, not dogmatic: too often an experienced developer tends to follow the rules or best practices without asking himself if they are effective or not. Although I’m a long time Agile practitioner, I’m ready to put some practices aside if this helps to reach the goal quicker. I usually keep the practices that contribute to reducing the time to get feedback…

Giordano Scalzo

Developer, Writer, born in 🇮🇹, living in 🇬🇧. Swift, but not only. Putting magic in the apps. Github: https://github.com/gscalzo

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store