Project
Graduation Project
Client
XPLCT Studios
Role
UX / UI Design
XPLCT APP
XPLCT Studios is a clothing brand that creates clothing of high quality, prioritizing comfort and fair pricing. The collections offer consumers the choice between a luxurious style and streetwear.
Each collection is unique and explicit, providing the opportunity to wear clothing both for a night out in the city and for an active day.
The problem
XPLCT has 55 retailers, with 80% of their revenue coming from sales through these retailers. These stores serve as showrooms and the face of the brand. Therefore, it’s important that the retailers showcase and resell the brand to their customers as effectively as possible.
The issue arises throughout the entire procurement process between XPLCT and their retailers. All communication takes place via WhatsApp or mail, which may feel personal but lacks professionalism and often leads to significant uncertainties regarding the procurement process. Retailers frequently have questions about delivery dates for their orders, struggle to remember which items were ordered for each season, and often pay invoices too late.
The Ask
Design a digital B2B (Business to Business) tool for XPLCT and especially their retailers that allows both parties to easily keep track of the different steps in the procurement process, improving the experience of this process. The tool should visually convey the feeling and image of XPLCT as a brand.
Customer Journey
The procurement process for both XPLCT and the retailer is divided into steps and fully mapped and visualized into a Customer Journey to gain a good understanding of this process and to pinpoint where the pain points are for both parties.
User Requirements List
1. Retailers want to be able to log in with an account on both their computer and smartphone.
2. Retailers want to receive notifications when new collections are released.
3. Retailers want an order confirmation per collection that includes an overview of which items they have ordered.
4. Retailers want to be able to easily download and share content for social media.
5. Retailers want to be kept informed about their order delivery process.
6. Retailers want to be able to do a repeat order (re-stock) of successful items.
Competitor Analysis
Research has been conducted on similar existing B2B retail platforms that offer solutions for the issues faced by XPLCT and their retailers.
As a result, the four largest companies in this domain were approached, and live demos have been scheduled with each of them to experience how their product works.
Pro's
- Platforms are available for Desktop, iPad and sometimes mobile format.
- It provides a solution to all the problems XPLCT and their retailers face.
- System is fully integrated and connected to the programs that XPLCT uses.
- There are already retailers of XPLCT using one of these programs.
- The software is updated monthly.
Cons
- The platforms are too expensive for XPLCT.
- The platforms look outdated and not pretty.
- The platforms do not offer a sense of exclusivity. They cannot convey XPLCT’s image.
- Retailers cannot schedule an appointment in the showroom.
Webshop Analysis
The B2B tool has to fully include XPLCT’s existing style. To determine what this style is, I made an analysis of their existing webshop and took inspiration from it.
The XPLCT brand identity is clean, clear, simple, and minimalist. You can find these characteristics throughout their website. XPLCT incorporates a lot of black and white, along with a light blue color from their brand palette, which is evident in the buttons on the webshop.
Photography plays a significant role on the webshop, providing a visual experience for the consumers. I will integrate this photography into the screen designs.
The design language of XPLCT is distinct, angular, and sharp, which is evident in their logo and on their website. All design elements, such as buttons, sliders, and filters, are rectangular, and there are no instances of border radius.
Style Guide
This is the styleguide for the B2B tool for XPLCT.
Screens
Home
Dashboard page where the retailer is constantly reminded of important things, such as getting a notification that new content is available or that a new collection is available in the showroom to make purchases.
Orders
Here the retailer has an overview of all his orders. He receives notifications of orders that require action. These orders are listed under “important”. Furthermore, under ‘dispatched’ and ‘delivered’ he can see which orders have already been delivered and which are still arriving.
Item Details
The retailer will find an overview of the quantity of units ordered per size by the retailer. In the footer, there is a content block displaying the total number of units and the total price of that item. The footer is sticky, meaning it remains visible at all times.
Content
A page where the retailer can find all the content per season. He can view it, download it and share it directly on social media through the app.
Stock
These are all items that XPLCT stocks and makes available for the retailer to order at any time. These are known as repeat orders. If well-run items are in danger of selling out, the retailer can re-order that item here. He can immediately see which sizes are in stock and when his order will be delivered.
Make an appointment
The retailer picks a date when he wants to visit and a time that is convenient for him.
Order details
An overview of all details of the order.
Screen Iterations
XPLCT APP
The feeling and corporate identity of the brand are fully integrated into the app, through user testing the app is perceived positively and there are no more ambiguities or problems that retailers previously encountered.
All these factors ensure that the purchasing experience at XPLCT is enhanced with the XPLCT APP.
The retailer thus gets a more professional image of the brand, and as a result sells the purchased apparel more graciously to its consumers.