CP Pro Audio

Making sound visible.

Role

Branding, End-to-end Design, Product Development

Timeline

2 Months

Figma

Framer

CMS

Overview

Making a studio's creative value visible, accessible, and easier to explore.

CP Pro Audio had an extensive audio catalog and a body of creative work that deserved a stronger digital presence. Its existing website was outdated, its content no longer reflected the studio's capabilities, and there was no dedicated platform for exploring its audio library. I took ownership of the entire project, from a complete brand identity overhaul to the design and development of a new marketing website, portfolio, and custom audio library built from scratch. The work connected three parts of the business: how the studio presented itself, how it showcased its work, and how people discovered its sounds. The result was a cohesive digital platform designed to communicate the studio's creative value while giving industry professionals a practical way to search, filter, and preview audio.

I. Brand Identity

Making sound visible.

How do you build a visual identity for a studio whose work is fundamentally heard rather than seen? The goal was to bring CP Pro Audio's branding closer to the sounds the studio created. I completely overhauled the visual identity, using sound-inspired graphics to establish a stronger connection between the studio's creative output and how it presented itself visually. Rather than treating the brand as a separate layer of the business, I approached it as the foundation for the wider experience. The identity needed to feel connected to the studio's craft and provide a consistent visual language across its digital presence. That thinking carried through the marketing website and audio library, creating continuity between the studio's identity and the work people came to explore. The objective wasn't simply to modernize the brand. It was to make the visual identity feel like an extension of the sound itself.

Design decision: Organize discovery around user intent, not publishing order.

II. Digital Presence

One identity, carried through the entire experience.

With the new identity established, the next step was to translate it into a digital presence that better communicated the studio's capabilities. I designed and developed a new marketing website that brought the studio's brand, services, and portfolio together in a cohesive experience. The portfolio gave the studio's work a place to speak for itself, while the wider website provided context for the studio and its capabilities. But the marketing website was only part of the opportunity. The studio also had an extensive audio catalog that needed a more functional home. A traditional portfolio could demonstrate the quality of the work, but it couldn't provide an efficient way to explore individual sounds. That called for something beyond a conventional website: a dedicated audio discovery platform.

Design decision: Organize discovery around user intent, not publishing order.

III. Audio Library

Designed for people who know what they're looking for.

The audio library served a different purpose from the marketing website.

Its audience included audio professionals and other industry collaborators who needed to find specific sounds for their work. Rather than assuming users would browse the catalog casually, I approached the experience around a more task-oriented behavior: users would often arrive with an idea of what they needed and want to locate it quickly.

That shaped the central design priority.

Finding and previewing the right sound needed to feel effortless.

Search and filtering were essential to making a large catalog manageable. Users needed to narrow their options, listen to previews, and move through the available sounds without fighting the interface.

I wanted the UI to support the work rather than compete with it. The experience needed enough structure to make the catalog easy to navigate without adding unnecessary complexity between a user and the sound they were looking for.

This meant thinking about the library as a working tool, not simply a collection of audio presented in an attractive interface.

The goal was to make the catalog feel accessible and straightforward, even though the system supporting it was considerably more complex.

Design decision: Make the analysis memorable without making it superficial.

IV. Designing the Search Experience

One search. Multiple paths to discovery.

Users often arrived at the library knowing what kind of sound they needed. The challenge was helping them find it without requiring them to understand how the catalog was organized behind the scenes.

I built a custom search experience centered on a single search bar that queried multiple CMS metadata fields simultaneously. Rather than restricting discovery to track names, the search could match keywords across a broader range of information associated with each audio asset.

This gave users a more flexible way to discover sounds through one familiar interaction. They could search using relevant keywords, narrow their options with filters, and preview audio without having to navigate a complicated catalog structure.

The search experience depended on more than the interface itself. The underlying metadata needed to support meaningful discovery, and the custom search logic needed to connect that information to useful results.

I approached these elements as parts of the same system: the content structure, search behavior, filtering, and playback all needed to work together to make the experience feel straightforward.

The principle was simple: make the catalog work around the user's search, rather than making the user work around the catalog.

Design decision: Present the insights as clear and actionable, so users can connect what they've learned to their own marketing and social decisions.

V. Engineering the Experience

Making a complex system feel simple.

The library's technical implementation introduced a distinct set of challenges.

The client required a CMS-based solution rather than a PostgreSQL database. I needed to structure a large audio catalog within that constraint while building custom functionality on top of the available content.

I developed custom search and filtering around CMS metadata and engineered a custom audio player to work with the catalog. One of the most demanding parts of the implementation was ensuring that each catalog entry mapped correctly to its corresponding audio file.

With a large number of tracks, the relationships between the content, the interface, and the underlying audio assets had to remain reliable. Structuring the catalog and coordinating those connections was a significant part of the work.

The search experience also depended on these relationships. Querying multiple metadata fields required the content to be organized in a way that supported discovery, while the player needed to connect the selected result to the correct audio asset.

Because I was responsible for both design and development, I could approach these challenges as connected parts of the same problem. The interface couldn't be designed in isolation from the data structure supporting it, and the technical solution had to serve the intended user experience.

Throughout the implementation, the priority remained the same: make it easy for users to find and listen to sounds without exposing them to the complexity behind the platform.

I wasn't just designing the experience of using the library. I was building the system that made that experience possible.

Outcome

A connected brand and digital platform, built for real-world use.

The project brought CP Pro Audio's brand, portfolio, and audio catalog together in a unified digital experience.

The identity overhaul established a new visual foundation for the studio, while the marketing website provided a clearer way to present its work and capabilities. The custom audio library added a dedicated platform for searching, filtering, and previewing the studio's extensive catalog.

The completed platform was used by the client's colleagues and prospective agency partners, giving them a practical way to explore the studio's work and audio assets.

The project also formed part of a broader business context in which an agency ultimately acquired the client's brand. While that outcome involved considerations beyond the digital work itself, the new platform helped present the studio and its capabilities during that period.

The client was extremely enthusiastic about the result, describing himself as "absolutely over the moon."

For me, the project brought branding, product design, and development together in a single piece of work. I took responsibility for the experience from the initial visual identity through to the implementation of a custom audio platform, balancing the creative direction with the practical requirements of a working system.

The result was more than a refreshed brand. It was a complete digital experience that brought the studio's identity, creative work, and audio catalog together in a platform people could use.