
Grocery on Budget
MY ROLE
Product designer
TOOLS
Figma
Figjam
Miro
TIMELINE
Jan 2024 - Mar 2024
TEAM
3 Product Designers
Grocery on Budget is designed to help users compare grocery prices by location, check real-time item availability, and set spending limits. Created in response to rising inflation, the project focuses on making everyday shopping more affordable, transparent, and accessible for budget-conscious users.
Local grocery comparison problem
Users face challenges in comparing prices across different stores and checking the availability of items in stores.
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 allows users to compare grocery prices, check real-time stock availability, and set personalized budgets.
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



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.