How we successfully educated 2 million customers through good UX principles.

Nonso
Yellow Card Design
Published in
6 min readApr 2, 2024

In my role as Lead Product Designer at Yellow Card, I focus on enhancing and overseeing the user experience of the trading, profile, referral and Yellow Pay flows. Leading the design and ideation efforts for this project, I am excited to share how we tackled the challenge of in-app education for our two million customers.

Understanding context is important. Our customers have requested, time after time, more clarity when navigating our app. We faced the task of not simply explaining the mechanics of the app, but rather empowering users to maximize its potential. And so, the Nudge Project was born!

“One of the most important aspects of good design is that it is intuitive. This means that users should be able to figure out how to use your product without reading any instructions or trial and error. On the other hand, bad design can be highly confusing, causing users to give up in frustration. ”

Read more about the value of good design here.

Hacking the data

The year is 2022. We held a UX hackathon to prepare for the final quarter. The problem statement was very clear, “How might we educate our customers about our product to increase their confidence and trust in us”. We were split into 2 teams with a mix of Product designers, UX Writers, and a Product illustrator. We all came up with great solutions for this problem.

Leveraging what we knew.

During the hackathon, we had lightning speakers from our research team speak on the problems customers are facing regarding in-app education. There were sentiments about wanting some sort of education or guidance within the Yellow Card app.

Our lead UX researcher Ryan Jales did some preliminary research with some newbie customers on the topic of in-app education and we found out that a good number of our research candidates needed some form of guidance on the crypto industry. Requests range from needing help figuring crypto out to being a total newbie and having no idea what’s going on in the industry.

Research insights from concluded surveys

The facts were clear: our novice customers required assistance, while even some of our seasoned customers could benefit from additional support. It was evident that action was necessary to address these needs effectively.

Brainstorming on this topic was as interesting as it was challenging, the biggest hurdle we had to cross was to make sure to not explain the design or product but rather to help with some context on what we have put in place to educate them and increase their confidence and trust. Both teams presented their solutions to the panel and a winner was chosen. It was a delight seeing how everyone worked together to come up with such brilliant solutions in just a short amount of time.

Action priority matrix from my hackathon team

Divide and conquer

After the hackathon, we needed to refine these solutions for our customers. We named this “the nudge project”. I led an awesome team of 2 product designers: Derrick Tsorme handled the walkthrough section, Osagie Osagiede handled the Articles and education section, and I worked on the nudges and the home page.

First off, we set up a series of calls to brainstorm about the project requirements and I created a user flow outlining the onboarding process for our Tier 0 customers, ensuring they knew what to expect as newcomers. The flow included actions such as making a deposit, a guided walkthrough of the product basics, purchasing cryptocurrency, and understanding their account limits, among other actions.

User flows

While working on the iterated home page and nudge screen, I made sure to not forget about the existing flows of the app. My solutions had to align with existing flows, so the story added up.

Stakeholder engagement

Involving stakeholders at this point was also top of mind. I set up a series of recurring meetings with the product managers and other members of the UX team. We needed to be on the same page with all the innovations and solutions coming out so that we had their buy-in going forward.

After several rounds of feedback, I went on to work on some wireframes.

Some wireframes from the brainstorming session

Doing this gave me a clear direction of what I needed to come up with as a solution. I suggested reordering the home page to cater for these new nudges. I also suggested utilizing other areas of the app with dismissable nudges that “nudge” customers to perform transactions. An example is while on the Bitcoin wallet, it made sense to have a nudge that educated customers on how to trade Bitcoin and everything needed to learn.

The “nudge screen”, had a stack of actions new customers needed to carry out after creating an account. We had several transaction suggestions, like making a deposit, buying their very first crypto and sending money using Yellow Pay. I made sure to make this an optional page, hence the button “I want to explore first”.

Highlighting the features

The nudge screen

10 iterations later, and after several rounds of feedback, the nudge screen was built.

This screen was the very first screen customers saw after creating an account. I shaped this screen in a way that a new customer would be able to find their way around by performing transactions within their tier level and a general understanding of how Yellow Card helps them achieve financial freedom.

Screenshots from iterations 1,6 and 10

The home page

The home page was iterated to allow for new nudges and to also be as intuitive as possible for customers on different tier levels. I structured the information architecture of this page in a way that now helps new customers find their way around while ensuring existing customers don’t feel too lost with the innovation.

Screenshots of the iterated home page from iterations 1, 4 and 10

So, did it work?

It sure has. On launching this project, we have been able to get some positive feedback on conversions, especially for newly registered customers. Other funnels — like email verification, first-time deposit, first-time crypto buy, KYC Verification, etc — have also seen a positive turn in their conversion rate.

Customers are 44% more likely to complete a deposit since we launched the deposit nudge card, at a 95% confidence rating.

Customers are 82% more likely to complete a buy since we launched the get crypto nudge card, at a 95% confidence rating.

Customers are 30% more likely to complete a successful KYC since we launched the Know Your Limits nudge card, at a 95% confidence rating.

Final design iterations 🎉

Reflections, learning and shoutouts.

Reflecting on this project, I think it’s important to never shy away from feedback. Feedback from peers and feedback from other stakeholders. They helped shape this product into what it is today.

I’ve also learned the importance of asking your customers the right questions. Instead of asking feature-oriented questions like “Tell us what you need”, it’s better to rather ask “What are the problems you face when performing this task?”.

Special shout-out to every member of the UX team and the product management team at Yellow Card for their constructive feedback in bringing this to life.

Nonso Udumukwu

Lead Product Designer, Yellow Card.

--

--