The Collective

Web Design, Copywriting, UX Consulting

The Collective designs, manufactures, and installs bespoke acoustic solutions for commercial and residential interiors. The majority of their clients are specifiers (architects, interior designers, and contractors) who need less marketing fluff and more technical data and reference images.

What was the problem

Their previous website read like a dull product catalogue, and one of those that on top of lacking character isn't easy to navigate either. To work as a specifier's tool, this needed to be fixed. However, after multiple working sessions with the team, a tension cropped up alongside the need for a new site. The three stakeholders, all senior partners in the business, had genuinely different visions for the project. On one hand, a challenger direction. On the other, a corporate tone. And the last, a preference for the pared back and simple.

Meanwhile, I also learned that their current site was burying their strongest differentiator—that they guide clients from first consultation to final install and don't stop at the design stage—deep down layers of outdated design and jargon.

Two screenshots of the old website
The Collective's previous website

First pass: working within the constraints

The plan became: let's surface the right products, hide all potential distractions, and make the company's end-to-end service immediately obvious.

I was initially commissioned to maintain the existing site structure, navigation, and CMS intact. Constraints in mind, I redesigned every page to be less cluttered and to better align with how the team actually speaks to clients face-to-face. Although copywriting was never formally part of the brief, my design process always starts with words. So as well as working on the UI, I also wrote headlines and page-level copy.

Screenshots of the Homepage and Products pages from the first design phase
First phase redesign of the Homepage and Products pages
Screenshots of the Sustainability page from the first design phase
First phase redesign of the Sustainability page

Second pass: one concept for three visions

The second version came out of several conversations with the marketing team, and it went a lot further. The brief in fact, by now, expanded to a full refresh and most constraints came off. The question at this point became: Can you satisfy three competing visions across an entire new website while staying coherent?

I chose a primary direction and built a system flexible enough to hold elements of each vision. The team's ambition to grow into a challenger-brand set the tone, and led to a bolder palette where the brand's earthy colours got pushed toward something more distinctive. I also took the opportunity to inject some personality into the design by using some see-through elements and a few skewed images.

Simplicity, or rather effortlessness, is the steady hand guiding the user. This explains the generous use of white space, the single typeface, and the three-column grid. As hard-to-shake as it was, the corporate weight was accommodated through modularity and through a darker, more austere card component that could be used to shift tone without shifting direction.

'Where have I landed?' and 'Where am I going next?' were arguably the hardest questions to answer. As a result, I suggested switching the main calls to action to address a central question—something the old website never asked—"What kind of space are you designing?". In response, the website early on presents you with four categories of use case (workspaces, cultural spaces, mixed-use, and residential spaces), each leading to a page with products and case studies relating to that category. A little further down, the 'Your journey with us' section puts the whole process into perspective, from the first chat to the final installation.

Screenshot of Mega menu design from the final design phase
Menu design
Screenshots of a card component in dark mode from the final design phase
Card component
Screenshots of a products range component from the final design phase
Section showcasing the brand's product range
Section explaining the customer's journey with the business
Visualising the intended customer journey, step by step

How it helped

The three partners walked away with a concept that answered questions their old site never asked, and one direction they could all get behind: bold enough for a challenger brand, simple enough to feel effortless, and modular enough to carry the corporate weight where necessary.

Here's what the team had in hand:

Presentation slides
Slides covering key ideas and decisions behind the design concepts