99 Ranch Market
re-build one of the largest Asian Grocery App from scratch
Overview
99 Ranch Market is one of the largest Asian supermarket chains in the US. It offers a wide variety of Asian groceries and products. With the end of their contract with Alibaba, 99 Ranch Market decided to rebuild the app. This decision provided an opportunity to enhance user experience with a new design system and diverse shopping methods. Ultimately, the design team created the design systems and delivered a high-fidelity prototype within 2 months. The revamped app was officially launched in January 2024.
Role
Lead UIUX Designer/Consultant
Timeline
August 2022 ~ December 2022 (5 mos)
Tools
Figma, Adobe Illustration, and Notion
Problem
The current state of the application is characterized by a multitude of features and activities, leading to a complex and confusing user experience. This excessive functionality not only overwhelms users but also creates congestion and traffic within the app.
Goal
Create an app that provide an easy and simple shopping experience for our customers, especially elders
Approach
Conducted user research with 8 interviews, developed affinity map to establish Job to be done, built userflow and wireframe and finally deliver hifi prototype
Outcome
Rapid Design Process - created app from scratch, and delivered hifi prototype within 2 months. App launched on January 2024🚀
Design Timeline
Building an app from 0 to 1 in 2 months
WEEK 01
WEEK 02
WEEK 03
WEEK 04
WEEK 05
WEEK 06
WEEK 07
WEEK 08
Product
Understand User
- User research
- User interview
- Affinity mapping
Strategy
Build Design Strategy
- Jobs to Be Done
- Heuristic Analysis
- Design System (3 wk)
Design
Start building app
- User flow (1 wk)
- Wireframing (1 wk)
- Lo-fi Prototyping (1 wk)
- Hi-fi Prototyping (2 wk)
As a result of the termination of our contract with Alibaba, our design team was propelled into immediate action. The situation necessitated a swift transition into the design process without delay. In light of this, we decided to adopt the Agile methodology for our product development. Agile methodology is renowned for its flexibility and responsiveness, key traits that we believed would be instrumental in our design process. This approach would enable us to rapidly adapt to any changes and efficiently respond to any challenges that might arise, thereby facilitating a more effective and dynamic design process.
Design Process
Clarity, the One and Only Goal
Given the time constraints, our primary focus was on gaining a deeper understanding of our main target audience. This focus was crucial to ensure that our design was tailored to their needs, as our ultimate goal was to develop a user-centric app that would resonate with our users. To achieve this, we conducted interviews with eight participants, who were carefully selected based on the demographic characteristics of our existing customer base.
The insights gained from these interviews were invaluable. We discovered that pricing played a significant role in our customers' shopping decisions. They demonstrated a clear preference for online shopping, primarily due to the convenience and ease of price comparison it offered. This insight led us to consider that offering coupons might be a key strategy in attracting and retaining customers.
Moreover, our customers expressed a strong appreciation for a clear and intuitive categorization system, which would facilitate easier product discovery. This was an important point to consider, given that our customers typically use the app with a clear idea of what they want to purchase. Therefore, improving the search functionality was identified as another critical aspect that required attention in our design process.
In our quest to understand the motivations and needs that compel users to use the 99 Ranch app, we found the Jobs to Be Done framework to be particularly helpful. This framework allowed us to comprehend users' goals in a more streamlined manner. It simplified the process of mapping the user journey, allowing us to concentrate our efforts on three main MVPs: grocery shopping, item searching, and order tracking.
These MVPs represented the core functionalities that our users expected from the app. By focusing on these aspects, we could ensure that our design would meet the key needs of our customers, thereby enhancing their overall user experience with the 99 Ranch app.
In our heuristic analysis of competitors, Amazon's blend of shopping experiences, Walmart's diverse shopping methods, Weee's sales ads, and Target's loyalty rewards stood out. Visually, they all use a simple, minimalistic style with limited colors or color only on icons, like Weee, for a smoother user experience.