Christoph A. Johns

Christoph A. Johns

PhD in Human-Computer Interaction @ Aarhus University

Spotify - Album Booklets

Spotify - Album Booklets
Feature design for album booklets and interactive liner notes in the Spotify mobile app.

Problem

This project focussed on the brief: Up-and-coming artists need to be able to succinctly express their own identity on Spotify because Spotify is currently focussed on distribution instead of expression. This problem was further narrowed down and operationalised into the “How Might We” (HMW) question “How might we translate the experience of an album booklet into a digital format?” We decided to focus on album booklets as they constitute a formerly important and valuable form of expression for artists as well as an opportunity for deeper engagement with an album for serious listeners and fans that has yet to translate to the primary platforms for digital music distribution and consumption. If translated into an attractive digital format, they could, furthermore, provide artists with an additional tool to promote their music between releases (e.g. on creative breaks) which we identified as an important theme during our analysis.

Excerpt of desk research
Several research methods were used to understand target users and the problem space at large. Here, an excerpt of the desk research is displayed.

Research

We employed several research methods to understand the problem space and to build empathy for our target users. Among other methods, desk research, affinity diagramming, How-Might-We questions, forum reviews and interviews with several key user groups across four different countries were conducted. One highlight of this research phase were the interviews with several artists promoting their music on Spotify ranging from local indie groups to a national artist with several hundred thousand monthly listeners.

Sketches
Analogue as well as digital tools were used to ideate and develop ideas. The resulting sketches and wireframes were later refined into a Figma prototype.

Ideation and Development

The ideation followed an exploration and delivery schema derived from the Double-Diamond method. We used, among other methods, Worst Possible Idea, Crazy 8s, concept sketches, wireframes, mockups and interactive prototypes to arrive at our final solution. Due to the COVID-19 pandemic, the ideation and development were solely conducted online and remotely.

Mockups
The new album booklet feature was incorporated into Spotify's existing mobile application and design language. It was later tested with actual Spotify users and artists.

Delivery and Testing

Our proposed design addresses the identified user concerns by introducing the following core features to the Spotify mobile application:

(1) Artists can add supplemental multimedia content to their albums through a block-style WYSIWYG editor. These blocks include, for example, media content (e.g. images, links), Spotify elements (e.g. songs, podcast episodes), cross-selling elements (e.g. merchandise offers, tour dates), social elements (e.g. top highlights, critical reviews), and Spotify-generated user statistics (e.g. similar to “Spotify Wrapped”).

(2) Artists can promote these booklets and thereby their music through card-style placements on their fans’ home tab.

(3) Listeners can access, interact with, and save booklets. The links to these booklets are stored in a new “Booklets’’ tab in their personal library.

(4) Albums that include booklets are highlighted through a new icon for increased visibility.

The full interactive Figma prototype can be accessed at: https://www.figma.com/proto/w5VzY5xQBazuBNG7LDZOfC/Mockup?node-id=5%3A2&viewport=-1085%2C-2587%2C0.39961978793144226&scaling=scale-down. The artist flow (i.e. a quick prototype of the proposed WYSIWYG editor) can be accessed via the cog wheel icon (“settings”) on the home tab.