Traxfeed is an innovative web app that aggregates the latest music from Spotify and Soundcloud into a real-time news feed. Users simply create a list of artists to follow on Traxfeed or they can import their Facebook data to receive all their favorite artist’s new music in one consolidated news feed.
Our challenge was to design and ship an app that makes finding music effortless, with the ultimate goal of becoming music lovers’ preferred source for new content from their favorite artists.
Understanding digital music consumers
When it comes to online music, there is certainly no shortage of content and services these days. We interviewed twenty fans and artists to understand how both music and music services shape their everyday lives. Three common themes emerged:
People feel a stronger connection with other people through music. This could mean sharing music with a close friend, meeting a new person through music, or sharing a music experience with someone on the other side of the world. Music helps people understand different viewpoints and form stronger connections with others.
People are willing to abandon “owning” their music in exchange for being able to access it anywhere. Ten years ago people owned most of their music, but today streaming services and mobile devices have given people instant access to millions of songs in the cloud. Convenience has become the new standard for all music services.
People’s music collections are scattered across several services and devices. This happens as a result of using multiple services for various needs e.g. Soundcloud for DJ mixes and Spotify for listening to albums. There is also too much “bloat” in people’s news feeds (sponsored ads and reposts) that makes it difficult to find the best new music. We decided to prioritize Displacement because we believe that creating an aggregated service might help alleviate this painpoint .
Two Personas were developed from our user research. We used these Personas to make informed decisions when designing our website.
Sam (Music Obsessed Hobbyist)
This Persona uses many services and touchpoints to listen to music throughout the day. He is an avid researcher that loves doing the “detective work” of finding new artists and genres. Sam is frustrated by the multitude of music services and the clunky interplay between services that he uses.
Peter (The Seasoned Professional)
This Persona is a professional DJ/producer who several hours per week curating his artist pages with content that is unique to each service. He used to view social media as an asset, but declining traction and increased “cost to play” have made it more of an obstacle than anything else. Peter loves sharing his new content with fans and he needs strong social engagement numbers in order to get booked for high paying DJ gigs.
From our interviews, we created two customer journey maps, illustrating each Persona’s touchpoints with music services in a typical day. This exercise helped give context to when, where, why & how different services are used throughout the day. Walking through the journey maps taught us that most people have two modes of listening: passive and exploratory.
Passive listening is intended for enhancing a routine task such as driving or exercising, and usually occurs on a mobile device. Exploratory listening is more active and intended for learning more about music. Examples include researching an artist on Wikipedia, searching for music on a blog, and downloading new music for a DJ gig. This type of listening is typically performed at home on a laptop or desktop.
We believe our opportunity with Traxfeed exists in the exploratory space, because aggregating multiple music services can provide more comprehensive information about artists.COMPETITIVE ANALYSIS
The online music space is competitive, so we analyzed the strengths and weaknesses of all the sites and apps that were mentioned in our interviews to understand how Traxfeed would need to differentiate from the crowd. We created a 2x2 grid to visually make this comparison, with collection (little to lots of music info) on the X-axis and immediacy (slow to instant updates) on the Y-axis.
Example: Wikipedia scores scores high on the X-axis for containing comprehensive information about an artist’s music, but scores low on the Y-axis for not providing instant updates.
We believe Traxfeed’s opportunity space is in the top right corner, because our news feed can provide real-time music updates and aggregated information about any artist. Traxfeed is both instant and comprehensive, which sets it apart from the rest of the online music services.
Designing a new kind of music serviceWIREFRAMING INSIGHTS
Several wireframes were sketched and tested to discover which news feed format made the most sense to users. The news feed with large images, visible track info, and a straight grid system (bottom right) met the large majority of user’s expectations for a music news feed.PROTOTYPING INSIGHTS
We transformed our winning wireframe design into mobile and desktop InVision prototypes and tested them with six first time users. Noticing the way users expected to tap and click on certain items helped us create some more intuitive features, especially on mobile.
1.) Mobile Track Pages
In our first mobile prototype (version 1), we used music icons to link the tracks to Spotify, Soundcloud & YouTube. Several users did not understand the purpose of the icons and instinctively clicked on the album image instead. Users also had difficulty clicking the icons because they were too small. These observations inspired us to make the album image click into a full page display with track info and links to the music services (version 3). The final version is easily the most thumb-friendly on mobile and allows the flexibility to add more features if necessary.
2.) Desktop Hover Icons
Observing users attempting to click on the album image helped improve usability on desktop. Instead of displaying small music icons under the artist’s name, we made larger music icons appear when a user hovers over the album image (try it).
3.) Artist Feeds
Another insight resulted from observing users trying to click on the artist’s name in the feed. The name did not link to anything yet, so we came up with the idea to bring the user to a feed of the artist’s latest tracks, creating an entirely new value for the service. Instead of just using Traxfeed to see all your new updates together in a feed, the service can also be used to access any artist’s entire catalogue by simply clicking or typing the artist’s name in the search bar.
Three main design principles were generated from our usability testing and conversations with users.
Give Before You Ask
In the first version of Traxfeed, users started the service with no artists in their feed; meaning they had to manually search and add each artist to their feed. This process felt awkward and confusing to people that weren’t familiar with the service. We needed a way to deliver relevant music to first time users, which made us realize that we could add a Facebook login option to access users’ Facebook data and create a feed of their ‘Liked’ artists. We are also currently working on Spotify and Soundcloud import features.
Focus On The Flow
Usability testing helped us discover new relationships between different elements. Observing users clicking on the artist’s name lead to the creation of an important new feature (Artist Pages), and was also a lesson to always be thinking about how different elements can connect to each other.
Know Your Core Value
Throughout the design process, we were tempted to add more features such as social profiles, playlists and related artist profiles. When considering new features to implement, we must ensure they add to Traxfeed’s core value, which is music aggregation. By keeping Traxfeed lean and focused on the user’s needs, we will deliver the greatest value.
Leave your email address and I will be in touch. No spam.