top of page

save!

A Grocery Savings App   |   2023   |   Thinkful

Grocery prices have been on the rise, to the point that eating out has been cheaper to do. Because of this, I created an app that uses generative AI tools to find which grocery store has the items on your list for the best price.

Responsibilities

  • UX Researcher

  • UX/UI Designer

  • Information Architect

  • Product Designer

  • ​Solo student project

Problem

  • Grocery prices are being affected by inflation at drastic rates.

    • Groceries have gotten so expensive recently, at times, being more expensive than eating out

    • Because of this problem, most people are doing even more research on what store has the cheapest products
       

Solution

  • An app that allows you to make a list and with generative AI tools, find what store has everything you added onto your list, and for the most bang for your buck. 

Programs Used

Figma Logo.png
Google Drive.png
Adobe Color.png
Maze.png

Design Process

  • Competitive Analysis

  • User Survey

  • User Interviews

  • User Personas & User Stories

  • Journey Map

  • Empathy Map

  • Site Map

  • User Flows

  • Sketches

  • Wireframes 

  • Mood Board

  • Logo & Name

  • Hi-Fi Prototype

  • Usability Testing Results

  • Usability Findings

  • Insights

  • Current Prototypes

  • Next Steps

Discover

Competitive Analysis: S.W.O.T

Compared 3 apps with a similar idea to my idea

  • Flipp

  • Grocery King

  • Instacart

Screenshot 2023-09-21 at 7.47.04 PM.png

User Survey

  1. Have you noticed the increase of prices for groceries?

    1. 100% said Yes

  2. On average, how much do you spend on groceries per visit?

    1. Tie between $91-$120 & $150+

  3. How often do you go grocery shopping?

    1. 40.7% go twice a month

Screenshot 2023-09-21 at 7.50.53 PM.png
Screenshot 2023-09-21 at 7.54_edited.jpg
Screenshot 2023-09-21 at 7.52_edited.jpg

User Interviews

  1. What age range do you fall under?

    1. 81.5% are 25-34 years old

  2. What is your sex? Select one.

    1. 48.1% are Male

  3. What is your approximate annual household income?

    1. 22.2% make $50,000-$74,999

Screenshot 2023-09-21 at 8.08.28 PM.png
Screenshot 2023-09-21 at 8.09.30 PM.png
Screenshot 2023-09-21 at 8.11.03 PM.png

User Persona & User Stories

Persona 1

  • The Foodie: Marcus Baptista

  • User Story: “As a foodie, I want to try different meals so I can expand my taste palette.” 

Persona 2

  • The Gym Rat: Brandon Lopez

  • User Story: “As a gym rat, I want to buy my groceries in bulk so I can meal prep.”

Persona 3

  • The Cooking Enthusiast: Emily Garcia

  • User Story: “As a cooking enthusiast, I want to know what store carries everything I need for my meals so I can spend more time cooking.”

Journey Map

  • Scenario: Marcus is planning on making a new pasta dish with his partner and needs to buy all the ingredients

  • Expectations: The store he is going to should have all the ingredients he needs.

  • Pain Points:

    • The store didn’t have what Marcus needed

    • Marcus and his partner aren’t going to eat a new pasta dish

    • Marcus spent gas to make a trip he didn’t need to make

  • Opportunities: 

    • Marcus can look up what stores have most of the ingredients he needs

    • Marcus can look up recipes with ingredients he already has

Journey Map.png

Empathy Map

Says, Thinks, Does, Feels map with persona The Foodie

Empathy Map.png

Define

Site Map

  • 5 areas users can go to

    • Lists

    • Recipes

    • Favorites

    • Weekly Ads

    • Issues

Capstone Site Map.png

User flow

Scenario 1: Enter the app and create a grocery list to generate the options of where you’ll see where you can go for the cheapest price.

Scenario 2: Enter the app and search for a recipe to make. 

 

Scenario 3: Enter the app, search for a recipe and add the ingredients to a list.

 

Scenario 4: Enter the app, go to your shopping list and check off items you picked up at the store.

 

Scenario 5: Enter the app and add to your favorites page. 

Legend.png

Legend

Sketches

For my sketches, I did the Crazy 8's method and did it 3 times as I had different versions of what I wanted to do for different screens

Wireframes

Develop

Mood Board

Moodboard.png

Logo & Name

I decided to name my app save! as a play on words to help users save money, and the "a" and "!" as a hidden ai in the name. 

image 1.png
Logo S.png
Final Logos.png

Deliver

Usability Testing & Results

Users

  • From Maze and In-Person

    • 10 Maze Participants

    • 2 In-Person Participants

Tasks

  1. Imagine you were creating a grocery list. How would you go about creating a new list and adding 1 gallon of 2% Milk to the list?

  2. You added Russet Potatoes to your list. How would you go about changing the quantity from 1 potato to 3?

  3. Create a grocery list, then search for the store options for your list. Once you see your results, choose the store you believe is the best option.

  4. You want to see more information about what you chose for each item on your list. How would you see more details about the product on the list?

  5. You have your chosen grocery list ready to go. You just got your 3 potatoes. How would you go about crossing it off your list?

Averages

  1. Outcome: Direct Success Duration: 28.09s  Misclicks: 1

  2. Outcome: Indirect Success Duration: 8.75s    Misclicks: 0

  3. Outcome: Indirect Success Duration: 36.42s Misclicks: 10

  4. Outcome: Direct Success Duration: 2.83s    Misclicks: <1

  5. Outcome: Direct Success Duration: 2.55s    Misclicks: 2

Usability Findings

Likes

  • The color choice

  • Two options to get to make a list

  • The AI tool

Criticisms

  • Make the ‘make new list’ button bigger

  • The home page seemed a bit dry

Question

  • Shouldn’t the button not work if I haven’t inputted anything? 

Ideas

  • You should change the name of the button

  • Add some news on the home screen

Insights

  • Need to make the ‘add list’ button look more prominent 

  • Should shade down unclickable buttons

  • Add more things on the homepage to keep the user engaged

Next Steps

  • Recipes

    • Look up recipes​

    • Use AI to generate recipes with ingredients you have on hand

    • Add ingredients from a recipe onto your list

  • ‘Store Options’ generated history

    • Look up previous store option choices, in the event you accidentally chose the wrong one​

Other Projects

Take a look at some of my other work! 

bottom of page