The challenge was to simplify and streamline the ‘My Orders’ and ‘Order Detail’ sections, making them more intuitive and action oriented to minimize user frustration. 1: Cluttered and Text Heavy UI: The older layout presented orders in a plain, linear format with minimal visual hierarchy. Dense text blocks and repetitive information made it hard for users to scan quickly or locate specific actions so we introduced a modular card based layout with distinct sections for each order. The product thumbnail, delivery status, date of placement, and key CTAs (like rate/review or download invoice) were clearly grouped. This not only reduced cognitive load but also made each card independently actionable. 2: Key Actions Were Hard to Discover: Important actions such as “Track Order,” “Reorder,” “Exchange,” or “Cancel” were previously shown as small blue links buried in text, often missed by users or mistaken for static labels. We transformed these into consistent buttons, placed contextually either on the order card (for quick access) or within the order detail view. Reorder and Exchange are now visually prominent. 3: Lack of Visual Delivery Progress: Users had no clear visual cue on where their order stood in the fulfillment pipeline. Simple status labels like “Delivered” or “Cancelled” were shown, but without context or progress feedback. We implemented a horizontal delivery tracker showing clear steps Confirmed, Shipped, and Delivered accompanied by color coded status chips which made the process transparent.
 4: Disconnected Sections for Shipping, Payment, and Items: The order detail page previously had a table like layout where product information, shipping details, payment summaries, and refund details were disconnected, with no visual flow or hierarchy. In the new design, all related information was reorganized into collapsible, card styled groups. Sections like “Tracking,” “Order Summary,” “Shipping Address,” and “Payment Summary” were given headers and spacing to improve readability. 5: Mobile & Desktop UI Were Inconsistent: The mobile experience had outdated UI patterns, small touch targets, and inconsistent spacing. Desktop, while more expansive, didn’t feel modern enough. We unified the design language across platforms, implementing an better spacing system, larger type scale, color coded tags, and component behavior. This ensured the same mental model and user familiarity whether the user was on a mobile device or desktop screen.