SmartPantry
is a mobile application that is designed to help the users to shop for groceries efficiently and avoid food wastage. It helps the users to manage inventory, plan grocery lists, and discover recipes.
Role: UX/UI Designer TimeBox: 3 weeks: July 03, 2020 - July24, 2020
Tools: Figma, Photoshop, Miro, Gantt chart, HTML5, CSS, Bootstrap 4, Github, VS Code, Repl.it Deployed single page website: https://schandrupatla.github.io/SmartPantry/
Design Challenge
According to the FDA, “In the United States, food waste is estimated at between 30–40 % of the food supply. This figure, based on estimates from USDA's Economic Research Service of 31% loss at the retail and consumer levels, corresponded to approximately 133 billion pounds and $161 billion worth of food in 2010.” People don’t have the time or tools to minimize over spending and food wastage.
Design Opportunity
Design a smart mobile app to help people track kitchen inventory and buy the minimal in order to to avoid wastage.
The Solution
Our design solution is an app that allows users to scan a QR code on grocery store receipts and build a virtual pantry to mimic the pantry/fridge at home, serving as a virtual assistant for inventory maintenance. The user will be able to customize alert notifications so they’re up-to-date with the products they have and the items they may need.
The overall goal is to reduce the amount of food , money, and time wastage that occur in periodical grocery trips and errand runs.
Features
QR Code Scanning
Users can scan an individual item or the QR code on the grocery store receipt. The app will identify the items and update the virtual pantry list.
Recipe Search
Users can search and select a recipe online and the app identifies the list of ingredients needed by cross-checking with the virtual inventory list. The app then shows the missing ingredients needed.
Process
This flow chart illustrates my design process.
Target Users
Users with busy schedules who don’t have time to track the kitchen inventory and preplan grocery trips. They value time and money and want to decrease their food wastage.
Research
Note: Due to Covid 19 situation, most of the user interviews and user testing had been conducted online through video calls.
I noticed that some people are very disciplined and go grocery shopping with a well planned list, only buying the items they need. On the contrary, the majority of people stop by grocery stores on the way back from work and have no idea what they are running low on or have too much of. Also, many don’t even realize when their groceries are expiring. To gather deeper insights about the topic, I interviewed people who have busy schedules but love to save money and limit food wastage.
My questions sought to gather information about existing resources, grocery shopping logistics, and pain points in practicing disciplined shopping.
Sample User interview questions
How often do you go grocery shopping?
How often are you keeping inventory of the ingredients or foods that you have in your pantry, cupboard, or fridge?
How do you keep track of the inventory? any tools?
After visiting [competitor website], what do you feel they’re missing that would have improved your experience?
If we provided you an app that scans the QR code on your receipt and then uploads the items to a virtual inventory, how do you feel that might impact your quality of life when it comes to cooking at home?
Online Survey
We conducted an online survey a reach wide variety of people of different age groups to collect and analyze relevant data.
Research Analysis
Studied trends and identified key pain points. I created an affinity diagram to group similar ideas.
Pain Points
Based on my interviews, common problems that interviewees experienced when shop for groceries shopping:
Don’t go out shopping planned with a list and end up buying existing items.
Don’t keep track of items and their expiry dates.
Toss away a lot of food.
Competitive Analysis
After identifying the problem, I looked at popular existing apps to see if they effectively solve the problem.
All competing mobile apps don’t provide the same amount of features. Our solution makes use of receipt details along with pantry information to customize unique recipes, tailored to the users preference. We also factor in unique metrics such as expiry dates that many apps do not consider.
Ideation
Storyboard - From our interviews, this is a scenario that we heard of many times during our interview process and contextual inquiry.
Persona
After completing our research and developing a strong understanding of our user groups, we created a user persona that describes our targeted users the best scenario. It encompasses pain points of users with families and busy schedules.
Prototype
Rethinking the shopping Experience
I restructured the user’s flow model, keeping track of Inventory details and expiry dates.
Wireframes
Our process began with sharing ideas and designs. The team participated in a Design Studio to rapidly sketch and ideate dozens of concepts for our designs. Since we knew we had a lot of tasks to account for, the team began the sketching process by delegating out sections of the work. We combined the best of the ideas into low fidelity sketches in order to test basic site functionality.
Once we tested on paper, we made the appropriate changes and moved into mid-fidelity wireframes, and tested on four users. Through rapid prototyping, we made several changes at the mid-fidelity level..
UI Style Guide
I enjoyed working on color scheme and typography. I was inspired and created a UI style guide to adapt the new logo, brand color, and font. I added a style guide to my portfolio, documenting the pieces that help put it together.
Sample webpage
As a part of the project, I developed a single webpage, implementing micro interactions and a carousel that was inspired by some web applications online.
Usability Testing
I worked on user testing to refine user interactions and experience. I held video conferences due to (Covid 19 situation) and received some great feedback from 3 different user testings.
Usability Testing feedback & Iterations
We iterated through the designs, incorporating the suggestions and feedback from the user testings to build the final product prototype.
- Aligning Images/components properly.
- Matched/intuitive icons.
- Readable fonts in application.
- Modal screens.
- Expiration date “alert” in food/grocery items.
- Appropriate background image.
Hi-Fi clickable Prototype
A clickable prototype of "SmartPantry" mobile app
Takeaways
This was a great project through which I learned product design principles and how they can be integrated with the environment around us.
Design opportunities are everywhere: This project reinforced the idea that there are countless opportunities to identify problems and develop solutions. Even though there are existing solutions in the same project area, we can rethink the approach to these problems with more interactive features.
Thanks for reading!
