CartQuest | Devpost

Home page

Inspiration

The inspiration came from the everyday experience of shopping for groceries and cooking meals. We thought: what if picking ingredients and cuisines could feel like a fun, interactive game rather than a chore? By combining the idea of cuisines, dishes, and grocery shopping into a gamified experience, we aimed to make learning about food cultures and cooking more exciting.

What it does

CartQuest is an interactive, gamified grocery shopping experience. Players start by choosing a cuisine (Indian, Italian, Chinese, or Mexican), then pick a dish. From there, they explore a virtual grocery store, picking up ingredients by clicking with icons. The game turns ordinary shopping into a fun adventure with glowing buttons, animated aisles, and engaging interactions.

How we built it

Frontend: HTML, CSS, JavaScript Animations: CSS keyframes for floating effects, glowing buttons, and background animations Dynamic Dishes: JavaScript event listeners to load dish options when a cuisine is selected Prototype Store: Drag-and-drop functionality simulates picking groceries and adding them to a cart

Challenges we ran into

Designing a UI that was fun but intuitive Dynamically updating dishes when cuisines changed Planning a scoring system and future add-ons while still shipping a working prototype

Accomplishments that we're proud of

Website Ability to create a prototype UI

What we learned

How to bring gamification into everyday tasks like shopping Using CSS animations and keyframes to create lively interactions Implementing dynamic front-end logic with JavaScript The value of iterative design—starting simple, then layering fun features