Serai 

A B2B web platform helping

buyers trade with suppliers

[Product Design]

TEAM 

Myself, PM, engineer and marketing team. 

TIMELINE 

Dec 2021 - Mar 2022

ROLE

Product Designer
 

CHALLENGE 

Serai is a web platform that allows SMEs in the apparel industry to connect, trade and build relationships with new suppliers globally in order to grow their business. How might we support businesses manage their orders on the platform in order to increase buyer-seller interactions and the number of confirmed orders? 

SOLUTION 

I led the end-to-end design of a new order management feature for the responsive web platform.

IMPACT

Increased Buyer-Seller Interactions by 22% and increased potential GMV. 

I led the design for this project for 4 months and collaborated closely with a Product Manager, Product Analyst, Engineers and our Marketing Team.

Design process

RESEARCH

Domain research of the apparel supply chain and B2B purchasing behaviour highlighted the negotiation in the process of purchase orders

Domain_research

My user interviews with industry experts and existing users helped uncover key
insights and pain points in sourcing with new suppliers online

Four key validated needs

check-1-1

 

Insight 1

Both parties will offer a price before consensus 


check-1-1

 

Insight 2

Buyers seek confidence and accuracy for delivery. With one buyer stating, “When will it actually be at the door”

check-1-1

 

Insight 3

Allow sellers to standout showcase their unique
capabilities. For example they might want to showcase special knitting machines or clean production lines.

check-1-1

 

Insight 4

Buyers test the water before diving in: Purchasing a small quantity first, before repurchasing larger
MOQs. 

Working alongside our internal analytics team illustrated the business opportunity to increase conversion of draft orders and track the potential GMV of each order

DALL·E 2026-02-19 18.25.43 – A simple colorful dashboard sketch illustration for a UX portfolio. Centered desktop screen showing a clean, minimal analytics dashboard. Hand-drawn s

 

What was the percentage % of offers accepted

(# of accepted orders / # of total enquiries)

 

How many times did draft orders need to be edited?

Mean & median of the # of times draft orders were edited

 

What was the response rate from buyers?

 Breakdown of enquiries with
replies and without replies

DESIGN

Design Iteration #1 revealed unclear CTAs within an order and the negative business impact of specific buyer or seller permissions

  • Left mobile screen: Buyer has permission in payment card only to change payment status and upload proof.
  • Right mobile screen: Seller has permission in shipment card only to change shipment status and upload proof.
Design v1

Design Iteration #2 revealed high tech effort for the stepper, which
raised problems for orders with multiple stage payments 

  • Buyer had permission in both payment and shipment card in order to mark a status update on the order.
Design v2

I conducted unmoderated usability testing with the mobile prototype with 10 buyers and 10 sellers using the platform Maze.

Image_by_DALLE1

Hypotheses:
• Both types of users can distinguish an unconfirmed or draft order with the blue label
• Buyers can use the CTA to mark payment
• Sellers can understand an order has been paid with label change and buyer payment details
• Seller can find where to upload their shipment document

Heatmap

Usability testing revealed misclicks in orders and a misunderstanding of the order status.

Key Findings:
40% of participants clicked into orders that were not in
draft status
50% of sellers were not sure that their order had been
paid. One user stated “Didn’t notice any change, sorry”
• Buyers could find the CTA to mark payment, but
language was not clear.
High number of misclicks for sellers trying to indicate
their shipment status and upload document

The final design encompassed findings from user testing and reduced cognitive load

  • New visual for locating payment and shipment statuses.

  • Simplified flow for marking as paid. Attachment is pop-up and optional.

  • Clear actions. Buyer has primary CTA for payment and seller has primary CTA for shipment.

Final_mobile_flow

I created all final UI design assets to include all instances of a card based on the user action, for development. 

  • Creating all responsive UI card options for Buyer & Seller.
  • Walking through the final UI with our engineers and ensuring clarity on components, colour and logic.
  • Working with analyst to set up tracking of CTAs.
Card components
Final_screens

Refelection 

Challenging learning experience of gathering user insights to create a digital experience of sourcing and managing orders to grow your business, in an intuitive manner for users to achieve their jobs to be done.

Next steps: Working closely with PA & PM, as well as internal analytics team to track the usage of the feature and uncover areas for optimising the user experience. Working with PM to discuss the next enhancements including more filter options to help find orders. Working with other product team to map out new in-platform payment flow for specific users.
 

Selected Works

HulaUX Research & Design

MonitairUI & UX Design

Apply GradUX Design

Serai platformUX Design

B2B Healthcare platformProduct Design

 

________

Amrita Sakhrani. All rights reserved 2026. 

LinkedIn | Dribble