Grocery on Budget: Smarter Shopping with AI
MY ROLE
Product designer
TOOLS
Figma
Figjam
Miro
TIMELINE
Jan 2024 - Mar 2024
Grocery on Budget helps users compare prices, track real-time stock, and set spending limits. With AI-powered recommendations, it creates tailored shopping lists that make grocery runs more affordable, transparent, and stress-free.
Problem
Users struggle to compare prices across stores and often waste time visiting locations without knowing if items are in stock—leading to overspending, frustration, and inefficiency
Background research
Research indicated that inflation and tipflation is giving pressure for people to dine out.
In 2023, the cost of dining out in the U.S. increased by 8.2% compared to 2022. Additionally, a 25% surge in 'tip inflation' has contributed to a growing reluctance among consumers to dine out, shifting behaviors toward more budget-conscious eating habits.
Competitor Analysis
We have compared 4 big grocery stores that owns multiple chains across the US
Wegmans offers price comparison and online order pickup services, but its comparisons are limited to products within its own inventory, not across different stores.
User research
Conducted user interviews with New Yorkers
User personas & journeys
Personas are set according to the data research
Design solution: Transparent grocery shopping
A platform that combines price comparison, real-time stock visibility, budget tracking, and AI-powered personalized recommendations—helping users shop smarter, stay on budget, and plan with confidence
Project goal to achieve user needs
Proposing a service where users could compare prices and see stocks of offline stores
Design systems
Montserrat typeface is set in a range of weights for clear hierarchy and readability.
Typography
Montserrat
Montserrat | Light
Montserrat | Regular
Montserrat | Medium
Montserrat | Semi Bold
Montserrat | Bold
Color
Iconography
Features & iterations
Main Page
Product Page
Detail Page
My Profile Page
Mobile design
Lessons learnt
Reflection & Takeaways
Working on the Grocery on Budget project deepened my understanding of how design can directly support people’s daily needs—especially during times of financial uncertainty. Designing for price transparency, local availability, and budgeting required balancing functionality with empathy, particularly for users who may not be tech-savvy or have easy access to online tools. Through user interviews, journey mapping, and iterative testing, I learned the value of clear information hierarchy, inclusive interactions, and emotional clarity in high-stress contexts like grocery shopping. This project reminded me that good design isn’t just about solving problems—it’s about doing so in a way that empowers and respects users’ real-life constraints.
More Projects
