soundbathvibrations.com
(Website)Overview
- Role
- Designer & Builder
- Team
- Solo
- Client
- Sound Bath
Summary
Sound Bath is a category-leading music producer with a strong presence across all major streaming platforms. Prior to this project they didn’t have a website, and also lacked a central hub for showcasing their catalog and connecting with listeners.
The project resulted in an increase in user communications via the website. The website was built and delivered by myself, and set up so that the client could make minor updates on their own using AI.
The Problem
No center or connection.
Sound Bath had a rich catalog of ambient music and sounds, but the streaming platforms had a rigid format for showcasing the offerings with a lack of personal communication to their listeners.
Users
Listeners and small businesses.
Individual listeners stream from the audio catalog as labeled for meditation, sleep, or starting the day. Small businesses use audio tracks to create the atmosphere for locations like yoga studios, daycares, or art installations.
User Flows
User journeys from streaming to the new website.
We laid out the journeys of their users searching or browsing for music and potentially wanting more information about the brand. We established that if a user made it to the website, they were there intentionally to learn or connect, and that aligned with the client’s goals of educating users on their catalog and encouraging more communication.
Wireframes
The framework for education and connection.
Lo-Fi wireframes were used to cement the hierarchy of goals and information for the client, while tying it back to the user flows.
Visual Assets
Building upon existing branding.
Sound Bath already had a great logo, some colors, and preferred fonts. I added some more colors and font styles (based on their existing ones) to cover everything I would need for the UI Designs.
UI Design
Like stepping into a modern museum...
After discussions with the client, we agreed on an artistic direction that evoked the feel of visiting a modern museum using existing company visual assets. The idea was to have a bold first impression based on the company logo, that continued throughout the experience while becoming more subtle as the showcased work became the primary focus.
Delivery
Using AI to complete the project.
I built the final website using Claude Code, deployed it to a designated GitHub repo, set up and connected a Web3Forms account for the contact form, and then connected the domain. Since the client is actually a Claude Code user as well, I was able to add them as a Collaborator for the GitHub repo and then provide them with a .md file so that their Claude Code could connect directly to the website to make subtle changes to content without me.