Soundcloud iOS

Disclaimer: This project was originally designed in 2017 but the prototyped portion using Framer X was done mid-2019.

Who Worked On This

Myself 

What I Worked On

Interaction Design 
Visual Design 
Information Hierarchy 
User & Market Research

Why I Built This 

I really liked using Soundcloud but the app was failing to deliver and I wanted to change that.

Tools Used

Sketch
Framer X 

Deliverables 

A prototype of a new Soundcloud iOS app with features better aligned to user needs

Constraints 

No budget, no Soundcloud user data, small user base

◆    ◆    ◆

Introduction

I signed up for Soundcloud in 2011, when having a Yahoo email was still socially acceptable, and was an avid user for about 5 years. Those were the days when you could download songs off SoundCloud and upload them to your cute little MP3 players. As much as I love SoundCloud, I, like everyone else, have moved to Spotify (or Apple Music) simply because it’s a better product.

In 2017, Soundcloud laid off 40% (173) employees  to save itself from going under which clearly shows what all Soundcloud users have been thinking: this product is sucking.

But recently I started missing going through Soundcloud to find the newest songs and artists. There’s a really satisfying and exciting about finding undiscovered artist and their work. And so I decided to try and reimagine what a better Soundcloud iOS app would look like.

Purpose

While I wanted to try and make a better version of Soundcloud, the main focus for this project is two-fold: 

1. To learn & practice visual design
2. To learn & practice prototyping, specifically by testing Framer X. 

State of Affairs

Since I haven’t actively used Soundcloud in the past few years, I wanted to get any understanding of the following three things:

  • How Soundcloud fit into the industry
  • The app’s current design system
  • What current users thought about the product

I. How Soundcloud Fits into the Music Industry

Digging through some articles and Youtube videos , I found that Soundcloud really acts as a distributor of music. It is the platform that is closest to consumers where users can download and/or buy the artists’ music. While understanding where Soundcloud fits within the ecosystem, I also learned about the business side of thing beyond its business model: 

1.    Soundcloud is the one responsible for paying licensing fees to record labels for the songs that are sampled on their platform and not the artist that uses it. 

2.    Music streaming generates really little revenue and the majority of that goes to the label not the artist. The biggest moneymaker for both players are concerts and merchandise.

II. Deconstructing the iOS App 

I wanted to get a sense of their design system and so I reverse-engineered the app into wireframes and broke them down into components. This gave me an understanding of what elements were part of the app and what was inconsistent. A few things that I learned from this:

1.    There are a bunch of varying card types for displaying music (songs, playlist, albums). However, none of the sizes or elements are consistent

2.    The colors for the CTAs are inconsistent

3.    Song play interactions are inconsistent. If you hit a track image of the same size it will either take you to a playlist or start the song. A larger track image in the Stream looks more like a playlist cover but actually plays a song. 


III. What are users complaining about? 

Defining a user is hard in this situation because there are multiple people involved and limited data I could use for each. In theory, you have your average consumer, the artist, a manager who might be in charge of multiple artists, podcast producers, and power users that aggregate and repost songs. For the purposes of this design I chose to only focus on the needs of the average consumer, mostly because I have the most access to this group.

To keep this short, I talked to 2 of my friends who still use Soundcloud and looked through a lot of comments on Reddit. Obviously the latter needs to be taken with a grain of salt but it still does provide directional information.

1.    People really want a dark theme. There’s literally 6 different threads on Reddit about it

2.    The main value add for users is discovering new artists & music. However, finding new & active artist is hard especially after they removed Groups in 2016. As a result users have to parse through multiple playlists in order to find songs they might like. However this isn’t a good solution because the playlist that Soundcloud displays isn’t updated.

3.    Users have mixed feelings about the ability to comment. On one hand its nice to see other people’s thoughts on a song but spambots are a rampant problem.

Forming a Hypothesis

This research shows there’s a disconnect between the product offering and what users actually want. Offering the convenience of downloading one’s playlist and not having ads is a great first step towards a better product but it’s not a clear differentiator. In fact, I think it’s the ticket you pay to enter the game. Soundcloud needs to better align its product with their users’ wants and needs if they want to even compete with Spotify or AppleMusic.


SoundCloud’s embrace of the major labels had another important side effect: it discouraged the remix culture that had originally helped the site thrive.

--The Verge


Soundcloud has always been a community of diehard music fans. It was a way to find the newest sounds and artists before they became mainstream.If you look at all of the popular DJs and rappers today – from Odeza and Flume to XXXTension(RIP) and Cardi B – a lot of them started on Soundcloud. While some may see this as a small market that artists eventually leave I think this is Soundcloud’s secret weapon. In fact, Soundcloud is actually positioned to do for music what YouTube did for video creators.

Being the birthplace of great music and artist is something very unique to Soundcloud and it’s something that they need to leverage. Users are already craving this and I believe that by doubling down on this value proposition and its users, they can build a far better business. 

Solution

One of the most powerful aspects of the Soundcloud community is around finding and sharing music. From talking to my friends and user generated content, avid users are dedicated when it comes to discovering new songs.They spend the majority of their time going through playlists (and what used to be groups) to find a few bangers as they’d like to call it.

By connecting this existing behavior with a reward system I believe Soundcloud can continue to engage their users and strengthen its existing community. 


I.  Leveraging & Rewarding Users For Music Consumption

As users listen to new music and find songs they think are really good, they can hit this fire button. This creates points for both the track and the user who hit the button. Users who found the song earlier than other and hit the button will get a multiplier so that as the song gains traction, their points are worth more. This allows them to claim that they “found” the song first and receive titles for being a power user. 

This allows Soundcloud to generate a robust user analytics dataset in relation to each individual song. While they can determine some of the analytics now, they can use this to determine futuristic trends before anyone else. Imagine being able to say, with a high accuracy, that Cardi B or Alesso will be the next big artist before anyone else. 

II. Sound ID

While other platforms aim to produce the same quality/content – i.e., mainstream music, Soundcloud is positioned to create something as unique as each of track on its platform. In order to represent that, I wanted to create something that was just as unique. 

The SoundID is a unique identifier created for each song based on its frequency. The Sound ID around an artist’s profile is an average of their music. Just as DNA is unique to each human being, SoundID will be what artist refer to when they say this is my sound.

While building this, I was worried about two things that could possible break this SoundID idea:

1. Repetition 

In a situation where there are so many songs & artists, is there a possibility that the ID would have the same one as another user? To work around this, I used the combination formula nCr with a Sound ID. With a SoundID at 60px length this gives us 16,777,216 C 60 or 3.0422419887e+433. With so many possible combinations, the chances of a recurring ID is extremely slim, in theory at least. 

2.  Scale 

Another scenario that came to mind was how would this scale both visually and mathematically? Assuming that users will want to place this avatar outside the app or with changes in browser size, The length of the SoundID actually changes. This would displace the hex codes, causing the entire system to break. In order to work around that, I decided that rather than using the length of the whole SoundID, it'd be smarter to render the HEX colors for the first 10 pixels at 90 degree intervals. 

This gives us 4 points around the circle to capture data, creating 16,777,216 C 40 or about 9.7453140113e+288 combinations. This enables us to maintain a unique identification system without breaking it as things scale. 

While this is more for branding purposes, I think this could always evolve into a product feature. When you think about products like Shazam, it’s nearly impossible to find non-mainstream songs. This could be another avenue for Soundcloud to monetize and build an ecosystem around itself. 


III. Creating uniformity

The first thing I created were uniform components. A song, playlist, and station each has their own unique card. CTAs all have two options: grey or orange. Interactions bring you to specific places. 

Using Format