Creating a smooth and intuitive music streaming experience
🎧 Project Overview


Chime is a music streaming web application that aims to make music more accessible to everyone. Unlike many platforms locked behind expensive subscriptions, Chime provides free streaming of music, a growing library of royalty-free tracks, and an affordable premium plan for listeners who want extra features without breaking the bank.
Duration
My Role
Tools
The Challenge
Objective/Goal
5-6 weeks
UX/UI Design, Visual design, Branding, User flow, Research, Prototyping, and Testing
XD, Miro, Zoom, Google Forms
Most music streaming platforms are costly, restrict free features, and lack easy access to royalty-free music. Free users face heavy limitations and ads, while royalty-free music is locked behind complex licensing and high costs. This creates barriers for budget-conscious listeners, students, and content creators, while independent artists struggle to be discovered.
Chime's goal is to break down these barriers by offering:
Free music streaming with fair access for all users.
A royalty-free library that empowers content creators and supports artists.
A low-cost premium plan with enhanced features like ad-free listening, offline playback, and high-quality audio.
A simple, responsive, and user-first design that makes discovering and enjoying music effortless.
Chime ultimately seeks to create a fair, inclusive, and affordable music ecosystem where listeners and artists thrive together.
My Design Process
Competitive Analysis
User Research
Personas
User Journey Map
Sitemap
Paper Wireframes
Low-fidelity Prototype
UI Design
Accessibility Considerations
Usability Study
Revisions
High-fidelity Prototype
Takeaways
Next Steps
🎧 Discover & Define
In the early stages of designing Chime, I focused on understanding the problems users face with existing music streaming platforms. Through research and competitive analysis, I identified recurring pain points. To ground these findings, I created user personas representing budget-conscious listeners, indie music fans, and creators who rely on royalty-free music. Mapping their journeys helped clarify where frustrations occurred and where opportunities existed. From this, I was able to frame the core challenge: How might we design a streaming platform that is affordable, inclusive, and easy to use, while also supporting artists and creators?
competitive analysis
To better understand the streaming landscape, I conducted a competitive analysis of major platforms such as Spotify, Apple Music and SoundCloud. This analysis highlighted a clear opportunity for Chime: to position itself as a budget-friendly, inclusive alternative by offering free streaming, a library of royalty-free music, and simpler, less cluttered user experience.


user research
To better understand the audience for Chime, I conducted a mix of surveys and informal interviews with potential users, including students, indie music fans, and small content creators. The goal was to uncover their listening habits, frustrations with current streaming services, and expectations from a fair, affordable platform.
pain points










High Subscription Costs
Premium plans are too expensive for students and budget-conscious listeners.
Restrictive Free Access
Free tiers often include constant ads, limited skips, and reduced audio quality.
Lack of Royalty-Free Music
Content creators struggle to find affordable, easy-to-license tracks for their projects.
Cluttered Interfaces
Overloaded designs make navigation confusing and discovery less enjoyable.
Limited Indie Artist Exposure
Independent musicians have few opportunities to be discovered alongside mainstream artists.
personas
After gathering insights from research, I synthesized the data into three idealized personas. These personas represent Chime's core audience segments, each reflecting unique goals, frustrations, and needs uncovered during the discovery stage.




Alex—The Student Listener
"I love music, but I can't afford to pay a monthly fee just to skip ads or listen offline."
Age: 20
Occupation: Student
Goals:
Listen to music daily without worrying about cost
Discover new songs to match moods and study sessions
Frustrations:
Can't afford premium subscriptions
Free tiers are full of ads and restrictions
Needs:
Free, accessible streaming with minimal limitations
A clean interface for quick access to playlists




Maya—The Indie Music Enthusiast
"I want to discover new artists, not just listen to the same top 40 songs everyone else is hearing."
Age: 27
Occupation: Freelance Designer
Goals:
Discover emerging artists and fresh sounds
Support independent musicians
Frustrations:
Feels mainstream platforms prioritize popular hits over indie talent
Difficult to explore new genres without being pushed to top charts
Needs:
Strong music discovery tools
Exposure to indie artists and curated playlists beyond the mainstream




Ryan—The Content Creator
"Finding royalty-free music is so frustrating; either it's too expensive or the tracks sound generic."
Age: 31
Occupation: Youtuber/Podcaster
Goals:
Find royalty-free music quickly for videos and podcasts
Keep costs low while producing consistent content
Frustrations:
Licensing music is confusing and expensive
Free tracks are often low quality or overused
Needs:
Easy access to a royalty-free music library
Affordable premium option with high-quality downloads
user journey map
To better visualize how users would interact with Chime, I created a user journey map. This process allowed me to map out the user's motivations, actions, emotions, and potential frustrations at every step. The journey map provided a clear foundation for designing an intuitive flow that directly addresses user needs.


🎧 Develop
In the develop stage, I began turning research insights into tangible design ideas. I first created a sitemap to establish clear navigation flows and ensure users could easily discover music, create playlists, and explore subscription options. Next, I sketched paper wireframes to quickly explore different layouts and interaction patterns, focusing on simplicity and accessibility. These sketches were then translated into a low-fidelity prototype, which allowed me to test user flows and gather early feedback before moving into high-fidelity designs. This stage was crucial in shaping Chime's foundation, ensuring that usability and clarity were prioritized from the very beginning.
sitemap
I created a sitemap to establish clear navigation and user flows for Chime. It outlined the main sections: Homepage, Library, For You, Discover, Login/Signup, and Settings, ensuring users could easily browse music, manage playlists, and explore subscription options. This helped simplify the structure and guide the design of intuitive pathways throughout the app.


paper wireframes
To quickly explore layout ideas, I began with paper wireframes. Sketching multiple variations of the home screen, discovery page, and playlist flow allowed me to experiment freely without being limited to digital tools.










low-fidelity prototype
After refining my paper sketches, I translated them into a low-fidelity digital prototype to visualize Chime's core user flows. This version focused on structure and functionality rather than visuals, allowing me to test navigation across key screens. By keeping the design minimal, I was able to quickly validate usability, gather feedback, and make iterative improvements before moving on to high-fidelity designs.
low-fidelity wireframes












low-fidelity prototype


🎧 Deliver
In the deliver stage, I translated insights and wireframes into polished UI designs with a clean, modern look that emphasized simplicity and ease of use. I incorporated accessibility considerations to make the app inclusive for all users. These elements were brought together in a high-fidelity prototype, showcasing realistic interactions and responsive layouts. To validate the design, I conducted a usability study, gathering feedback on the user flow. Based on these insights, I made several revisions to improve clarity, streamline interactions, and ensure a smoother overall experience.
ui design
The UI design for Chime centered on a clean, modern aesthetic that puts music at the forefront. I used a black background to create contrast and highlight album artwork, paired with purple accents to convey creativity and energy. To balance the palette, I added turquoise highlights that bring freshness and vibrancy to key actions. Alongside the interface, I also designed the Chime logo, a simple yet distinctive mark inspired by music notes and pixels, reflecting the app's focus on accessibility and music discovery. Together with rounded elements, consistent spacing, and clear typography further enhance usability, resulting in an interface that feels both stylish and intuitive.


accessibility considerations
Accessibility was a guiding principle in designing Chime, ensuring that music streaming is enjoyable and inclusive for all users. Accessibility is not just about compliance; it's about making the app usable, welcoming, and fair for everyone.
Here are some considerations I've taken note of:
☑️ Color Contrast
Black background with purple/turquoise accents designed for WCAG-compliant contrast
☑️ Icon + Text Labels
Clear iconography paired with labels for better comprehension
☑️ Touch Targets
Buttons and controls sized for easy use on both desktop and mobile
☑️ Consistent Navigation
Logical structure and predictable patterns across all screens
☑️ Alt Text Support
Space for album covers and artwork descriptions for screen readers
usability study
To evaluate Chime's design, I conducted a usability study with a small group of target users who tested the high-fidelity prototype. Participants were asked to complete core tasks such as searching for a song, downloading, and exploring the premium upgrade flow. The study revealed valuable insights.
Insights


Song/Playlist Options
Users wanted more flexibility when managing songs and playlists


Search Function
Users suggested an easier way to find songs without typing


Playback Controls
Users wanted more control over how they listen
revisions
Based on the insights gathered from the usability study, I made several key revisions to enhance Chime's overall experience. These revisions ensured that Chime not only looked visually polished but also aligned more closely with user needs and expectations.


revision #1: expanded song options
Before Usability Study
After Usability Study
revision #2: voice search


Before Usability Study
After Usability Study
revision #3: Shuffle play


Before Usability Study
After Usability Study
high-fidelity prototype
The final high-fidelity prototype showcases Chime as a polished, interactive music streaming platform ready for real-world use. Every element was carefully designed to create a modern yet approachable look. By integrating user feedback and accessibility best practices, the final high-fidelity prototype delivers a visually striking and intuitive experience that captures Chime's goal of making music streaming free, flexible, and enjoyable for everyone.
high-fidelity wireframes










high-fidelity prototype


To give users more flexibility and control, I added an expanded set of options for each song, including Add to Queue, Go To Artist, Go To Album, Add to Playlist, and Copy Song Link. These additions make it easier for listeners to manage their music seamlessly, discover related content, and share tracks with others, ultimately creating a richer and more engaging experience within Chime.
To make discovering music faster and more accessible, I integrated a voice search feature in Chime. This allows users to simply speak the name of a song, artist, or album instead of typing, reducing friction and making the app more convenient, especially for those on the go or users with accessibility needs.
To enhance the listening experience, I added a Shuffle Play option on playlists. This gives users more control and variety, allowing them to enjoy their music in a fresh, randomized order without having to manually rearrange tracks.
🎧 Going Forward
I realized how important it is to listen to users early on and not rely only on my assumptions.
Small details, like button placement and playback options, showed me how even subtle changes can make a big difference in the overall experience.
This project challenged me to balance creativity with practicality, making sure the design looked great but also worked smoothly.
I became more aware of how accessibility matters and how thoughtful choices can make the app usable for everyone.
Moving from sketches to a high-fidelity prototype gave me confidence in my process and ability to iterate effectively.
Working on Chime taught me the value of designing with users at the center. From research to prototyping, I learned how critical it is to validate assumptions and continuously refine based on feedback.
takeaways
next steps
Conduct usability testing with a larger and more diverse group of users.
Explore additional features such as personalized recommendations, social sharing, and offline listening.
Refine playlist management and discovery features for smoother user flow.
Continue improving accessibility to ensure an inclusive experience for all users.
Prepare the design for potential real-world implementation and scalability.
Let’s start your next project together.
ⓒ 2025 — Guylaine Bernardez