Progressive Web… Album?
Building a modern album page for Lamb of God
Last Friday, Lamb of God celebrated the 15th anniversary of their critically acclaimed album Ashes of the Wake by reissuing the record with an additional four non LP tracks. I was approached by 5bam to help develop a digital experience for fans. Rather than build something conceptual, I pitched an idea that was much more practical to meet the time and budget constraints the client had provided. The idea was to build a simple album page which used the release aesthetic and allowed fans to explore the artwork, read through the lyrics, dive into the credits, and most importantly: stream the full music in a legal manner. Check out the outcome by visiting www.ashesofthewake.com and read on to understand why I think this build is important and how it was developed.
At the beginning of my career, I spent a lot of time building custom player experiences for artists. One of the first I really remember was the viewfinder player for Band of Horses Infinite Arms which used the SoundCloud API platform. (Side note: this player was also one of the reasons I ended up being hired by SoundCloud.) From what I remember, the player worked well as it was simply streaming MP3s through an HTML5 <audio> tag but it had one major fault: the band was not getting paid. Yes, this was long before SoundCloud was paying artists and streams driven by custom experiences were considered part of the marketing cost. I stand by that tactic to this day.
Well things didn’t really change in the past 8 years and worst… the SoundCloud platform stopped functioning properly, API keys stop being issued, and I began to lose hope. In the meantime, my business had changed entirely as I began to take on deeper artist problems and worked on becoming an all around smarter Product person. (I’m still working on this.) In that same period of time, Spotify and Apple Music solidified their position as the main services on which fans would experience music. The album page was standardized to fit the expectations of a native app design system and the idea of customization became non-existent. One of the more important innovations to the album became URL redirection services which allowed artists to share a single URL which would direct users to listen to their streaming service of choice. Sad. Artists were slowly losing control over another important property of their career.
And then something amazing happened.
Out of the construction of their own web player experience, Spotify released the Web Playback SDK which promised full audio streaming in 3rd party web apps for fans willing to login with their premium Spotify accounts. Apple Music then followed suit by releasing Music Kit JS for the web which had a Javascript powered music player built right into it. I quickly got to work and developed an engine that exists as a sort of average of both platforms, promising to make full audio streaming available to premium users in the browser. Being experimental, this technique isn’t without issue and I suspect the technology will evolve quickly in the next few years. However, it feels promising considering where we were just two years ago. It’s important that we as developers participate and challenge the possibilities of these audio platforms because their progress opens up more opportunities for artists.
That brings us back to the Ashes of the Wake experience. Could we develop a more tailored alternative to the music service album page using this technology? I had very simple goals that must be met. Namely, the page should be able to be visually customized to better relate to the aesthetic of the release and it should provide all content that the vinyl reissue contains: credits, thanks, lyrics, and photos. However, it should also feel familiar to the existing design systems of album pages so that it’s not so foreign it isn’t accessible. (We’ll save the truly experimental player experiences for later.) I studied these goals and audited the state of album page designs to come up with the following wireframe layout.
The front page would contain a short introduction and all album related content from the tracklist to credits. Stuck to the bottom of this page would be a minimal player with the currently playing track title and a playback toggle. You may click on the blank area of the footer bar to slide up the actual player which contains further controls and track specific content like lyrics. Technically you can explore all of this content without the need to login. We only prompt for login when the user clicks the play button.
Given how experimental this idea is, it’s important that the app can exist as a companion content experience as well as an alternate listening experience. This makes it useful for all fans regardless of how much might be able to listen. Once the client and I were happy with this functional layout, I then integrated the legendary art direction of Ken Adams to complete our experience.
This is a very simple web app but compared to existing listening experiences provided by the music services, it is a fucking renaissance. Users should be able to listen to music in the manner that makes sense for them. Maybe they just want to consume the audio while doing another task. Perhaps, they like that robots or curators are helping them discover in new music via playlists. However, there are still groups of fans who want to dive in and explore every angle of a release from its sonic qualities and collaborators to its art and lyrics. It’s important that artists continue to invest into mold breaking listening experiences rather than sit by while the music services standardize the format further. Having said that, these opportunities would not be possible if it wasn’t for the hard work of the Spotify and Apple Music platform teams. Thank you to those teams for unlocking these tools.
In the end, if you pay to stream music, you should be able to stream it wherever you are. Artists now have the technology to evolve the listening experience (from the comfort of the web) and regain control of this incredibly important career property (while still driving streams.) I encourage developers to take a close look at the Spotify Web Playback SDK and Apple Music MusicKit JS libraries, understand the gaps in the listening experiences, and begin coming up with new solutions. I believe these experiences can co-exist with the listening experiences on streaming services rather than try to replace them. They can also go way beyond the problem of listening and help to solve additional artist and fan problems.
Well, this has turned into one interesting post about Lamb of God. 😆 Thanks again to 5bam for the opportunity to work with another legendary metal artist. Ashes of the Wake 15 anniversary reissue is out now. Visit our experience or your favorite streaming app to listen.
