Case Study · Design Leadership

HubSpot Canvas

Head of Product Design, Research & Content — reported to the CPO

Turning a market-leading CRM's fractured product identity into a brand people actually wanted to use.

HubSpot Canvas logo
5 → 1 product lines to 1 design language
7 → 35 Team: 7 to 35
Org-wide Priority #1 for the HubSpot roadmap
Overview

I joined HubSpot in a period of significant transition, right after a newly-departed CPO had dramatically reshaped the org into small, autonomous teams shipping continuously. Each pillar of the product suite had been acquired or built with its own tech stack and style guide, which was rapidly decaying as new decisions were made. I now led design, research, and content across all of it, reporting directly to the new CPO.

This is the story of how we turned five disconnected products into one.

The design team mapping the system on a glass wall
Situation / Problem

The warning signs were there. Our biannual engineering survey kept surfacing the same complaint: ambiguity over which component or pattern to use. Product metrics and customer sentiment were sliding in the same direction, and the market's bar for B2B software climbed as people expected the same level of polish as the apps on their phones.

Old data grid screen An existing report screen from one of the five product lines

An audit I requested made it stark:

8date pickers
100+shades of gray
6primary button styles
5different ways to filter a table

Customers described the product as dense, dated, "uninteresting." But none of it came from carelessness. It simply came from team autonomy without visibility, and an unclear path to unification.

Old inconsistent buttons So many buttons
Old inconsistent modals Multiple modal styles
Establishing a Vision

I pitched it to my boss over pad thai: a unified system that would wipe out the pervasive friction (internally and externally), and head off the tech debt growing with every new, inconsistent component. From there I took it to the founders and got an agreement that teams would set roadmap work aside to bring this to life.

I ensured everyone that we'd hold two critical lines:

1

Visual refresh only

no new functionality, or 40+ teams' timelines would drag out indefinitely

2

One product area at a time

no single "big reveal," because that would have meant a level of roadmap timing, feature-gating, and risk nobody had an appetite for

I then led the team to benchmark the product against our corporate marketing and the mismatch was clear (and painful): HubSpot's brand was warm and a bit irreverent, and the product looked, as one designer put it… like Salesforce. From there we established 5 (ranked) design principles: Clear, Human, Inbound, Integrated, Collaborative. These became our North Star (I even had them printed on desk cards) and we used them to settle our difficult trade-offs.

DESIGN PRINCIPLES
1 · Clear

We design for clarity and focus. Our work helps users do the next right thing through feature prioritization, visual hierarchy, and contextual awareness.

2 · Human

We foster a sense of joy by humanizing the experience in ways that resonate across cultures. Our work provides users with a playful and personable interaction every time.

3 · Inbound

We reinforce the message and meaning of the Inbound methodology. Our work makes the Inbound path clear to our users and helps them understand why it's the right thing to do.

4 · Integrated

We simplify the user's experience by creating a unified system that solves for their needs. Our work helps users achieve great things by offering a streamlined, efficient approach.

5 · Collaborative

We devise powerful systems that encourage people to work seamlessly together. Our work helps people create and collaborate with each other in natural, intuitive ways.

We validated the direction with customers before committing to it. The response told us we'd found it.

The unified Canvas system New kanban page New data visualization page

"I feel capable. I feel like I know exactly what to do."

"Doesn't look like business software."

"This is fun. This is what I would expect from HubSpot."

Empowering a Movement

Getting the visual language right required holding my team to an extremely high bar and ensuring they believed in themselves. But that was the easy part… getting 40+ autonomous teams to adopt it was the real work.

I built a rotating design system team and pushed for co-ownership with our "Front-End as a Service" dev team instead of simply handing specs off to engineering. We established GitHub as the single source of truth, open to anyone, not gatekept by any single team.

At one point, exec leadership wanted our original brand orange (think Home Depot) splashed across the product. I made the unpopular case that it would fight the calm, focused feeling we needed, pitching the product and marketing style guides as cousins, not siblings. It took real convincing, but we got approval for a new, modern shade and marketing eventually adopted our system for the brand itself.

Canvas button system Canvas data viz components Canvas icon set Canvas illustration library
Release naming scheme: UI Kit named after rappers

When the core CRM area launched, we quickly heard that the extra whitespace was slowing down our sales users. I had the team build a denser variation teams could opt into, rather than let that specific use case derail the full product experience. We also heard, more than once, a fair question: why isn't design solving our real problems? That was a signal I hadn't done enough to explain to customers that this work was the foundation that enabled everything after it to move faster.

To keep morale up through the genuinely tedious stretches, weekly release updates went out under a running joke of a naming scheme: deceased rappers first (eg the Left Eye release), then as-seen-on-TV products (Fridge Locker, anyone?). It was a small thing, but the fun was pervasive.

Outcome
Tweet from Mike Champion praising the HubSpot React component library

Five product lines became one living design language.

The team grew from 7 to 35, with a management layer added to support the scale.

Marketing fully adopted our visual system for the HubSpot brand itself.

And the system outlived my tenure, still active and referenced in HubSpot's engineering culture years after I moved on.

The team's growth from 2016 to 2018
Reflection

Chasing uniform consistency is often tempting. But what matters is coherence, which leaves room for real variation, like the CRM density option built for one persona's specific day. The system itself wasn't the hard part. Governance was. Without the rotating team and the constant, unglamorous work of reminding people why any of it mattered, Canvas would have decayed like every style guide before it.

Let's build something coherent.

← More Work Get in Touch →
Tim Merrill mark Tim Merrill
© 2026 Tim Merrill · Design Leadership
Email LinkedIn