Albertsons
Product Designer
May '22 — Nov '22
User
The primary user for this experience is our core shopper, who plans their shopping list ahead of time, and tends to pick up their order after work. The day of, they want to be alerted to when they can expect their order.
Pain Points
- Prior to this experience, users did not interact with the app after they completed their order, so they didn't know when the order would be ready.
- Without knowing when their order would arrive, users had to contact our customer support center. Leading to wasted resources dedicated to answering "Where is my order?" calls.
Approach
Identify the core touch points in the post purchase experience. Then use notifications to bring the user back into the mobile app, where they can see the net new Order Details page, and the Progress Tracker.
- User Research: in a recent user survey, we saw an increase in "Where is my order?" calls to the call center, as well as a decreased satisfaction in how we communicated when they could pick up their order.
- Competitive Analysis: I researched existing patterns to understand what the key touch points were, and how often we should notify users without overwhelming them.
- Iterative Design: produced rapid iterations for stakeholder validation.
- Responsive Versioning: created 100+ screens for multiple breakpoints.
Challenges
- High Traffic: The new tracker was implemented on high traffic pages (Home, Order History, and the net new Order Details Page). It was important to quickly communicate the change to stakeholders, and adjust the design based on their use cases.
- Working within a Design System: I utilized the existing design components and guidelines to design the Order Details page.
- Contributing a Component: I worked across pillars with different design teams to align on the style of the Progress Tracker. I needed to take into account all the statuses each team wanted to flag, and align the style with the Pillar's existing guidelines.
- Product Ownership: Each stakeholder had influence over the copy, which made it important to quickly iterate and present for alignment.
+ 676%
By increasing post purchase traffic, we increase the chance users are more informed about when their order will arrive.
- 42%
With the new Order Details page, users are more informed, leading to decreased call center calls.
100+
The progress tracker was adapted across all Order Status touch point and edge cases and designed screens for Mobile, Tablet, and Responsive Web Breakpoints.
I explored different designs that highlighted each order status presented by stakeholders. It was important to streamline the design, to preserve real estate on information dense pages. (Top: Order details page, Bottom: Home Page)
