Project
Graduation Project
Client
XPLCT Studios
Role
Concepting
Usability Testing
Wireframing
Prototyping
Visual Design
XPLCT STUDIOS
XPLCT is an Amsterdam-based streetwear clothing brand that sells its clothing through more than 50 retailers across Europe.
These retailers place purchase orders with XPLCT more than four times a year, which involves a complex procurement process.
I designed a B2B app for both parties so that they can keep track of this process.
The Ask
All communication takes place via WhatsApp or mail, which may feel personal but lacks professionalism and often leads to significant uncertainties regarding this process.
Design a digital B2B (Business to Business) tool for both XPLCT & especially their retailers that visually conveys the feeling of XPLCT and allows both parties to easily keep track of the different steps in the procurement process.
The First Steps: Customer Journeys
The first step is to map out the procurement process for both parties. And to pinpoint at which step there are pain points.
I gathered this information by interviewing XPLCT’s 2 founders & by sending a survey to the retailetrs and after interview 3 retailers to dive into details about their problems.
User Requirements List
Based on the pain points above, I concluded these user rquirements.
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
After 2 more interviews with the retailers, I discovered that there already exist B2B tools that they use with other brands that they sell in their store.
I approached the 4 biggest competitors and scheduled a demo to use their product. Based on this I made a pro’s & cons list.
Pro's
1 Platforms are available for Desktop, iPad and sometimes mobile format.
2 It provides a solution to all the problems XPLCT and their retai- lers face
3 System is fully integrated and connected to the programs XPLCT uses.
4 There are already retailers of XPLCT using one of these programs.
5 The software is updated monthly.
Cons
1 The platforms are too expensive for XPLCT.
2 The platforms look outdated and not pretty.
3 The platforms do not offer a sense of exclusivity. They cannot convey XPLCT’s image.
4 Retailers cannot schedule an appointment in the showroom.
Conclusion
These existing platforms answer in most of the needs of XPLCT and their retailers, but they cannot convey the brand identity of XPLCT effectively, which is very important and is what makes XPLCT unique.
Therefore I will focus on designing an application that can reflect the brand’s essence during this project.
Solution
- Through an app: retailers get notifcations about the status of the delivery of their orders.
- They can see what they ordered and adjust that and place new orders to re-stock sold out items.
- They can also easily view and download new content, that they can use for their own social media.
- And they can make an appointment to visit XPLCT’s showroom.
Iteration process
The orders-page
This is the page where retailers can keep track of all the clothing they ordered.
In the initial stages, retailers found the order-page nice, but still struggled to distinguish orders from each other.
XPLCT wanted a more visually appealing design for the notification, which they felt was too subtle in its blue tint.
In response, I added collection ambiance photos to each order, helping retailers identify collections at a glance and reducing search time.
I intensified the notification’s blue color to match their website’s shade, improving visibility and consistency. Additionally, I made the delivery date text bold to enhance its prominence.
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.
Simple & Minimalistic Style
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
Photography plays a significant role on the webshop, providing a visual experience for the consumers. I will integrate this photography into the screen designs.
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 availble in the showroom to view.
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”.
Item Details
The retailer will find an overview of the quantity of units ordered per size by the retailer.
Content
Content page where the retailer can find all the content he needs per season. Content for their webshop or that they can use for social media. He can view it, download it and share it directly on social media through the app.
Stock
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.
Style Guide
Based on the webshop analysis and research of XPLCT as a brand, I created this style guide to determine what the app will look like.
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 they can sell the purchased apparel more graciously to its consumers.