YC NAVIGATION REDESIGN
Creating ease of navigation on Yellow Card's website following B2B pivot over B2C
my Role
I led the redesign to the website navigation, working with the product and UX team
TEAM
Team of product, UX and and engineering.
YEAR
2024
TOOLS
Figma, Lottie, Storybook
overview
Following Yellow Card's Series C $33M funding and a pivot to B2B over B2C, there was the need to redesign our navigation and refresh our pages to give visitors clear direction on who and what we are
scope
UI/UX, Web Design, Interactive Prototyping, User Research, Visual Design, Design Thinking
Move over B2C, businesses are the new target
Today, Yellow Card works with about 30,000 businesses across Africa and internationally, helping them with payments and treasury management, primarily through stablecoins. At first glance, Yellow Card’s focus on businesses might seem to deviate from its original plan to make crypto accessible to the masses. However, we are still steered in that direction but are going about it differently.
what problem are we trying to solve?
We spoke to our internal leadership team to get insights on the direction the company is moving and how we can prepare the website for that pivot. Looking at the Yellow Card website, we are more B2C-focused and showing more of the value offering specific to retail customers.If we want to position ourselves in the market with our B2B products, we would need to redesign our navigation to show that.
b2b vs b2c
Being that Yellow Card started as a B2C company, the navigation content is quite heavy on that and needed a way to separate B2C from B2B. We came up with using the term Personal & Business to categorise them better on the website navigation while condensing all the hierarchy of tabs and information items under it.
DATA-DRIVEN DESIGN
We conducted research internally using the tree testing technique to get feedback on the new proposed navigation for a few reasons:
- To gather insight into people’s mental models of personal/business categories of the website to see how they would naturally think about exploring the navigation experience.
- To analyze and observe users interacting with the personal/business pathways to accomplish a task, so we can make design improvements to the existing information architecture of the website based on how they perform.
- To get a clear view of what real users expect in the navigation functionality of the website experience and how these layers of information are in hierarchy from primary to secondary to tertiary levels, and to use this as a starting point for designing a better website experience.
We got pretty good feedback from the test, as most persons did know how to navigate and get to the destination. For others that took more time, we followed up and understood that they were just playing around to understand the tool.
REdesigniNG EXISTING B2B PAGES
To further solidify the company's stance on B2B direction, we designed a new landing page for the "Business" landing page and also had to redesign existing B2B pages to ensure brand uniformity, as the B2B brand had some specific differences from the B2C.
payments api
Using our Payments API, connect your customers to local fiat on-and-off ramps solutions across the 20+ supported African countries .
business widget
Using the on & off ramp widget, customers can buy and sell cryptocurrencies using localised deposit and withdrawal methods across Africa.
commercial trading
This gives high-volume trading individuals and businesses access to commercial trade liquidity and transaction solutions.
PUTTING IT ALL TOGETHER
The navigation was redesigned, and we have a well-structured information architecture of content on the website navigation that speaks to both our retail customers (Personal) and high-volume businesses (Business).
retrospective
In general, there is the need to be thoughtful about the goal of a navigation redesign. Design has to be backed by data that have validated hypotheses from a well-structured content audit.
This project was a great one for me as I had the chance to improve my design thinking by looking holistically at the roadmap of the company and how we can position the website to picture that, being that it is mostly the first point of contact to potential customers and clients, be it B2B or B2C.
.png)