I led the development and design of enabling content uploads from mobile for SoundCloud to address the increasing use of mobile devices among creators. it involved extensive user research, identifying key user needs such as track uploads, data consumption warnings, and basic editing capabilities. We explored different design concepts for the upload button placement, ultimately choosing the home page for visibility. Post-launch, mobile uploads accounted for 22%+ of total uploads on SoundCloud, with positive feedback from our customers.
it is an online audio & streaming platform based in Berlin. one of the most recognized names in the music industry. And as we say... What's next in music is first on SoundCloud. it's currently a subscription business model. selling subscription plans for consumers & audio creators. while now it's looking into changing towards creator & fan economy to be more community-based.
Creators mainly used the web app as it’s the most complete platform from a feature set perspective. in 2019 the number of uploaded tracks on the web app was stale & we wanted to drive up these numbers. we observed a shrink in the desktop market. Mobile & tablets are becoming more productivity tools. The younger gen seems to rely much more on their phones.
As for supporting evidence, looking at previous recurring audience research reports:
Process overview
During the understanding phase. I create an Excel sheet to start breaking down research questions, problems, user stories, etc...
that sheet includes:
Info
Excel sheet, early in the understanding phase
Problem, business objective, & hypothesis
To understand how we can port upload which exists on the web. I worked closely with our UX research team to form a discovery research plan.
Research methodology, goals, & high-level findings
Recruit creators from different levels and segments,
with the following goals in mind:
Below is the upload experience on the web at the time of testing. it can be a lot to take in, with so many fields and tabs.
Upload on desktop web
Research helped us identify the following goals:
As a creator, I want to:
Now let me walk you through some of these needs and how it was reflected in the experience.
We used the native system's file manager. on iOS and Android, as it has the best experience to access your device files as well as files from services like Dropbox or google drive.
User need 1: use the native system's file manager
Since it's an upload it might happen on a mobile network and wanted to be conscious about mobile data consumption, so we added a warning to let creators decide to continue or cancel
User need 2: file size alert
Allow basic editing like title, artwork, genre, etc... and the privacy toggle. Add a delete button for track deletion.
User need 3 & 4: editing & deletion
Even though it wasn't part of the first MVP, as a north star we were considering an upsell state, how to celebrate reaching 3 hours of free upload time and how to communicate it.
User need 5: upsell
Milestones
To prioritize how to approach building mobile upload we can see that upload tracks have a higher impact but are less feasible. However, the engineering team was clear that upload as a function is dependent on track editing, so we went with basic editing then followed by upload and each had its own added user value.
Below is the entire flow zoomed out but let's focus on the main touch points.
Edit tracks overall flow and UI
Below are the main touch points. These are screenshots from the iOS and not from Sketch which we were using back then. if I want to edit my own track,
Main touch points
And here it is in action...
Final result after building
I collaborated with my teammates to draw the below flowchart to help us understand how the flow works. How to handle error states and issues that might occur during an upload process.
Flowchart
Then it became even more helpful when it was paired with actual UI to communicate this flow as shown below.
UI + flowchart
Now let's talk about the placement of the upload button. How might we maximize uploads, and make it clear where and how to start the flow?
In other similar apps and businesses that have both creators and consumers, the create button button is always in a prime position. Instagram, TikTok, Vimeo, and Medium all have it on the bottom nav bar. While YouTube has it on the top right.
Competition
The following are some ideas on how we can place the upload button:
Thought having it in the navbar is a good idea but the number of tabs changes based on user type. can be 6 tabs for free users and 5 for premium users It would only be in the center for premium users, so we didn't go with that solution.
Concept 1: In the Tabbar?
Maybe in the library tab which is one of the top-level navigation items? it wouldn't be visible when the app starts as it's not on the home page and didn't align with our goals.
Concept 2: In the library tab?
Maybe within the profile page? Actually, that made a lot of sense but finding your own profile isn't as easy because we have some information architecture problems and as a result, it's hard to find, so also didn't go with that one
Concept 3: Within the profile page?
The one that made the most sense was on the home page. It will be visible once the app is opened and has a clear prime position that aligns with our goals. so we decided to go with this one
Concept 4: on the homepage!
Other ideas,
For the sake of further ideating with the team, we imagined a version where a create button can exist and host other actions like uploading a track, creating a playlist, or any other actions we might add in the future.
Further ideating
so the overall flow now is, Tap the upload button on the top right. and get the system's file manager. then they can pick an audio file and start the upload process.
Upload flow 1
while their file is being uploaded, they can go ahead and add their artwork, title, genre, and description and set their privacy settings. then hit save.
Upload flow 2
And here it is in action...
Upload flow
Similar to the previous study we recruited creators who are either not on SoundCloud or had a recent upload on SoundCloud for un-moderated sessions.
Our goals were to:
Validate
The high-level findings are:
Mobile uploads highlighted in the red circle added Around 150k weekly uploads on iOS and around 110k weekly uploads on Android. That's up to 22% of uploads on SoundCloud coming from mobile. It's a big number and the feature is still going strong.
Stats
Going back to some of our audience research surveys done after releasing:
And that seemed like a positive sentiment from creators!
We wanted to do more and I've explored concepts beyond that initial version as I believed we should continue refining that experience. Things like:
However, teams changed somehow and the ownership of the upload experience was moved to another team. There was no further iteration on the feature which still saddens me because it had so much more potential.
I was hesitant it would work as I didn't believe anyone would upload from their phone but I was proven wrong & that’s an assurance that we designers aren’t our users.
Everybody participated in this project... Inclusivity & collaboration are key to any project's success. Because of that, I earned a lot of trust from my teammates and my manager as I was relatively new to the company.