Wise design brand refresh

Behind the brand refresh

Wise has always been seen as a challenger brand, known for its bold branding campaigns that effectively convey the company’s mission of providing money without borders and no hidden fees. However, as the years passed, the brand began to feel stale and found itself surrounded by competitors that looked remarkably similar. In 2022, Wise initiated discussions with Ragged Edge to explore a completely new look that would better reflect its mission.

After nearly a year of brand exploration and evolution, Ragged Edge, in collaboration with Wise, developed a design that they decided to incorporate into every aspect of their product.

At this point, the Design System team at Wise was brought in to turn this vision into reality, ensuring it was amplified throughout the entire Wise experience.

This endeavour was a significant team effort. My work and leadership focused on specific work streams (more details on that below) and supporting the overall plan for this initiative.

While hunderds of people brought this project to life, the team I have outlined consisted of those who were dedicated specficially to the Wise Design System.

The Team

Why change?

Lost in the sea of sameness

Wise had been evolving it’s brand since it’s conception in 2011. Over the years the market continued to shift and Wise slowly started drowning in the sea of sameness, and all of a sudden we were getting lost in the mix of every other fintech and bank in the market with no key differentiators.

Wise’s bold and direct mission — money without borders meant we didn’t belong here and needed a change to avoid becoming stagnant.

Collection of different banking home pages, all blue

The before times

Neptune, our old design system

Yep, Wise already had a system before the refresh, Neptune. It contained the basics — components, (some) patterns, colours, typography and iconography. But they were each riddled with different issues and we didn’t have the highest adoption rates.

Not to mention we didn’t own flags or illustrations, which meant that there were no governing rules around how to use them. This led to hundreds of rogue animations scattered around product or different open source flag repos being used.

The brand refresh

A partnership of dreams

We worked closely with Ragged Edge who developed and evolved a bold new face for Wise. Through many iterations we landed on an identity that reflected our brand and mission.

It was bold, unique and totally different from the rest of the market, allowing us to set the standard and show we’re not afraid of change, no matter how big we are.

Foundations

As part of this visual direction, Ragged Edge created foundational building blocks for us to use.

These included illustrations, iconography, tapestries, colours, typography, photography, flags as well as a bold new tone of voice.

Product exploration

As well as foundations, Ragged Edge had explored in-situ designs to showcase how we could implement those changes. While these helped guide us, it was up to us to figure out how we translated them to work across all of product and amplify through our system.

While their initial directions worked well across a few select screens, it wasn’t as simple as finding and replacing styles in our existing system — trust me, we tried.

wise refresh in product desktop explorations

Systemising the refresh

Work streams

Given the work had many moving parts we looked at how we could split it into streams where we had clear owners across the system.

I owned the systemisation of assets and animation, which included icons, flags and our new animated and static 3D illustrations, as well as typography and spacing.

Rituals

As part of this work, it was crucially important that everyone from stakeholders to team members were across what was going on in different work streams.

These rituals allowed us to regularly feedback and check in with one another, ensuring we were always on the right track.

Project syncs

Team syncs were used for keeping our designers and engineers in the loop throughout each stage of development.

Cross-stream jams

Jam sessions were used to share work across streams, so that we could easily bring the work back together.

Design crits

Designers and engineers from the team as well as the occasional external stakeholder participated in crits to ensure we were all aligned.

Sprint reviews

We held biweekly sprint reviews for senior stakeholders to keep them in the loop on progress and decisions.

Bringing it all together

To ensure everything worked harmoniously, we would share our work regularly to see how it all balanced together.

Continually evolving and stress testing in our product UI and sharing with product teams as we went along.

The updated system

By the time we had aligned on our system we updated our core libraries and started migrating changes across all our system touch points.

Instead of updating our existing libraries we created new ones.

This forced designers to consciously make changes, and allowed us to update the system in a much better structure.

As well as updated components our new library included foundations for illustrations, icons, flags, colour, typography and spacing.

Getting adoption

The deadline

The business had a deadline of a big bang launch for the refresh on March 1st, 2023. No split test, we were going all in, all green.

As a result of this, the design system needed to be ready by Q4 2022 in order for other teams to adopt and upgrade their repos in time.

While we had fairly strong adoption, it wasn’t enough to cover a simple system update.

It was our job to make using and upgrading the system as simple as possible to make this deadline.

We had an idea to pitch the system to the business — to save everyone time we sold the system as a means to get the refresh in the fastest way possible. Adopt the Design System and get the refresh for free.

Our pitch — Adopt the Design System and get the refresh for free

Team Call

In August 2022 on a Team Call to 3000+ Wisers globally, in an outfit to match my backdrop, I presented the new system.

Including what had changed, when it’ll be ready, what teams needed to do in order to be refresh ready and most importantly, our pitch.

Design Systems day(s)

To kick off the work and get everybody aligned, we then presented the system back in detail. This was an opportunity to show everyone what we had done with the refresh in the system.

Split across 2 days, we presented each stream of work from the new system to product teams and gave them guidance on how to use it.

Support and workshops

Each member of the team was assigned to support different teams across the org to ensure they understood how to use the new system and help in updating their experiences.

This was an initiative shared across design and engineering to ensure teams had support in upgrading their repos as well as their Figma files.

My face with icons representing teams surrounding

Demo of the refresh plugin changing a product screen from old to new

Making it simpler to update

We wanted to make upgrading a seamless as possible, so our genius design engineer Henrique Gusso created a refresh plugin that would allow designers to easily update their designs to the new brand.

While it did 80% of the work, it required the original system to be implemented, those gaps where were it didn’t work and that’s where our workshops came into play.

Team checkins

As we got closer to releasing, we needed to keep track of our 90+ product teams to ensure they were on track with updating their part of the product.

To keep on top of this, we had a master spreadsheet and weekly checkins owned by our design ops legend, Sheena Lydon.

Table with team names and project status

Launch day

March 1st, 2023

At 7am on a cold, Spring morning we pressed the big red button and went live.

Featuring a Wise themed Question Hound ~~stressfully~~ crocheted by me.

The team, bright and early ready for launch

Question hound with the big red launch button and countdown

The team in front of the rebranded billboard in Shoreditch, London

The results

A surprisingly seamless rollout

I don’t think any of us really thought we would pull it off. After collecting a few more grey hairs, we’d built a system to support product and editorial from billboard to button.

Not only was the rollout a success, the feedback to this day has been overwhelmingly positive.