Spooftify

The Premise

Music streaming has become ubiquitous, it has taken over as the primary medium of listening to music for many users. Through the exponential increase in demand for music streaming apps, has come a great number of choices for streaming music. Competition has bred excellence. Today, most streaming apps are well received, but are they perfect? If not, then how can they become more perfect? These are the question our team sought to answer as we built up an information architecture on music streaming.

Beginnings

To find answers, we looked to our peers. We found nine UCSD students who regularly use music streaming apps, preferably those who use, or have used multiple different kinds. To these nine, we asked a series of questions, hoping to find the good, the bad, and the ugly. We used these questions as a starting point in our interviews, an entryway to deeper, more fundamental answers.

Interview questions

From these interviews, we were able to extract several distinct user scenarios. These scenarios served to give us a breadth of insight into the different ways users interact with playlists. Among the key insights gained from these interviews include: users value being able to quickly create playlists on the fly, and users found managing playlists to be difficult.

User Scenarios

With this new information in mind, we decided the next step was to dive deep into a head to head comparison between streaming apps. We decided the three contenders were to be: Spotify, Google Play Music, and SoundCloud. We formulated nine different instances where one app performs a functionality well where as another performs it poorly.

We went on to use these three streaming apps to perform a competitive analysis. We meticulously combed through and mapped each app’s navigation system to the first, second, and third layers. This gave us a good idea on how each app laid out information and gave us some ideas to their motivations.

We also documented each app’s genre hierarchy in order to see how this data was structured. We found that every app had its own way of doing things. In particular, Google Play Music seemed to highly value providing the user with a large number of curated playlists. They virtually have one for every demographic and situation. One downside of this was that each individual playlist had low visibility. It was hard to find what you wanted when there were so many. We thought this was worth looking into for our redesign.

The Home Screen: Designed for efficiency

While this screen may appear familiar to a frequent Spotify user, it has been redesigned in our app for better efficiency of use. On this screen, we introduced an “accelerator” section called “Recently Played” for ease of access to recently heard music. Spotify lacks this feature on their home screen. Instead, they give the user an array of their curated playlists. We found that these offerings are rarely taken advantaged of by our users during their interview process. Thus, removing this section with a more frequently visited feature seemed like the more efficient thing to do, especially since this is the first page they see.

The Search Screen: Designed For Organization

Again, we want this screen to feel familiar to a frequent user of a music app. From our competitive analysis and usage comparison, we found that all the apps we looked at lacked an easy-to-navigate search page. Both Spotify and SoundCloud combine all of their search results, regardless of type, into one page. But, we wanted a search feature that can be both granular and general when displaying search results. Therefore, next to the search bar, we added a drop down feature that can change the types of search result the user wants to see on this page. Some examples of types are playlists, songs, artists, and albums.

The “Create a New Playlist” Screen: Designed to Be Simple

One of our redesign scenarios included an instance where the user wants to create a new playlist from trying to add a new track. The screen above shows part of this process. In all the apps we analyzed, we saw that we were navigated away from our current view if we are trying to create a playlist from a song. To avoid these unnecessary full-page and click-heavy steps, we decided to add everything into a popover modal. We considered some drawbacks from this approach, such as having a long list of playlists may make this feature be similar to a full-page step, however, if we implement the ability to scroll within this modal, we will reduce this problem.

The Playlist Screen: Designed for Intuition

Another scenario we implemented was the process of managing playlist items. In these screens, we are showing the multiple ways to remove a song from a playlist. One way is to use the “ellipsis” icon to reveal actions that can be done to the song. This “ellipsis” icon can be seen throughout other elements of our apps, such as playlists, to reveal the same thing. Keeping this intuition consistent throughout the app is important as both a design heuristic and as we saw our interviewees encounter trouble when there is lack of consistency. Another effort of making the process as intuitive as possible is by providing the user with the option to remove by sliding from right to left on a song to reveal the remove button. This action counts as intuitive because it is widely used within popular mobile operating systems (like iOS). This second option provides an even faster and more efficient way to remove a song from a playlist.

Other Rooms of Improvements: Places We Couldn’t Reach

We fully realize that due to the small number of interviews we conducted and the limited competitor analysis, we have a lot of room for further improvements for our own app, as well as further research for our user needs. One of our top ideas for improvements that we didn’t have time to show was a new way of adding tracks to a playlist. In all 3 apps we looked at, there wasn’t a quick way to add a large number of songs into a playlist. We wanted to introduce a playlist “edit mode” where you can navigate through the entire app and tap/check on a song or album to instantly add them to a playlist that is being edited. To successfully implement this feature, we realize that we need to display the distinction between the “normal” and “edit playlist” mode really well. An idea we had to display “edit mode” is to change the colors of the entire app to be a different shade of gray and have a top banner indicating the current mode (Sketch below). To indicate whether a song was added to the playlist you were editing, we wanted to use a checkmark in place of where the “ellipsis” icons would be.

Like what you read? Give brandon hwang a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.