Resonate
Resonate
The Music Collaboration App
The Music Collaboration App
The Music Collaboration App
Year
2024
Company
Personal
Category
UI/UX Design
Product Duration
6-Weeks
Context
Music producers don't have a dedicated space to find collaborators. They used WhatsApp for sharing files, Instagram DMs for discovery, Google Drive for version management. These weren't built for creative work. The result is a fragmented, low-trust process where great collaborations fall apart before they begin.
Music producers don't have a dedicated space to find collaborators. They used WhatsApp for sharing files, Instagram DMs for discovery, Google Drive for version management. These weren't built for creative work. The result is a fragmented, low-trust process where great collaborations fall apart before they begin.
Why I built it
Resonate started as a question: what would a collaboration tool look like if it was designed around how musicians actually work, not how project management assumes they do?
I wanted to challenge myself to design for a community I care about, independent music creators, and solve a problem that had no obvious template to borrow from. Most creator tools are either too technical (DAWs, audio editors) or too generic (group chats, file sharing). There was a gap in the middle: a social, discovery-first product that respected the creative process. I also wanted to practice designing a complete product identity — not just screens, but a visual language that felt native to the culture it was built for.
Resonate started as a question: what would a collaboration tool look like if it was designed around how musicians actually work, not how project management assumes they do?
I wanted to challenge myself to design for a community I care about, independent music creators, and solve a problem that had no obvious template to borrow from. Most creator tools are either too technical (DAWs, audio editors) or too generic (group chats, file sharing). There was a gap in the middle: a social, discovery-first product that respected the creative process. I also wanted to practice designing a complete product identity — not just screens, but a visual language that felt native to the culture it was built for.
What I built
What I built
A mobile-first collaboration platform with four core flows:
Discover — A feed of creators filterable by genre, style, and vibe. Color-coded genre taxonomy for instant visual scanability, reducing the cognitive load of browsing.
Profile — Each creator has a profile built for quick signal — their genre, past tracks, and collaboration history. Designed so you can decide within seconds whether someone is worth reaching out to.
Collaborate — A shared workspace where creators can upload WIPs, leave feedback anchored to specific track timestamps, and communicate via voice memos. The timestamp-anchored feedback came directly from how producers actually talk about music — "fix the drop at 1:32," not "the middle section feels off."
Create — A lightweight track management system with version labeling, so collaborators always know which file is current.
The visual system runs on a dark canvas with a pink accent — chosen to reduce eye fatigue in late-night sessions while signaling creative energy. The design system was built component-first, with reusable card, player, and feedback modules to support scalable handoff.
A mobile-first collaboration platform with four core flows:
Discover — A feed of creators filterable by genre, style, and vibe. Color-coded genre taxonomy for instant visual scanability, reducing the cognitive load of browsing.
Profile — Each creator has a profile built for quick signal — their genre, past tracks, and collaboration history. Designed so you can decide within seconds whether someone is worth reaching out to.
Collaborate — A shared workspace where creators can upload WIPs, leave feedback anchored to specific track timestamps, and communicate via voice memos. The timestamp-anchored feedback came directly from how producers actually talk about music — "fix the drop at 1:32," not "the middle section feels off."
Create — A lightweight track management system with version labeling, so collaborators always know which file is current.
The visual system runs on a dark canvas with a pink accent — chosen to reduce eye fatigue in late-night sessions while signaling creative energy. The design system was built component-first, with reusable card, player, and feedback modules to support scalable handoff.
What I iterated
What I iterated
The initial version used text-heavy cards, genre listed as a tag, creator name, follower count. In testing, people scanned past cards without engaging. Introducing the color-coded genre system made the feed visually scannable in under two seconds, and the task completion time for "find a collaborator in your genre" dropped by roughly 40% in informal testing with five users.
The colors used didn't cater to the user's needs. It distracted the user from the CTA and primary actions creating unintentional chaos, which in turn deemed the app useless. The redesigned version kept this in mind.
The initial version used text-heavy cards, genre listed as a tag, creator name, follower count. In testing, people scanned past cards without engaging. Introducing the color-coded genre system made the feed visually scannable in under two seconds, and the task completion time for "find a collaborator in your genre" dropped by roughly 40% in informal testing with five users.
The colors used didn't cater to the user's needs. It distracted the user from the CTA and primary actions creating unintentional chaos, which in turn deemed the app useless. The redesigned version kept this in mind.
What I learned
Designing for a creative audience means your interface has to earn trust before it asks for effort. Creators are sensitive to products that feel generic: a Spotify-looking app wouldn't work here. Every visual and interaction decision had to feel like it came from inside the culture, not from someone who had observed it from the outside.
I also learned to let user behavior rewrite assumptions. The timestamp feedback feature wasn't in the original brief, it came entirely from watching how people described problems with a track during testing. The best features in this project weren't the ones I planned; they were the ones I noticed.
The hardest constraint was designing for both discovery (social, browsing, low commitment) and collaboration (high trust, high effort, long sessions) in the same product. These are different emotional modes, and the visual system had to shift between them without feeling inconsistent.
That tension pushed me to be more deliberate about hierarchy, spacing, and the role of color as a signal, not just as decoration.
Designing for a creative audience means your interface has to earn trust before it asks for effort. Creators are sensitive to products that feel generic: a Spotify-looking app wouldn't work here. Every visual and interaction decision had to feel like it came from inside the culture, not from someone who had observed it from the outside.
I also learned to let user behavior rewrite assumptions. The timestamp feedback feature wasn't in the original brief, it came entirely from watching how people described problems with a track during testing. The best features in this project weren't the ones I planned; they were the ones I noticed.
The hardest constraint was designing for both discovery (social, browsing, low commitment) and collaboration (high trust, high effort, long sessions) in the same product. These are different emotional modes, and the visual system had to shift between them without feeling inconsistent.
That tension pushed me to be more deliberate about hierarchy, spacing, and the role of color as a signal, not just as decoration.
