The primary problem we were looking to solve for was Spotify’s lack of a social feature within the app. Previous attempts at a social feature had been unsuccessful with poor utilization. Our goal was to find a solution that would not only support but also improve the experience of interacting socially through the Spotify app.
To solve this problem I would look to create a new feature within the Spotify app that would allow for improved social interaction. I would focus on seamlessly integrating the new feature within the already existing features for a surprising and delightful experience.
UX designer, UX researcher, and visual designer. I worked independently with feedback collected from peers and my mentor.
Adobe Xd, Useberry
View tasks being completed within the Spotify prototype.
*This is a speculative project. I am not affiliated with Spotify.
I decided on a Design Thinking process for this project. Design Thinking breaks down the process into five distinct phases.
Empathize – During the empathize phase I focused on understanding the user through observation, and engagement.
Define –As part of the define phase I was able to synthesize the findings from my research into needs and insights that supported the changes that needed to happen as part of the project.
Ideate – Exploration during the ideate phase allowed me to generate ideas for potential solutions to the problem.
Prototype – Creating during prototype phase was an opportunity to build working examples of ideas that could be put in front of users for further development.
Test – The testing phase allowed me to further refine and improve upon the solutions developed during the previous phases.
From my research into Spotify’s user base, I learned:
• 56% of Spotify users are male
• 29% of listeners fall into the 25-34 year old range
• 26% fall into the 18-24 year old range
• Spotify reaches almost half of the 16-24 year old’s in the US each week
• Spotify is the preferred music streaming service among 18-29 year olds
• 26% of global users are in North America, making it second only to the European market which comes in at 35%
I needed to find out which elements of social sharing are important to those users.
• Why do they decide to interact with those features?
• What workarounds are they employing to share music currently?
• What are the frustrations associated with the act of sharing music?
Any features added to the Spotify app need to integrate seamlessly with the current user interface. This project would not be focused on re-design in any way. So at each stage, I was mindful that any solution would need to fall within these parameters.
A competitive analysis was used to identify the strengths and weaknesses of Spotify’s competitors. I first identified direct competitor, Apple Music, and indirect competitor, iHeartRADIO, and reviewed their offerings to establish the strengths and weaknesses of each.
Based on the details from my market research, I was able to create provisional personas and identify the group of users to reach out to for user testing.
Current State of Usability
At this point I also wanted to understand the current usability of the app. By referencing Jakob’s 10 Usability heuristics, I interacted with the app to replicate possible user interactions and completed a heuristic evaluation of the Spotify mobile app.
Overall Spotify did a good job of showing the visibility of the system status and matching between system and the real world, but missed a bit with their execution of user control and freedom. I found myself unable to undo an action of removing a song from a playlist. Overall the site was minimal and consistent in its aesthetic, but could use some improvement in other areas. For example, being able to recognize elements rather than having to recall, as well as providing help documentation.
User interviews were conducted to gain additional insight into user needs. I scheduled Zoom sessions and asked open-ended questions about sharing content.
I documented notes from my research findings and kept the findings from my market research and competitive analysis in mind as I began the process of analyzing the interview responses. This aided me in being able to identify patterns within the responses.
To further synthesize the insights and observations from the user interviews, I created an empathy map by taking the documented observations from the user interviews and categorizing them to identify needs.
I took the insights from the empathy map and created a user persona for Spotify. I was able to establish the motivation, frustrations, goals, and needs of the Spotify user based on those insights.
Michelle - 29 years old, Female
"Whether I'm looking for motivation for a hard workout or listening to a podcast on my way into work, I never want to be without something to listen to."
• Creating a shared experience
• Finding focus for difficult tasks
• Finding enjoyment in a long wait
• Recommendations for new music
• Ability to share links to content
• Playlists for uninterrupted listening
The insights and needs that were revealed during this exercise were then documented as Point of View statements and How Might We questions to identify actionable problems to solve for.
The next step for me was to focus on the How Might We questions and conducting a couple of rounds of individual mind-mapping style brainstorming to identify possible approaches to solve user needs.
• How might we clearly display methods for Michelle to interact with multiple platforms?
• How might we give Michelle easy access to users with common interests?
• How might we make it easier for Michelle to discuss content that is shared?
The key takeaways from my individual brainstorming focused on a mix of methods for notification and communication, along with message boards and chat. These ideas were repeated between sessions as well as between HMW questions.
It was at that point that I decided to conduct a group brainstorming session to generate additional ideas and approaches for solving the user problems. I held a session focused on exploring solutions and responding to the How Might We questions that I’d developed.
From the group brainstorming I discovered a strong focus on activity, and attention being paid toward celebrity status on the site. I had not considered this before and was very interested to see it come up a couple of times during the various rounds. We did find that there was quite a bit of overlap when it came to suggestions being made for one HMW question, that also served another.
Business & User Goals
To establish the goals of the business as well as the user, I referenced the project brief, the user persona, and my research and found areas where they overlapped to further focus the approach toward a solution.
With a list of potential social features now in hand, I created a product roadmap that referenced the business and user goals that had just been identified, and then took into account the estimated effort and complexity, as well as the impact to determine the priority for implementing the various features.
Now that I’d identified the highest priorities for features, I created a sitemap that would allow me to determine how the new social features would integrate into the already established pattern of navigation, sections, and sub screens on the Spotify app.
I then wanted to visualize a straight path for completing a task within the app. Using the sitemap as a reference I created a task flow complete with the screens and actions taken.
Michelle is finding a friend based on common interests.
Michelle is leaving a comment on an artist message board.
That was further developed into a full user flow with decision points. This breakdown allowed me to start thinking about how the user would be interacting with the prototype based on the expected actions.
Michelle's favorite artist just released a new album. She's excited to talk about it, but none of her friends are really into it.
Task 1: Michelle wants to find other Spotify users in her feed that are as excited as she is about the new album.
Task 2: Michelle wants to show her favorite artist some love by leaving some kind words on her message board.
I then determined what elements would be needed to successfully navigate the task flow and user flows and created my list of the UI requirements.
Low Fidelity Wireframe Sketches
To begin defining the structure of the app updates, I made low-fidelity wireframe sketches. I referenced the list of identified pages to design, and focused on elements necessary for testing of the prototype. Restricting this stage to sketching allowed for quick iteration and review of ideas before deciding on a version to implement into the first prototype.
The creation of a mood board, style tile, and UI Kit proved to be a pretty straight-forward exercise. The goal merely to define the already established styling expectations based on Spotify’s brand standards.
High Fidelity Wireframes & Prototype
To have the pages I needed for the high-fidelity prototype, I referenced screenshots of the current Spotify app to recreate pages that could be further updated to create my high-fidelity wireframes.
These same high-fidelity wireframes were then wired up to create my prototype that I could use to begin user testing of the app.
I created a plan for my usability testing by taking the identified objectives, subject, method, participants, recruiting, script, scenario and tasks along with the goals, assumptions, and test and error-free rate estimations to layout the interaction with users that would be participating in my usability testing.
With my plan in hand, I conducted unmoderated remote user testing with Useberry. The testing would allow me to collect observations related to the usability of the Spotify prototype and new features.
I reviewed the results from the user testing and compiled them into categories using an affinity map. I was then able to take the categories and turn them into insights and recommendations.
I discovered that users were focusing in a few common areas.
Insight - Users expect to find social features on the Home screen
Recommendation - Make social features available on the Home screen
Insight - Users expet to see artist feeds as soon as they access the Music screen in Your Library
Recommendation - Make the artist feeds available immediately on the Music screen
Insight - Users feel the Social tab under settings should allow for access to social linking
Recommendation - Make social linking available in the Social tab under settings.
For my final prototype, I implemented the changes that were identified during testing and as part of the affinity map exercise.
I added interaction points on the home screen to address the concern with not being able to immediately access the features.
Users can now go directly to the artist screen to add and view comments. They’ll also see a list of other fans so they can begin to develop friendships with other Spotify users outside of their current friend group. This will encourage a sense of community within the app and encourage additional interaction.
I simplified the menu options, completely removing the newly added Social tab. Testing taught us that it was confusing users who found the Social tab under Settings and expected they were the same thing. Now users can interact with elements they are already familiar with, but see additional details that will allow them to interact socially with both the artist, as well as other fans.
I consolidated user preference customizations on the View User Profile screen to keep users from having to navigate to another page for the same interaction, as well as to align the protype with the initial goals of not changing the current user interface. Users that are already familiar with the visibility that exists for playlists on their profile screen will be delighted to see that they can now manage the artists and songs that follow, as well as find opportunities to enable linking with other social apps to increase interaction.
With revisions to the high-fidelity wireframes, updates were then made to the linking of elements within the final prototype, available here for you to interact with.
The decision was made to move forward with recommended changes and ultimately resulted in minimizing the extent of the changes being made. Elements that had been added were refocused on integrating with those that already existed. I wanted to take the results of the testing, and not get hung up on the expectations or assumptions that contributed to the new feature creation in the first place.
In this scenario I needed to take a step back and re-evaluate previous decisions to ensure that the final result would be an additional feature that is both intuitive and improves the experience for users. Users struggled to complete tasks and that taught me an important lesson. Users will have expectations beyond anything we find in our research. While it gives us a good start, it's ultimately the user who will decide what the end result should be.
The final deliverable will provide users with increased visibility into the community of listeners that follow the same or similar artists. Users will have the opportunity to share their comments about artists and in doing so, open opportunities to develop new relationships based on common interests. This improved and increased interaction will also result in furthering the effort of increased engagement and retention in the app.
At this stage the project will benefit from future testing and review of the feature roadmap to determine the best next steps for continued growth in the area of social interaction on the Spotify app.