Closing SoundCloud's mobile search gap to improve discovery for core listeners.

Core listeners, like music enthusiasts, DJs, and music producers rely on SoundCloud to find music.
Unlike the web experience, mobile search offers no filtering capabilities for discovery, leaving its most engaged users with a fundamentally broken discovery tool.
My goal was to bring SoundCloud’s web filtering capabilities to mobile, giving core listeners the ability to search with the same specificity they already had on desktop.
My Role
User Research
UX Design
UI Design
Prototype Developer
Deliverables
Heuristic Audit
User Interviews
Low-Fidelity Frames
Live Prototype
Tool Stack
FigJam
Figma
ChatGPT
Claude
VS Code
GitHub
Vercel
Before I designed anything, I needed to understand where mobile was falling short and why core listeners weren't pushing back.
The audit confirmed that mobile had zero filtering capabilities while web offered relevance, time, length, and tags to specify search.
To understand how that gap was affecting real users, I talked to core listeners about how they actually search.

"I usually find music when I search through 'related tracks' of a song I like"

Isabelle, 28 years old

"I typically sort the search by newness and relevance to my search"

Martin, 32 years old
But on mobile, none of that was possible.
So instead of discovering new music, they defaulted to related tracks and saved playlists. The SoundCloud mobile app had become a music player that hindered discovery.
Filtering was the obvious starting point because it addressed the core problem directly.
Users already understood filtering from SoundCloud's web product, however, my audit and research surfaced two other directions worth naming.
Ideas I had to table for now:
Search Through Tagging
Tags on SoundCloud are artist-assigned, whcih means they can be inconsistent, sometimes absent, and not always an accurate reflection of a track's actual vibe. Building on unreliable metadata would have just moved the friction, not removed it.
Search through Beats Per Minute
This feature doesn't exist in SoundCloud's current infrastructure and this this solution would need the right technical foundation. I simply didn't find this to be a problem I could solve in this project.
Both ideas are worth revisiting. But neither was the right place to start.
My ideation phase began with research.
Reddit became my primary reference because their mobile search is built for discovery at scale across complex, user-generated content. That's exactly what SoundCloud needed and didn't have.
I started with low-fidelity frames, testing out solutions for our interface design.
I knew that I wanted to begin with drop-down menus to filter by 5 different categories. However, a dropdown quickly felt overwhelming because SoundCloud’s product cards, and a list of filters created too much competing interaction. So, to focus on the filter flow, I designed a modal overlay that guides the user into a filter decision.
From there, I prepared high-fidelity wireframes that could push to Claude Code.
To make sure Claude could interpret my designs accurately, I built everything with Figma's auto-layout and component practices — designing with structure so the handoff would translate cleanly. Claude Code generated the component files and styles, which I copy-pasted into VS Code and refined from there.
Then, I developed the prototype in React and Vite to test whether the interactions actually held up.
In VS Code, I prompted the generator to address that the flow was missing confirmation state to indicate that a filter was selected. Following Don Norman’s feedback principle, I introduced an active state that colors the filter button to match the selection. This small change gave users clarity and confidence that their search had changed.
Reddit
Soundcloud
Testing also surfaced unnecessary label copy that Claude Code had introduced, such as “Filter: Relevant” instead of simply “Relevant.” Users already understand filter patterns from the products they use every day so I stripped the UI back to reduce noise and improve scannability. This served to be a good reminder that AI output isn’t the final solution and designer judgment will always be needed.
Finally, I was able to deploy my live prototype that showcased my new search flow.
View Live Prototype
Giving core listeners the ability to filter changes how they use the app.
By implementing this change, SoundCloud shifts from a passive player back to an active tool. This can shift to real product opportunities for SoundCloud. Tiered subscriptions could include these features for serious listeners. This feature also empowers SoundCloud artists,by making them more discoverable.
This project pushed me into territory I hadn’t fully explored before.
 I moved beyond static prototypes and built a working product experience. I learned to vibe code, sharpened my component thinking, and designed interactions that had to hold up in real use. Research became the foundation for every decision, from filter structure to feedback states to interaction patterns.
Back to the top
Next Case Study

let’s build
something great

contactresumeLinkedIn logo icon with white 'in' letters inside a black circle.