Figma
FigJam
2023

From Setback to Strategy: 

Crafting Distinct B2B and B2C Experiences

From Setback to Strategy: 

Crafting Distinct B2B and B2C Experiences

Duration
7 months
My Role
Associate UX Designer
Team
Creative Director, 2 Senior UX Designers, UX Researcher

Project Overview

After a redesign stalled with a previous agency, we stepped in to deliver two distinct yet cohesive B2B and B2C experiences for a well-known name in design and tech education, all under tight timelines and high stakes. This created pressure to move quickly while reassuring the client that their needs would be heard and the work would meet a high standard. The site needed to reflect their expertise, remain usable and accessible, and convert both prospective students and business partners. With the project already behind schedule, delivering work that landed right the first time was just as important as the design itself. What we delivered was a strategic, visually dynamic digital system built to perform.

Research

We kicked off the project with a competitive analysis, reviewing visual hierarchies, calls-to-action, branding, and layout patterns used by competitors. This helped us understand both industry standards and opportunities for differentiation. Our findings included:

Many competitor sites overloaded users with information without clear pathways.
Photography and branding elements were often under-leveraged.
There was a need to better guide users to conversion points, especially around lead generation and course discovery.
The Challenge

During our initial research presentation, we noticed signs of impatience from the client. After a conversation with our internal team, we realized that they had likely heard much of this information from the previous agency. While the research was still valuable to us, it became clear that the client was eager to move forward and see tangible process.

The Solution

We pivoted quickly by proposing design discussions using FigJam as a middle ground. This allowed us to initiate visual exploration early while keeping expectations grounded. We made it clear that these were just explorations, not final solutions, which helped manage pressure on both ends. It gave us a better sense of their preferences while continuing to build understanding and alignment.

Ideation and Concept Development

We hosted collaborative design discussions using FigJam, starting with the homepage to establish the tone and visual direction. Two initial concepts were presented:

Concept A: Full-color photography, dynamicc graphics, bold color blocking
Concept B: Black-and-white photography, more white space and scale play, imagery breaking through containers

The client preferred a blend - the color blocking and dynamic graphics of Concept A, combined with the cleaner, more editorial photography approach of Concept B.

Key Features

A key challenge was making the B2B and B2C sites feel distinct while maintaining a cohesive brand system. Initially, we differentiated primarily through color and imagery:

B2B

B2B used a restrained palette of red, black, and yellow on a white or cream background.

B2C

B2C incorporated a broader range of tertiary colors and more dynamic imagery.

However, despite these visual differences, the client felt the distinction wasn't strong enough. To push the B2C site further, we replaced the cream background with a light grey from their design system. This seemingly simple change created a noticeable tonal shift. The grey allowed the brighter tertiary colors to pop and gave the B2C site a more energetic, modern feel.

Another challenge was visualizing a dense section n financing options for the B2C side. The content was copy-heavy, and early explorations using a card-based layout felt awkward on desktop and too bulky on mobile.

We shifted to an accordion design, which allowed us to preserve clarity without overwhelming users. It also gave us an opportunity to play with color while reusing an element already approved from the B2B site.

Final Design

The final designs delivered two distinct experiences for B2B and B2C audiences while maintaining a cohesive brand identity throughout. Differences were intentional but nuanced — enough for each audience to feel the page was built for them, without the two experiences feeling disconnected. Research informed every decision, from the placement of trust-building content and tuition information to the use of photography and design elements that helped users process complex information with ease. Industry best practices were woven in throughout, positioning the client as a credible authority in the topics they teach.

Reflection

This project taught me that strong UX work isn't just about the design — it's about reading the room, adapting your process, and keeping momentum across a complex web of stakeholders and timelines.

Key Takeaways

💡

When the client grew impatient with research, I learned to pivot into visual exploration without abandoning the foundational work — meeting them where they were while still protecting the integrity of the process.

💡

Small design decisions carried more weight than I expected. Shifts in background color and content tone were enough to create two distinct audience experiences, which reinforced for me how much nuance matters in visual differentiation.

💡

Working across a large internal team while managing diverse client voices pushed me to get better at balancing feedback, clarifying decision-making, and knowing when to hold a direction versus when to adapt — skills I'll carry into every project going forward.