In order to avoid this idea just another playlist generator as it may have been in the past, we focused on the visualisation of those playlists. Something that quickly made a lot of sense to the team was to represent each decade with a concert poster. These items felt like they described each decade in a very unique way. From poster leaflet done in with cut and paste photocopier to big stadium poster, we've researched more than two hundred posters looking at what made sense for each genre for each decade.
"Each decade would have a set of 3 to 6 posters completely custom-made for each user"
Sharing is Key
As we were thinking of ways to visualize playlists in a meaningful way, we decided that sharing had to be key in the experience. We wanted to create an object that would feel like nugget of good memories to the user in a way that would compel them to share those. Posters felt like they fitted that description perfectly.
As Spotify just ended a successful rebrand, we needed to support that initiative while creating an experience that would feel special. We also had two challenges on top of this. Each decade have its own style, and gimmick we had to emulate in order to create a compelling experience. Finally, we were very keen on creating posters using Users data to make these feel truly personal.
With all of our challenges in mind, and having decided on one style direction, we set out to create a first round of poster designs. These were meant to mix UI and graphics. We took that direction in a very minimalist execution. Maybe a bit too much, we needed more of Spotify branding, and to focus more on the artists.
The start page was meant to be the front of the experience. We needed that page to be expressive while carrying the clean look of Spotify. We decided to integrate the Burst within the cycle animation. This animation would tell the story of the experience. A journey from today's music until the 60's.
This was a tricky part of the flow. Originally we asked Spotify to sort out all information based on the taste profile of the user and present users with a result without having them work on anything. Unfortunatelly, Spotify API couldn't handle it so we had to scale back to pick your favorite artist solution. We designed this screen so it would grab the latest Artist users have been listening to. We also took great care into animating loadings and transitions as well as press state so the user won't feel like this is work.
Early on, Stefan and I identified a big challenge for the posters to come to life on all screens. The 4:3 traditional ratio of a poster isn't ideal to responsive strategy. We've worked closely with Arnaud to create 2 result pages based on the screen ratio. It would work throughout for mobile and desktop.
Push to Stage
Creating such a complex experience required the developement team and I would work in sync. Not only did we sat together and talk things through but I also prepared multiple handoff documents to help them go through the complexity of the experience. As the developement was well under way we were constantly improving the interface and adding posters.