Manali Bapat - Senior Product Designer

From sad to coveted

What B2B can learn from 'delight'

Platform

B2B, Web

My role

Product Designer

Team

1 Product Manager, 1 Engineer

You won, we 'acknowledged'

Do you remember the Sports' Day in your school? Imagine running a 400m race, in the scorching heat. You have been training for weeks and when you finally push through the finish line, you think it was worth this. You expect applause, loud claps and celebration.

But you see your teacher handing a piece of paper that says "Completed." No cheer, no celebration. Just "You won, we acknowledged."

That's what the old badges felt like.

Context

But it's B2B. Does it even matter?

Most B2B products have a tradition of treating delight like a luxury. Something you earn the right to, once the "real" problems are solved. Nice to have. Low priority. This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

Our badge system was a perfect example of this thinking: functional but forgettable. Our learners were completing module after module, putting in effort and the badges were telling them: we noticed, but we don't really care.

Most B2B products have a tradition of treating delight like a luxury. Something you earn the right to, once the "real" problems are solved. Nice to have. Low priority. Our badge system was a perfect example of this thinking: functional but forgettable. And they were quietly telling every learner who completed a module: we noticed, but we don't really care.

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

But I think in the past few years, gamification has evolved so much and that is should be domain-agnostic. The dopamine hit of earning something that looks earned is human. And our learners were completing module after module, racking up real effort, only to receive a digital equivalent of a shrug.

There's a well-documented psychological principle called the Peak-end rule.

People don't remember an experience in its entirety. They remember how it felt at its most intense moment and how it ended. The completion screen is the 'end'.

⚠️ Challenge

This is what we heard from the customers:
"Learners are putting in time and efforts in completing learning modules and getting good scores, but we feel they are not being celebrated at all. We think they deserve more cheer and tangible sense of achievement."

This is what we heard from the customers:
"Learners are putting in time and efforts in completing learning modules and getting good scores, but we feel they are not being celebrated at all. We think they deserve more cheer and tangible sense of achievement."

Research

First, understand what we had

Before redesiging, I needed to understand the existing system.

How many badge types exist?
What is the criteria for each one?
What is the points' scheme?
And - what are these Chess-themed badges achieving?

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

Before redesiging, I needed to understand the existing system.

How many badge types exist?
What is the criteria for each one?
What is the points' scheme?
And - what are these Chess-themed badges achieving?

The Chess pieces might have felt clever once. Pawn♟, Knight♘, Rook♜, Queen♛, King ♚ - a hierarchy of mastery.

But for a global, bigger and diverse learner base, Chess as an analogy came off as niche. Also, it might work well in isolation, but here, it doesn't have any direct co-relation with the sales domain.

The existing badges were failing at two of the three levels of Don Norman's framework from Emotional Design.

Don Norman's framework breaks experience into three levels: visceral (how something looks), behavioural (how it works) and reflective (what it means). The badges were failing at two of the three:

Visceral: Looked dated, flat, clipart-ish and not like something that signals achievement and applause.
Reflective: Felt irrelevant and meaningless.

Shouldn't it be more easily relatable? Something that looks like a prize, an applause, an achievement?

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

Research

What the world had moved on to

Holding on to the previous thought, I went broad with references - games, fitness apps, learning tools, leaderboards.

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

✅ What works

Clear progression: Easy to understand the ranks as stages of a journey.
Motivational: Feels adventurous and rewarding, like reaching a summit.
Community and belonging: Reflects teamwork, like trekking with others.
Sense of accomplishment: Reaching the top (Ranger rank) feels epic.

⛔️ What can cause friction

Not relatable for everyone: Some people don’t trek, so the metaphor might not click.
Too adventure-focused: Might feel intimidating for learners who prefer simpler analogies.
Summit pressure: Implies everyone should aim for the top, which may not suit all learners.

⛔️ What can cause friction

The design of Zoho Motivator’s trophies seems to have a mismatch between the intended ranking and their visual representation.

Elite looks like silver: This can confuse users who expect “elite” to look distinct or premium.
Gold looks like bronze: Users may misinterpret ranks if the colors don't align with common expectations.

The common thread in everything: It felt good to earn. The 3rd dimension, use of light, colour and a sense of material weight. Badges and shields that looks liked they would so satisfying to hold, if those were tangible and real.

In comparison, both visually and emotionally, our existing badges looked so 'clip-art'.

Then came the hard part

Convincing the stakeholders to care

I think redesigning something like gamification badges in a B2B product is a gentle uphill battle. Because these are not core flows, there is no direct revenue impact and product teams have a long list of things that feel more urgent.

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

I knew a big revamp proposal wouldn't do. I thought of pitching something that is easy say 'yes' to. I suggested a like-for-like swap.

The badge scheme - number of badges and points system stays as is.
Just replace current badges files (PNGs) with new ones.

Very little engineering effort, less time required and much less change management - Yayy!

Starting small and making it happen made it easier to pitch bigger gamification enhancements.

Getting uncomfortable and skilling-up

Designing something I had never designed before

I am not a visual assets' designer. Working with illustrations and iconography is a special skill and I hadn't explored it much before. But looked like I am doing that for this project.

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

💡 Very relatable theme - built by relevant colors and icons

It was evident from the research that a niche theme doesn't work well. Hence, my explorations started with that and I explored how to make those 3D and tangible.

💡 Same theme, different visual style

The more I iterated, I understood how small things make big difference.
See what that shadow did?

💡 Panda? Why not?

Having Mindtickle mascot on the gamification badges? Definitely worth a try!

💡 Think tangible, then digitize it

Trying to get that metallic shine of a real badge

Outcome

The 'feeling'

Shiny, dimensional, metallic. Something that you would like to put on a shelf, if it was tangible.

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

Visual weight signals real reward. The colors, the way it reflects light, the etched icons, the borders, shadows and tiny finishing details - everything comes together to say "Congratulations, you earned this!".

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

What it changed

Impact

The sales rep finishes their module and they see something that appreciates their efforts, celebrates them and motivates them to do even better.

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

This one change at the end flow significantly changes how the user feels about themselves and about the product. They leave this flow feeling good and inspired, which makes them want to come back in a positive learning mindset.

This is the inertia I kept running into: Learners are professionals. They don't need confetti. Keep it serious.

From sad to coveted

What B2B can learn from 'delight'

You won, we 'acknowledged'

You won, we 'acknowledged'

But it's B2B. Does it even matter?

But it's B2B. Does it even matter?

This is what we heard from the customers:"Learners are putting in time and efforts in completing learning modules and getting good scores, but we feel they are not being celebrated at all. We think they deserve more cheer and tangible sense of achievement."

First, understand what we had

First, understand what we had

What the world had moved on to

What the world had moved on to

Convincing the stakeholders to care

Convincing the stakeholders to care

Designing something I had never designed before

Designing something I had never designed before

💡 Very relatable theme - built by relevant colors and icons

💡 Same theme, different visual style

💡 Panda? Why not?

💡 Think tangible, then digitize it

The 'feeling'

The 'feeling'

Impact

Impact

This is what we heard from the customers:
"Learners are putting in time and efforts in completing learning modules and getting good scores, but we feel they are not being celebrated at all. We think they deserve more cheer and tangible sense of achievement."