top of page
Search

Spotify Redesign

  • Writer: Ryan Badertscher
    Ryan Badertscher
  • Nov 10, 2022
  • 6 min read

Updated: Dec 14, 2022



For the third project at the Ironhack boot camp, student were challenged to redesign an app of there choosing. I chose to redesign the interface for Spotify's android app. While the player has adapted many times over the years, I felt that the interface could use some improvement.


As Spotify has a strong brand identity, I decided not to change the overall look or colors of the app. Rather, I actually like most of Spotify's branding. Instead, I chose to focus on the information architecture and organization of the app, as well as adding some new features. I felt that while the app has many excellent features, the organization of those features makes many of them difficult to find. In fact, there were some features that I only discovered while going through as many user flows as I could find during my brief UX phase. And this with me being a daily user of the app for several years.


So, the task I chose to pursue was this: To make Spotify easiest to use, while preserving the brand identity and features that user’s are always familiar with.


The Research: Asking the right questions


Even though this was a UI based project, I think one can not really do a good UI without research. How do I know what problem to address if I don’t know what the problems are?


I started out with some desk research with the following questions in mind:

  • Who is using Spotify (demographics)?

  • Where is Spotify being used?

  • What are the people using Spotify for, other than the obvious?

  • How do people use the app?

  • What might I be missing?

In essence: "Who is using this app and what are they doing with it?"


This might seem like a pointless question to ask. Its a music and podcast app, so of course that is what people are doing with it. Listening to music and podcasts. But that answer is to surface level. I wanted to know how and why people were listening to the content they were listening to. How did they chose the songs? Where were they located? How old are they?

By looking at data released by Spotify and outside sources, as well as looking at reviews of the app on Google Play and the App Store, I came to some conclusions. Some of these conclusions were the the following:


















I gathered further data, but I will not go into further detail here. What is important, however, was the picture that began to emerge from the data. Spotify is mostly used most heavily by younger people in Western countries and Latin America. Further they were using Spotify for more than listening to their favorite songs.


Instead, Spotify is an important way for people to discover new music. Both the average number of hours listened by each user, as well as the number of artists listened to by each have both increased in recent year. This indicated to me that people are discovering their music on the app, meaning it is also a place of exploration.


Looking at reviews, I also determined that Spotify is also often used to “set a mood,” or so to say. Users look for certain types of music that make them feel a certain way in different situations. This may seem obvious, but it also reveals the strong importance of emotion in the app, stemming from the music.


Further, the number of artists listened to each month by the average user is growing dramatically. From 2014 to 2017, this number grew by 37%. This indicates that users are not only listening to music on Spotify. They are discovering artists and diversifying their musical tastes within the app. With this being the case, Spotify has become more than just a music player, but a tool of discovery.

At this point I realized that between the growth in musical diversity of the average listener, as well as the strong connection between emotion and music, this opened the door some interesting possibilities. Spotify is clearly well equipped to create playlists, given the popularity of the companies premade sections. But how could we improve the experience of users given all of this information?


Ideating


I began to brainstorm ideas of what could be improved about the app’s interface. It was at this point that I decided to focus on information architecture. Spotify had many great features that helped users explore their musical tastes and to create mood. However, I find the organization of the categories to be somewhat chaotic. Playlists and suggestions are in several places. Podcasts and music are sometimes to be found on the same pages.


So I asked myself: How can these features be kept, but made more accessible? And also, how can I add to the app in a meaningful way?


Re-organizing is good, but this project was about creativity. And creativity is more than that. Creativity is about taking inspiration from other sources, adding your own spin to it, and adding something original.


I explored various options, especially regarding adding features and the information architecture. But ultimately I decided on the following design.


The Design


I began by outlining a new information architecture. I decided to separate the podcasts from the music, to change the top and bottom bars, as well as simplify the home page. The primary focus was to group like features with like features. That is to say, rather than having music suggestions on both the home page and on the search page, I put all curated content in one tab.


Starting with the bottom bar, I created the following four buttons: Home, Curated Content, Podcasts and Music. In doing this, I eliminated the search button, and separated the podcast and music libraries.


The search button became part of the top bar in the form of a search bar. This was accompanied by a user profile button, life in the existing app, and a hamburger button. Unlike in the original app, both the top and bottom bars are present on all scenes, with the exception of the music playing screen.


I simplified the home scene to have just four categories: Recently Played, Your Queue, Charts, and Alerts and News. All of these features exist on the current app. However, alerts and queue are hidden far deeper in the user flow or as a minor feature at the top. I felt charts should be on the front page, as the most listened to playlists on the app are the “top charts” playlists.


The Curated Content feature was one I added. Here the options are Made for You, Explore, Your Moods, Vibes, Themes, and Genres. Some of these are existing categories (Made for You), others were regrouping of existing categories playlists (Vibes) which I felt could logically be grouped together. Vibes, for example, are all playlists that are related to moods associated with certain experiences or settings.


The Moods category, however, was a feature I decided to add. Since music is so tied to emotion, users reported that they often created a playlist with titles like “sad,” “break up songs,” “party time,” ect. So I thought “why not cut out the middle step, and make it easier?” I wanted to allow users to relate their raw emotional reaction to a song directly into input.


With this in mind, I added an emoji “react” option to the music player page. Emoji have been pioneered by Facebook some years ago. In this Spotify redesign, selecting one of several emoji options automatically assigns the song to a playlist under the Mood category. These playlists are signified by the same emoji, allowing users to project their own meaning onto the icon. I chose emojis for this purpose because they were originally intended to relate emotion through text messages, to address the information gap left by the lack of non-verbal communication in this medium. So how better to categorize emotion in this medium?


Originally, I went with a conventional emoji set. However, I received feedback that the conventional yellow emojis clashed with Spotify’s aesthetic. And given that I had chosen to keep the color scheme and other brand elements of Spotify, I agreed. Therefore, I made the emojis Spotify green, so they would not clash with the overall look of the app. Further, I went with the square design with rounded corners to reflect the playlist and album buttons which feature so prominently on the rest of the app.


It is important to note that the emoji reactions are not mutually exclusive with the heart icons, which “likes” songs. “Liked” songs are then added to a “favorites” playlist. This feature was pre-existing, and does add value to the app.


Lastly, I created two scenes to represent the Mood and Vibes categories, which are child elements of the Curated Content page. I was limited with time and with the number of scenes for the project, so I chose the two I felt were the most original. It was especially important to create the Mood page, to further explain this added feature. The overall look of the pages is very similar to Spotify’s existing playlist interface, as this feature is already highly functional.





In Closing


Overall, I found this project to be both engaging and eye opening. This was my first time both auditing an app, and my first time doing an app redesign. It presented a different challenge than the previous projects, which were all about designing from the ground up. This led me to think about the design process in a very different way. It, of course, was also a great opportunity to work on my UI skills.


 
 
 

Comments


bottom of page