ABC Groceries and Caught Up Christine

ABC Groceries is a premium local chain that strives to create a neighborhood shopping environment. It could be described as a cross over between Whole Foods Market — where you have a wide range of access to premium foods, ingredients, and home care products — and Publix — where it’s a pleasure to shop and customer service is excellent.

ABC Groceries finds itself in a predicament. E-Grocery options are changing the food market industry. By 2025, online groceries, are expected to own 20% of the market. They will account for $100 Billion spent each year. ABC wants to be a part of this growing market by finding a way to translate their premium products and premium customer service they offer in-store, into a a digital product.

The Challenge

To begin, we wanted a better understanding of the current marketplace. We employed three methods:

Competitor Feature Analysis
SWOT Analysis
Market Positioning Map


After getting the lay of the land with ABC’s competitors, it was time to understand our user.

We employed several techniques for data collection and organization.

We interviewed 5 different users to get a better understanding of target shopper. We screened interviewees by certain demographics to be sure that we are actually talking to potential ABC customers. We looked to understand their habits, pain points in grocery shopping, and what they enjoy about grocery shopping.

From the interviews we took away several important pieces of data.

“I hate long lines.”

“Customer service is important to me.”

“I don’t like Publix… but it’s the best option I have.”

“I hate when they don’t have what I want.”

Based on our interviews and existing ABC data, we created an empathy map and an affinity map.

Empathy Map for a 360 degree view of our user.
Affinity Map

3 Pains Points:

3 Desires While Shopping:

Based on these findings, we designed our User Persona — Caught up Christine.

User Persona of Caught up Christine

From our User Persona, we created a User Journey to better understand her habits and where ABC has an opportunity to truly save the day.

We imagine Christine as a busy, young professional. After work, she rushes to her yoga class — her happy place. The only problem is, between work, yoga, commuting, and life, Christine has no time to shop or cook for herself!


Based on our user research we decided on the following focus for our app feature:

“Helping young professionals save time so they can eat healthy and yummy food without going nuts.”

With this focus in mind, we employed the MoSCoW method (must have, should have, could have) as well as comparing User Impact over Business Effort.

Matrix comparing user impact over business effort
Minimum Viable Product Selection

Based on our findings, we selected 3 possible feature focuses for our MVP (Minimum Viable Product).

After pitching these features to users and asking for their feedback, we quickly realized that voice interaction wasn’t the most important feature on their priority list. We quickly scrapped this idea and decided to focus on a highly focused search capability along with the digital recipe box and meal delivery options.


Based on our users’ needs we created a site map, did some rapid ideating for our screens, and came up with a rough idea of what would be our user flow and “happy path”.

Site Map with Highlighted User Flow
Rapid Ideation for Screen Design


Based on our user flow and the screen layouts we decided on as a team, we began to build our prototype.

We drew a top navigation bar and bottom navigation bar on paper and used a white board and the Marvel app to create our prototype.

Creating each still frame for our Happy Path in Marvel
Still screens for our happy path in Marvel


We conducted several usability tests. We asked users to “find a vegan recipe with rice and beans and place the ingredients in your cart”.

User tests were overall successful — 5/5 users were able to complete the task without getting outside help and without abandoning the task.

However, users did struggle with the option of when to type and when to select filters. They also gave us feedback on organization of the elements and screen layouts.

An example of our usability tests and user feedback


ABC Abby — will be nixed in future iterations :(

Based on this information, we will be exploring new layouts for the search and filter. This will be easier as “ABC Abby” took up a significant amount of screen space.

We look forward to sharing our next round of progress with you! We will be reworking the layout as well as deciding on the design aesthetic.

The Team

Left: Haley Kirk | Right: Prescilia Williams

Please subscribe to my channel and Prescilia’s to keep up with our progress.

Connect with me on LinkedIn or follow me on Instagram @designedbykirk

The Journey of a UX/UI Designer: People-focused, fiercely fun.