tangerine

Inspiration

We were tired of grocery shopping on the whim. 77% of digital grocery shoppers cite time savings as top motivation, and in lieu sacrifices many intricacies of getting great groceries. This constitutes not actually knowing if the products wanted were in stock, what specific products were wanted, and if products actually fit budgets. We also found that grocery shoppers are attracted to products that are culturally relevant to their taste and demographic, so we wanted personalized suggestions from users' taste profiles.

What it does

Tangerine generates a fully personalized grocery list that:

Understands your tastes via your Qloo profile (favorite cuisines, flavor affinities, etc.).
Suggests culturally relevant alternatives, e.g. recommending plantains alongside bananas for users with a - Caribbean taste profile.
Optimizes for budget by fetching current deals via the Kroger API.
Adapts on the fly: as you submit general terms like "carrots", it finds specific products from Kroger

How we built it

We used PostgresSQL to store user, grocery list, and product information such as preferred cuisines and demographics, to populate the Qloo Taste AI. After the user created a profile, we populated the suggestions tab with top recommendations (affinity score) from products from KrogerAPI generated from the signals we fed the Qloo API. These suggestions would be continuously updated using RAG from our vector database ChromaDB, which was populated with Gemini 2.0-flash-lite generated descriptions of products, preferences, and other metrics for similarity search.

The frontend was build with Python, backend with Vue.

Challenges we ran into

Getting relevant results from the Qloo taste AI was difficult, as there weren't many "grocery-specific" items and others were vague. We used the specialty_dish tag to source only dishes, then prompted Gemini for specific descriptions of the products.

We also wanted to link our list with KrogerAPI's cart feature. The API only allowed adding and not removing items, so we tracked changes with a json file. In addition, the cart authentication process of access and refresh tokens was unnecessarily complicated and didn't make sense for the user to go through that process.

The schema for the PostgreSQL database was complicated because figuring how to model products in relation to the lists and connecting with KrogerAPI was a lengthy process. Getting the backend and frontend connected was also challenging, as we had many auth and api steps/calls. initially, we used next.js but later switched to vue for simplicity.

Accomplishments that we're proud of

full grocery shopping pipeline
culturally relevant and dynamic suggestions
curated taste profiles
cool frontend and ux
working vector database + similarity search

What we learned

We learned how to scheme many features with a complicated app and to connect different APIs, databases, and LLMs smoothly. We also found connecting the backend with frontend was more challenging than we thought.