Bespoke marketing website for the new Sonos Business B2B experience.
LEAD DESIGNER
DEFINING THE SCOPE
DISCOVERY WORKSHOPS
ARCHITECTURE & WIREFRAMES
ADAPTING TO AN EXISTING DESIGN SYSTEM
3D MODELING & ANIMATION
CRAFTING THE DESIGN
Sonos was ready to expand its soundscape—this time, from homes to businesses. Tasked with helping Sonos market to a B2B audience, I created a site that captures the same premium experience they deliver to consumers.
The Sonos Brilliant Sound Survey revealed the profound impact sound has on enhancing mood, productivity, fitness, and relationships—backed by science and human behavior. With these insights, Sonos recognized an opportunity to bring the transformative power of brilliant sound beyond homes and into businesses, enriching spaces like offices, retail environments, and hospitality venues.
say music affects how they feel in a space more than lighting or decor.
say they prefer a place with good music over one with good drinks.
say music motivates them to work out harder and longer.
To ensure a user-centered approach, the discovery phase was grounded in strategic exploration and collaboration. We began with a series of in-depth workshops with stakeholders, aligning on business objectives, target audiences, and key success metrics.
Through our discovery process, we uncovered the importance of not only targeting business owners but also addressing the needs of installers and trade professionals who play a crucial role in recommending and implementing Sonos solutions. This insight led us to create specifically targeted landing pages tailored to these audiences, ensuring the messaging, resources, and calls to action were relevant and actionable for each group.
We also explored ways to elevate the customer journey with tools like a speaker configurator experience. This feature empowers users—whether business owners or trade professionals—to visualize and customize their audio setups, making it easier to select the perfect solution for their unique spaces. These targeted efforts ensured the site addressed diverse user needs while staying true to Sonos’ premium brand identity.
Part of the challenge was to strike a perfect balance: preserving the core aesthetics and values that define Sonos while adapting them for a business-oriented audience. This approach ensured the new site spoke directly to commercial clients—showcasing Sonos’ tailored solutions for businesses—while maintaining the premium, innovative feel synonymous with the brand.
To create a scalable and cohesive design system for Sonos Business, I built dozens of reusable components tailored to the platform’s needs. From buttons to layout grids, each element was crafted to ensure consistency across the site while adapting fluidly to various use cases. These components provided the foundation for a seamless user experience and enabled efficient collaboration with developers.
This component-based system followed an atomic design approach, where elements were built from the ground up—starting with smaller "atoms" (like buttons and icons) and combining them into larger, functional "molecules" and "organisms" (such as forms or page sections). This methodology not only reduced redundancy but also ensured every piece of the design was intentional, consistent, and adaptable. By leveraging this approach, we streamlined the design process and significantly improved design-to-code handoff efficiency.
I designed with a fluid type and space scale that ensured typography and elements always appeared visually correct and proportionate across any device. By automatically adjusting to variations in screen sizes, the design maintained its premium feel without requiring multiple arbitrary breakpoints. This responsive approach elevated the user experience while preserving Sonos’ brand consistency across desktop, tablet, and mobile.
I brought the Sonos Business website to life with various unique animations and interactions. Most notably, I created a 3D animation of the Sonos One speaker in Blender and Cinema4D, creating an immersive and interactive experience that captivates users as they explore the site's offerings.
The Sonos Business project culminated in a resounding success. Efforts in crafting compelling 3D visuals and integrating fluid motion graphics transformed concepts into captivating experiences that retained attention and drove user engagement. The design system's efficacy was mirrored in user feedback and analytics, signifying a substantial leap forward in how Sonos connects with its business clientele.
Average session duration
In business lead generation revenue.
