Redesigning the Shein order tracking experience
Role: UI/UX Designer
Timeline: 4 Hours
Role: UI/UX Designer
Timeline: 4 Hours
As a user, I faced a significant frustration trying to track an undelivered order on the SHEIN app. The process was confusing, time-consuming, and left me feeling stuck at several points. As a designer, I couldn’t help but think to myself, “This could be so much better”. I saw a problem I knew I could fix.
It was a great opportunity to apply what I had been learning for weeks; rethink and redesign the experience, making it clearer and more user-friendly. I applied principles from Don Norman’s The Design of Everyday Things, a book we’ve been reviewing in my Human-Computer Interaction class, to address these usability issues and create a smoother, less stressful journey.
When I tried to track my order, I encountered several issues that made the experience unnecessarily difficult:
Unclear Information on the Order Details Page:
The page included a large, fixed WhatsApp subscription announcement that couldn’t be dismissed. It distracted me from finding the information I needed.
Also, There was so much happening on the page that I struggled to focus on the key details of my order.
Misleading Link on the Track Order Page:
The app had a link labeled “View detailed information for USPS.” As a user, my mental model told me this would lead to more details about my order. Instead, it only showed the shipping company’s phone number, leaving me disappointed and confused.
Limited Visibility into the Order Process:
I couldn’t tell where my order was in the delivery process because the app didn’t provide a clear visual timeline or enough status updates.
No Options for Undelivered Orders:
When my order wasn’t delivered, I couldn’t resolve the issue directly in the app. I had to go through a stressful process of contacting customer service, which took much longer than it should have.
The first thing I did was to Improve the Order Details Page.
As a user, the fixed WhatsApp subscription banner felt intrusive and irrelevant. As a designer, I knew that clutter detracts from the user experience.
Before:
The page was visually overwhelming, with the WhatsApp banner competing with critical order details.
Before 1-A crowded Interface
Before 2
After my touch:
Solution
I added a simple close button to the WhatsApp subscription announcement, so users can dismiss it if they’re not interested.
I simplified the layout by focusing on what really mattered: the item purchased, order details, and clear recommendations.
Personal Takeaway: Small details like a dismissible banner can make a big difference in reducing frustration and improving usability.
After- A simpler Interface
After 2 - An option to dismiss the subscription offer
Next, I redesigned the Track Order Page.
When I clicked “View detailed information for USPS,” I expected to see more about my order’s status. Instead, I was met with the shipping company’s contact details, which was completely unhelpful. This mismatch between the label and the action felt misleading and broke my trust in the app.
Before:
The link didn’t match my expectations and forced me to navigate outside the app for more information.
Before-Not what I expected that link to do???
After my touch:
Solution
In my solution to this usability issue, that link would actually lead to the USPS website. But to save the user all that stress, my design makes it possible for a user to track their order directly on the app they placed the order. Frequent updates would make that work.
The current app has tracking information, until there's a problem with your order-and then you feel stuck.
The improved breadcrumbs visually showed each stage of the order journey, so users can instantly understand where their order is-no matter what happened to it.
Personal Takeaway: Mismatched labels and actions create unnecessary frustration. Updating this link to match users’ mental models dramatically improves trust and clarity.
After- Up-to-date tracking information
Also, I addressed some of the issues faced in a sitiation where an order wasn't delivered.
When my order wasn’t delivered, I felt helpless. I couldn’t schedule a redelivery or cancel the order within the app, which added to my frustration.
Before:
There were no clear options to resolve delivery issues directly on the app.
Solution:
I added a direct link to schedule a redelivery or cancel the order on the app. This gives users immediate control over their situation without needing to contact customer service.
Personal Takeaway: Empathy as a user helped me design practical solutions that empower others to resolve their issues quickly.
This redesign was personal for me. As a user, I felt the frustration of a poorly designed experience. As a designer, I took this opportunity to apply Norman’s principles to improve the app:
Mapping: The updated link labels now align with user expectations.
Feedback: Breadcrumbs give clear updates on the delivery process.
Affordance: The redelivery and cancellation links make the next steps obvious and actionable.
This experience reminded me that the smallest design details can have the biggest impact on a user’s overall experience.