Redesign for a Wholesale Fashion Marketplace
Imagine you are buying a pair of shoes on the web. You need to choose a size and color. You need to select the correct width and don't forget about the material. Do you want your shoes to be in leather, suede, or 3D air mesh? Then please choose the type of insole and outsole. And last, but most important: indicate the delivery address.
Feels like too much trouble, right? Now multiply all of the steps above by a hundred.
Now, let’s say you are a shoe retailer that orders thousands of pairs from dozens of brands. For every model, you pick sizes, numbers, configurations and materials. Not to mention you are to arrange delivery from numerous brand warehouses to your own storage rooms. It’s a bit… Complicated.
For the JOOR wholesale management platform, Eleken UI/UX agency had to turn the mind-blowing cart checkout process into a tolerable experience.
Services
Web App design
UI/UX design
JOOR’s checkout process worked seemingly well. You, as a retailer, could pick an item, and then indicate in a table which colors and sizes you want to order. Good enough if you came for cotton T-shirts.
But what if you want to order sneakers that are distinct not only in size and color, but also in width? What if a dress item can be sewn in either silk or chiffon? Not to mention wedding outfits that can go in ten different configurations.
The old cart UX wasn’t flexible enough for most platform users to achieve their goals. Eleken’s task was to create a new cart concept to include all previously missed item variants but without overcomplicating user experience.
So we set to work, starting with the discovery phase.
JOOR is a fashion marketplace that connects brands and retailers globally to enable digital order management, assortment planning, and wholesale buying. JOOR is swimming in the blue ocean. Namely, the company offers a pretty unique product ahead of competitors.
On one hand, this is good for the company. It can skim the cream off its audience without being distracted by a struggle for market share.
On the other hand, it’s a pioneer’s fate to deal with unexpected problems and look for unparalleled solutions.
JOOR team members noticed that their cart checkout process doesn’t match users’ requests and needs to be redesigned. As no obvious solution was available, JOORM partnered with Eleken, an experienced UI/UX agency, to design a new checkout constructor from scratch.
Let’s get the redesign started
Our designers examined every app screen and marked the questions that have arisen during their investigation. The questions became the basis for explanatory workshops with JOORM’s Product manager.
Once we revealed how every bit of the product works, we wanted to figure out what users were struggling with.
It turned out that JOOR’s sales representatives lost deals due to cart limitations. When potential customers noticed that the platform doesn’t support the functionality they need, they started questioning the product’s value.
What is more, existing customers were forced to be creative with the platform to make it work for themselves. For instance, they put additional shoe colors marking them Red (Wide) and Red (Narrow) to at least somehow get another item dimension.
The order process could definitely work better. So, we collected all the missing product dimensions and started thinking of a new cart constructor concept.
To specify a wealth of information without making shopping overwhelming, we divided the order checkout process into three tabs:
Overview
The Overview tab shows the description and images of an item, available product variants and all the other details. To start placing an order, the user should move to the Product configurator.
Product configurator
The Overview tab shows the description and images of an item, available product variants and all the other details. To start placing an order, the user should move to the Product configurator.
Quantification
The next step in the ordering process is the Quantification tab, which took the best of the old checkout interface. Quantification is a table, where retailers can specify the number of items they need in each color, size and width they have selected on the previous screen.
The third tab is also responsible for the delivery details. Here a user chooses the transportation dates, a warehouse of dispatch and a place where items should be delivered.
Getting a better sense of where things stand
Figuring out the solution
When after several design iterations we had a checkout concept approved, our designers started with user interface shaping.
Our aim was to make complicated multistage processes intuitive, and the visual language provides critical input to make an interface easy to use. Our designers used color schemes and contrast, buttons and sizes to make the user experience more obvious.
Since JOOR was an established company, they already had their design system — a set of standards that helped us to make the checkout visual experience consistent with the rest of the app. We gladly used JOOR’s design system. We even helped to move the system from Sketch to Figma and enhance it according to Figma’s specificity.
Eleken have been working in thespecialize in UI/UX niche for SaaS apps since 2015. That’s why when clients need for extra design expertise to solve UX problems, our expertise allows us to find optimal solutions.
Looking to design or redesign an unparalleled SaaS app? Eleken agency has the stomach for tackling complex UX problems.
300 (#E3F9FD)
400 (#9EE4F0)
600 (#0CC0DE)
800 (#008BAD)
500 (#5C7284)
700 (#40515D)