Overview
Shop is an e-commerce app that allows users to discover brands, make purchases with one-tap checkout, and track orders in one place. It focuses on creating a seamless, and trustworthy shopping experience across devices.
Ecosystem
How does it work?
Shop is Shopify’s consumer app that connects directly to Shopify merchants to enable seamless shopping, checkout, and real-time order tracking in one place.
The problem
Drawing from our own experience with the Shop app, our team identified friction around item and feature discoverability. This led us to conduct research to validate and better understand these challenges and assumptions.
The Task
Our team divided in design and research. I focused on design while supporting research facilitation, leading design ideas brainstorming sessions, sketching, wireframing, prototyping, and usability testing in an iterative cycle.
The Research
Our team conducted a task analysis and 10 usability studies to understand how people use Shop and how its core features function.
Learn more the pain points uncovered in the research deep dive.
Scenario
Based on our findings we prioritized three key areas: Search, Browse & Purchase capabilities, order tracking and management, and Shop Cash feature discoverability.
Navigation Bar
Before
The navigation design hindered discoverability of Shop Cash and account details due to limited exposure and ambiguous iconography.
After
The redesign improves discoverability by giving Shop Cash a fixed, prominent placement, introducing a global search experience, and clarifying access to account features and cross-platform tracking through clear labeling.
Search, Browse & Purchase
Before
The landing page lacked visual hierarchy and timely content to engage users, provided minimal essential information on product tiles, and made category-based product suggestions difficult to access.
After
The redesign introduced a banner to highlight seasonal products and promotions, expanded vertical space on product tiles to display essential product info, and introduced additional categories to the landing page.
Track & Manage Parcels
Before
Order details lacked clear distinction and labeling, and users had no ability to customize or search their order history.
After
The redesign improves order clarity by visually distinguishing shipment status and adds filtering and search to give users greater control over their order history.
Find & Use Shop Cash
Before
Shop Cash suffered from poor discoverability and learnability, with inconsistent messaging and visuals that made it difficult for users to understand its benefits and how it works.
After
The redesign introduces a single, comprehensive, and interactive guide that explains how Shop Cash works and how to use it, with all related links directing to this centralized resource.
Finished Result
This prototype has limited functionality, but feel free to explore. To experience the purchase flow, search for the Air Jordan 1 Retro High Men’s shoe, or try the guided walkthrough to learn more about Shop Cash.
Achievements
Collaborating with talented researchers and designers in my master’s program to improve an existing product was an incredibly valuable experience.
Revisiting this project with fresh perspective, there are design decisions I would approach differently today, but I’m proud of the work and the growth that came from it.
I hope the care, craft, and learning behind this project come through.