Systemising Visual Assets

January 20232 min read

Starting Point

As part of a new offering, we introduced additional paid user tiers and needed to gate certain features on the platform. My team was first to tackle feature gating, and the initial designs felt inconsistent - each gated feature looked like it had been designed in isolation.

Early gating designs - inconsistent treatments

More early explorations

Exploration

We decided the design needed more personality and energy - this was an upsell, after all. We tried different visual treatments, colours, and background combinations. The goal was to be attention-grabbing without being distracting. We also wanted to surface more features in a smaller space, so we explored different ways to pack in more information without overwhelming.

Visual exploration - Direction A

Visual exploration - Direction B

Stakeholder Management

This project had a broader audience than most. Product had an obvious stake in it, but Marketing did too - they needed the card to carry their copy and be flexible enough to work across different features and campaigns.

We put together a document showing how the card would be used in context, highlighting the opportunities for Marketing copy, and demonstrating how heavily it could be customised. We also prepared pre-canned copy and mock-ups for different feature scenarios to help both teams see the system at work.

Stakeholder document - usage in context

Stakeholder document - customisation options

Stakeholder document - copy and mock-up variants

Final

To bring it home, there was a request for stronger visual cohesion with the marketing site. We drew on graphic elements from the broader brand system to tie the card into the wider visual language.

Final design - primary card

Final design - variant

Final design - full suite


In retrospect: this project was the seed of something that should have been framed as an org-wide initiative from day one. The card system we built was genuinely useful, but it lived in one team's Figma file. As a design leader, I'd now identify these moments earlier - where a local design solution has the potential to become shared infrastructure - and push to establish them at the right level of the organisation.