Spotify Social
"Why is it so hard to find my friends on Spotify?"
After hearing and asking this question many times, I decided to create a design that addresses the lack of social features on Spotify. The service has changed the music industry and makes it very difficult to find friends and see what others are listening to.
Role
UX Designer
What I did
User research, information architecture, design iterations, and usability testing
Result
Figma prototype with social media attributes and specific considerations for secuirity and visibility
“Why is it so hard to find my friends on Spotify?”
Introduction
Spotify revolutionized the way we listen to, discover, and share music. However, finding what your friends are listening to on the service is hidden deep within the design. Some users complain how difficult it is to find a friend’s account, and further still, see what they are listening to. This design project seeks to implement social features within the app to a greater extent. Additionally, we discuss the Spotify Users’ mental mode of the service, and how new features can be added to fit within that model.
This design seeks to address all current users of Spotify, but, as with any feature, the first users will be early adopters, younger, and heavy Spotify users. Testing reflects that, and though this limits the scope of the design it is not a detractor; it is simply worth noting.
User Journey
Context
Testing revealed that Spotify Users understand the app through the preceding mental map. Songs are the foundational building block, wherein most action-based thought is found. Higher elements like tabs and albums are more correlated with navigation. So, Spotify exists to funnel users to songs, pretty obvious right? Regardless, this is valuable knowledge as it allows us to see how Spotify Social can fit within the existing user journey.
The new design includes a Social tab, wherein users view Friend Activity to, you guessed it, find more songs. On the Homescreen tab, users find another instance of Friend Activity so they can see what friends are listening to right as they open the app.
Information Architecture
An information architecture was created with the help of an open card sort completed by users.
Key takeaways
-
Words used commonly in other tabs should be avoided in the new Social tab.
-
“My” is used in Library a lot: My Playlists, My Artists, etc. Avoid using “my” as much as possible.
-
-
Users correlate things by ownership. Contrasting elements by their ownership could help users understand the difference between elements.
-
My Playlist vs. Friend’s Playlist
-
-
Friend Activity was connected with discovery elements; users see Friend Activity as a new avenue for discovering new music.
High-Fidelity Prototype
Figma High-Fidelity Prototype
Social Home Screen
The all-new Social screen connects the user to new features. It gives users access to their current connection list, friend listening activity, and settings for privacy and profile editing. Social is where users go when they want to see what their friends are spinning.
Friend Listening Screen
This screen shares a lot with the current album screen but includes some key differences. The screen’s purpose is to communicate to users the album name, the artist's name, and who is listening. From this screen, users can add music to their library and view the listener’s profile.
Spotify Social Opt-in Screen
Some users will not be interested in Social features, while others will only want to be involved minimally. The opt-in process allows users to choose if they will participate in Spotify Social, what will be visible to others, and who can see their information.
User Testing
Spotify Testing Results
Usability Testing
Why usability testing? Most of my concerns about the design were whether the user can understand what is possible and can make informed decisions on whether to participate. The user test, with some debriefing questions, demonstrated what users understood, why they took certain actions, and clearly communicates any changes that need to occur.
The Tasks
-
Explore the updated app.
-
You are a Spotify user. One day, you open the app and notice things are different.
-
-
Explore what is new with the app. (Stop after opt-in/out).
-
(User is on Social screen, no specific tasks).
-
-
Social home screen tour.
-
You are a Spotify Social user. Your friend says they also joined, you want to find your friend on the app and follow them.
-
-
Follow a friend on Spotify Social.
-
You are a Spotify Social user. Your friend says they also joined, and you want to find your friend on the app and follow them.
-
-
Send your friend a song.
-
You find a song your friend would love, so you send it to them.
-
-
See what your friend is listening to. (See if they notice adding music from here).
-
You follow a new friend on Spotify Social and would like to see what they are listening to today.
-
-
Opt back out/stop sharing information with Spotify.
-
After a few weeks of being active on Spotify Social, you don’t want to be part of the service anymore. Find where you would opt back out of the service.
-
Users
My user testing group was composed of college students aged 19-21. All were very familiar with Spotify and had varying levels of tech savviness. Some were expressly interested in the product, while others were hesitant. This allowed me to glean a desire for greater customizability in the app.
Key Findings
-
The song is the foundational block of Spotify. Users tended to see the ‘song’ element as actionable, whereas other elements, ‘album’, ‘artist’, and ‘playlist’ are navigation based. This begs the question, where should the new elements, ‘friend’ and ‘listening to’ fit within this mental model?
-
Privacy needs to be clear for those who want it and ignorable for those who don’t care. Spotify Social needs to remain within Spotfy's design but separate itself from the home screen as a different feature. It appeared that this was accomplished, this is just something to keep in mind as I move forward.
-
Notifications' current location may be throwing off the user's mental hierarchy. Because it is in the Social section, users expect it to only correlate to friends, but it also includes artist releases and activity. This needs more testing to determine how notifications should behave and where they should be located. Amazon Music does notifications well, need to check that out.
-
Some users did not want to see featured listeners. It is worth considering allowing users to control what activity they see.
-
Users still wanted to communicate through text. While I had envisioned some sort of messaging service, may this is not worthwhile. I could build a feature where users 'send' music to others in the app, which appears in the recipient's notifications, but no two-way communication.
Minor Key Findings
● Opt-in was a struggle in both directions. Some users thought it was too clunky, others didn't have enough information to understand what was going on
● Featured listeners and listening page headings are off. Need to reflect the link to them.
● Emphasize the difference between the normal album page and the Listening to page.
● Contacts integration to add Friends
● It might be worthwhile to allow users to control what listening activity they can see.
● Interaction to add friends from the My Friends section is needed.
● Need the "three dots" on song pages so users can send music from the song.
● Add TikTok integration
● Options for sharing profiles and songs thru text
● Settings need to be accessible from the Social tab.
Accessibility Considerations
Style Guide
Font: Arial
Color:
Background Foreground Accent
Inclusivity
How does the redesign apply to design ethics, my own design philosophy, and inclusivity?
Design Ethics
-
Real Value: Digital Minimalism, the practice of explicitly selecting one's relationship with digital products, includes the following principle, “Intentionality is satisfying” (Newport 36). Spotify Social attempts to fulfill this principle. It allows users to choose to be part of the service, and in what capacity they interact with the app. Notably absent are follower counts, likes, and messaging. Spotify Social is about sharing music and nothing more, its design allows users to be intentional about how they view the service.
-
Safety for users: Users' data is protected through a few measures: transparency, controllability of what is shared, and opt-in/out availability at any time. This ensures users' data stays safe.
Philosophy
A design philosophy is described as the who, what, where, when, why, and how of a design plan. It requires asking things like, “Why do we want to create it?” and “How will it make our users’ lives better?” (Andrews).
So how does Spotify fit within my own Design Philosophy?
-
Empathy: Real caring for the user’s problem. In user testing, several attendees mentioned the difficulty in finding other users in Spotify’s current design. This design is solving a real problem that frustrates people.
-
Mindset: My approach to this project has been bilateral. On one hand, we are currently discovering how harmful social media can be to human health, and on the other, this design makes Spotify more like a social media service. This could be troubling to my mindset, that design should be healthy and add value to users’ lives. However, the design is centralized around adding value while still remaining healthy, and likewise, it corroborates my mindset.
Inclusivity
Matt May compares inclusivity in design to climbing a mountain, “Inclusive design is the practice of going up the mountain — we can always look for ways to include more people and situations to our designs, even if the result only gets us a few steps up the trail at a time” (May). Spotify Social has areas it does well in this regard, and areas ripe for improvement.
Where Spotify Social is Inclusive
-
Any users who do not want to participate in Social are not punished in any way. The app still functions normally for them.
-
The design attempts to use simple language and familiar design to allow users to understand quickly and immediately
Where Spotify Social is Exclusive
“Design justice asks whether the affordances of a designed object or system disproportionally reduce opportunities for already oppressed groups of people while enhancing the life opportunities of dominant groups, independently of whether designers intend this outcome” (Costanza-Chock). Design injustice flourishes in the dark, and so I must analyze how Spotify Social falls down in this regard.
-
A situation that has repeatedly haunted me is that wherein Spotify Social is used to bully those of lower social standing. Users could see what others are listening to and make fun of them for it, or belittle their music tastes. Part of me is hopeful that the service could dissuade shame and bullying by showing how diverse music is, but another is aware of how cruel some can be. While opting out is always an option, it is very possible that people could be truly hurt as a result of Spotify Social.
-
Older/vision impaired users. Including scalability and voice-to-text was always a goal of the project, but it was simply outside of the scope of this iteration. The next steps are to include these users.
-
Non-Spotify users. The design largely communicates to current Spotify users, so what about those unfamiliar with Spotify’s design? Pursuing these users would mean testing users unfamiliar with Spotify, and better yet, those unfamiliar with music streaming apps entirely.
Reflection
Open Questions
-
How will Friend Activity be sorted? Friends with common music will appear higher? Friends’ listening is sorted by Genre?
-
Is featured listening worthwhile? Do users want to actually see this?
-
Should users be able to select specifically what they want to share? For example, “As a user, I want album X to be visible to others, but not album Y.”
Overall Reflection
As we continue to discover the danger of social media, this project grows increasingly relevant. How do you balance the benefits of social media (greater connection, discovery) with the dangers (addiction, comparison, poor mental health)? Spotify Social seeks to answer this question. While long-term testing has not been done, the design at least sparks intrigue from users, and none expressed frustration at the missing social metrics (follower count, likes).
Additionally, Spotify Social offers genuine value to the user. Each user, without prompting, expressed a desire to use this design in their lives.
Key Learnings
-
Understanding mental models is a fantastic method of empathizing with and designing for users.
-
Graphic designers often express the concept of Contrast, that is, if two elements are different, make them very different. Some users could not determine the difference between Friend Activity pages and their default counterparts. Efforts were made to make these screens very different.
Next steps
-
Better inclusivity options with larger buttons and greater understanding.
-
Push song feature; not messaging but you can send your friend a notification to listen to a song.
-
Flesh out how friend activity is displayed and sorted.
Works Cited
Andrews, W. (2018, June 27). How to Develop your Design Philosophy. Drawbackwards. Retrieved April 25, 2023, from https://www.drawbackwards.com/blog/how-to-develop-your-design-philosophy
Costanza-Chock, S. (2020). Design justice. MIT PRESS LTD.
May, M. (2018, February 4). The same, but different: Breaking down accessibility, universality, and inclusion in design. Adobe Blog. Retrieved April 25, 2023, from https://blog.adobe.com/en/publish/2018/04/02/different-breaking-accessibility-universality-inclusion-design
Newport, C. (2019). Chapter 2: Digital Minimalism. In Digital minimalism (pp. 28–58). book, Penguin Books Ltd.