TradeSys – UX/UI Design for a B2B Reverse Marketplace

End-to-End Product Design for a B2B/B2C Marketplace

TradeSys is a B2B/B2C reverse marketplace designed to connect buyers with suppliers in the industrial supplies sector. The platform enables users to create Demand Requests (DRs) for product quotations or general inquiries, streamlining the interaction between buyers and suppliers.

As a Senior UX/UI Product Designer, I was responsible for defining and delivering a scalable, user-friendly experience that simplified the request and response process. I worked closely with Business Analysts and developers to create a system that was both intuitive and technically feasible.

At a Glance

UX/UI RESEARCH ACCESIBILITY DESIGN SYSTEM B2B / B2C MVP

Proposed Design System 1/4
Proposed Design System 2/4
Proposed Design System 3/4
Proposed Design System 4/4

Problem Statement

The project faced three major UX/UI challenges that needed immediate attention:

1. Missing Design System & UI Guideline

During the pre-sales phase, the project was assumed to have a pre-existing design system and UI guidelines. However, the available assets were not functional, requiring a complete redesign from scratch.

2. MVP Scope Expansion

Throughout development, the client frequently requested new features beyond the initial scope, risking project delays. The challenge was to prioritize essential functionalities while documenting future features for later iterations.

3. Organic User Growth Strategy

TradeSys needed a way to expand its user base without high acquisition costs. The platform’s growth depended on an efficient invitation flow that encouraged suppliers to bring in their contacts.

Our Approach

To tackle these challenges, we implemented the following strategic solutions:

1° Design System
Implementing a Scalable Design System
- Adopted Material UI to accelerate the development process.
- Fully customized the design system to enhance accessibility and align with TradeSys branding.
- Presented three different UI proposals to align expectations with stakeholders.
2° MVP
Structuring the MVP Scope
- Defined clear MVP boundaries, focusing only on essential features.
- Designed future features (e.g., messaging system, notification center, dashboards) as mockups and added them to the backlog for later phases.
3° Growth
Enabling Organic Growth
- Designed a user invitation flow, allowing suppliers to invite their own network, leading to organic adoption of the platform.

1° Design System
Implementing a Scalable Design System
- Adopted Material UI to accelerate the development process.
- Fully customized the design system to enhance accessibility and align with TradeSys branding.
- Presented three different UI proposals to align expectations with stakeholders.
2° MVP
Structuring the MVP Scope
- Defined clear MVP boundaries, focusing only on essential features.
- Designed future features (e.g., messaging system, notification center, dashboards) as mockups and added them to the backlog for later phases.
3° Growth
Enabling Organic Growth
- Designed a user invitation flow, allowing suppliers to invite their own network, leading to organic adoption of the platform.

1 2 3

Outcomes

1. User Roles & Demand Request Flow

The UX strategy focused on three key user roles, ensuring an intuitive experience for all:

Super Users → TradeSys employees managing the platform.
Account Admins → Supplier organizations managing their company profiles and teams.
Accounts (Standard Users) → Buyers who create Demand Requests (DRs) to engage with suppliers.

2. Core Interaction Flow: Creating Demand Requests (DRs)

Users could create two types of DRs:

Quotation: Requesting price details from multiple suppliers.
Information: General inquiries about products, logistics, or compliance.

Visibility options:

Public: Open to all registered suppliers.
Private: Only accessible to selected suppliers.
Direct: Sent to specific suppliers.

Automated notifications ensured suppliers were alerted immediately about relevant DRs.

Enhanced User Experience

The UX/UI improvements resulted in a seamless and intuitive experience:

Simplified onboarding → Clear flows for account creation and supplier invitations.
Easy navigation & filtering → Buyers could quickly find suppliers and manage DRs efficiently.
Consistent design system → Material UI customization ensured accessibility and a cohesive look & feel.
Automated supplier notifications → Reduced friction in communication between buyers and suppliers.

1 2 3 4 5 6

BeforeAfter

Achievements

The TradeSys MVP was successfully delivered within 7 months, meeting all planned timelines. A fully customized design system was developed, enhancing scalability and accessibility, ensuring a seamless and future-proof visual foundation. The UX for Demand Requests (DRs) was streamlined, making the process more intuitive and increasing adoption rates among both buyers and suppliers. Additionally, a future-proofed backlog was structured, with new features designed and documented for potential future implementation. Lastly, a growth-driven UX strategy was implemented, leveraging a supplier invitation system that significantly contributed to higher user adoption without requiring additional acquisition costs.

Significant Benefits of the Project

40%

Reduction in dev time using MUI

70%

Enhanced user adoption

Backlog new features

Growth

Driven by supplier referrals