CASE STUDY
-
LOGISTICS & E-COMMERCE
Launch of the 'Shipments' module to replace Trello for managing bulk shipments
Overview
Unineed is an UK-based online fashion and beauty retailer offering products from over 450 brands ranging from skincare to make-up accessories. XTOPUS is the internal dashboard application used to manage the operations for Unineed such as facilitating shipments between warehouses, third party marketplaces and consumers. Additionally, the software is also used to manage the daily e-commerce operations such as buying, selling, marketing, customer service, etc...
Team
Me (Product Designer) + Product Manager + Engineering team
Timeline
Sept. 2023 - Present
Involvement
Owning end-to-end product design process from user research to UI handoff for new & existing features - turning complex data into actionable insights
Tools
Figma, FigJam, Jira, Miro, FigMake, ChatGPT, Android Visual Studio, Microsoft Clarity, Google Analytics, MouseFlow, Lyssna
Metrics
No. of shipments, value of goods shipped, etc
What didn't exist?
Before I was hired, Xtopus was a tool built by the developers out of prebuilt templates and UI libraries, and improvements were made, bugs were fixed based on the feedback from users over a Teams group chat. The software was usable, but there were a lot of underlying issues, inconsistencies in the user experience. Also, there was not a clear goal or defined metrics to measure the work efficiency or cut down the extra time spent on repetitive daily tasks.
What I took responsibility for?
I was hired as the designer responsible for making things look better, but slowly I have become the voice of our users, an advocate for making their tasks a little easier. I have set up new design systems, connected the platform to UX research tools, defined metrics to assess the success/failure of features, redefined the interaction principles, conducted usability testing sessions and much more, as well as implement a small feedback loop of thinking, making and testing.
What changed?
A professional internal application that is personalised, AI-driven, user friendly and looks as well as works effortlessly. Xtopus is now ready to be onboarded by small and medium scale businesses to manage all of their e-commerce operations from one place.
What is the problem? (from an operations standpoint)
- Lack of a platform for marketing & warehouse teams to create, track and maintain the transportation of shipments between different warehouses (currently using Trello)
- Unable to measure the efficiency of the overall shipment process
- No single place to monitor all the data related to shipments
- A conventional way of managing shipments not allowing the business to scale up further
Below are a couple of screenshots of the Trello board used to currently manage Shipments
What is the proposed solution?
An inbuilt Shipments feature within Xtopus to create, track and maintain different types of shipments - B2B, Supplier & Inbound Shipments
01
RESEARCH
-
Business Goals
-
User needs, pain points & frustrations
-
User workflows, edge cases & constraints
-
User Journey Maps (Existing)
-
User Journey Maps (Proposed)
02
IDEATE & PROTOTYPE
-
Sketches & Wireframes
-
Low fidelity Testing
-
High-Fidelity UI
-
Prototyping & Micro-interactions
03
ITERATE & REFINE
HANDOFF
-
Changes to the prototypes
-
UI handoff, Demo videos, FigJam Documentation
LAUNCH
04
TEST & REFINE
-
Usability Testing, 1v1 interviews
-
Further changes to UI
Business Goals
- Automate the shipment cycle as much as possible
- Reduce human error made while using Trello boards
- Build validation rules
- One system with full visibility instead of scattered Trello boards
- Consolidated source of truth
- Data stays in the company's ecosystem
- Support higher volume as the company grows
- Sync stock live to marketplaces
- Prevent overselling or underselling
- Auto-adjust stock on dispatch/receiving events
- Better Analytics & Decision-Making
User Research
Started off by understanding the current way things are being operated by the warehouse, marketing and buying teams to facilitate shipments between our own warehouses and also between our warehouses and other marketplace warehouses (Amazon, Tiktok, etc). It was done by one-on-one conversations with users from the warehouse, buying and marketing teams.
Proposed User Flow (On XTOPUS)
Iteration - 1
User Feedback
Final Iteration
🗣️ Latest Feedback from users:
1. Have the ability to filter by destination country. Each member should be able to filter to see only their shipments for their respective countries
2. Amazon FBA ID's should be visible on the main screen alongside other key info such as Shipment name, tracking numbers, shipment status etc. We then need the ability to search by amazon FBA ID - this is what the team currently pull from accuracy sheets to search and find shipments on amazon when checking they have arrived as expected so this should translate to Xtopus
3. Have the ability to search by tracking number.
4. Currently doesn't look like there is an option to close shipments going to ESWH, so we will need the ability to do this.
5. Should be a status for both 'closed without error' and 'closed with error' where we can filter for shipments under these status'
6. When closing a shipment - wording for this is currently 'was this shipment received' with an option for yes or no, currently we have to click no in order to report discrepancies. Should be reworded to 'was this shipment received with error' and progress from there
7. When sending a multipack product, XT is currently pulling stock from the single master sku as opposed to the child SKU bundle. For example if I want to send 100 '3 packs' of marvis, I should be able to select the bundle sku and enter 100 when creating the shipment, whereas right now we are having to select 300 units of the single and then apply this to a bundle. This is also causing extra steps when reporting discrepancies:
E.g. Amazon received 97/100 3 packs, but when reporting this on XT the end user has to calculate how many singles are missing, its not necessarily difficult but just adds extra steps which we could avoid. Additionally, when we enter how many units were received with discrepancy, XT should be able to automatically calculate how many units are subsequently missing, rather than the user entering this as well.
8. Much smaller issue here but when clicking the 'actions' button, you cannot click anywhere on the screen to get rid of the filter dropdown, you have to go back to action button and click again which is a bit of an inconvenience
9. Amazon FBA warehouse currently is not in the list of filters for destination, although this will not matter as much once we can filter by destination country.
✅ 500+ shipments created
✅ Shipments of value more than £50,000 transported
✅ Good response and feedback from users
✅ 11/11 business goals achieved
-
Communication ≠ Comprehension
A lot of complex workflows caused a lapse in having a shared understanding with the engineering team, that works from China as they are all native Chinese speakers and not very comfortable with english. But, over the course of the launch of this module, a lot of ways to handoff have been tried (Figma prototypes, sticky notes, figma comments) and ended up using FigJam as the final handoff documentation explaining every workflow in detail.
As a designer, this has taught me that it is my duty to not just communicate, but ensure thoroughly the developers understand the intricate details of a handoff.
-
When it doubt, sketch it out
I have gone back to the whiteboard several times while iterating on this module, and doing crazy 6s on paper has given me the best ideas especially with a time constraint. Doing the basics right, so that the rest follows automatically.