SnackSmith Hackathon Submission
Project Description
SnackSmith is an innovative, AI-powered web application that redefines the process of creating healthy snacks. It moves beyond static recipe lists by providing users with an interactive, 3D workspace to visually construct their own energy bars, protein balls, and snack bowls. As users drag and drop ingredients, a Python backend delivers real-time nutritional analysis, while an integrated AI coach, powered by the Google Gemini API, offers intelligent feedback, optimization suggestions, and personalized recommendations. SnackSmith aims to make nutrition science accessible, intuitive, and engaging, empowering users to forge snacks that are not only delicious but perfectly aligned with their unique health and dietary goals.
Thought Process
Our core idea was to address the common disconnect between knowing what's healthy and actually creating healthy meals. Traditional recipes are often rigid and don't cater to individual needs or available ingredients. We envisioned a tool that was more like a creative workshop than a cookbook. The central thought was to create a "feedback loop" where a user's creative action (adding an ingredient) would trigger immediate, insightful reactions (updated 3D model, new nutrition score, AI comment). We chose a 3D canvas to make the experience tangible and visually rewarding. The integration of a generative AI was planned from the start to serve as a "co-pilot," guiding users toward better choices without sacrificing their creative freedom. Every design decision was aimed at making complex nutritional data feel simple and empowering the user to be the "smith" of their own snack.
Challenges and Successes
Our primary challenge was managing the complex, real-time state synchronization between the
UI, the 3D canvas, and the backend services. Ensuring that dragging a single ingredient would
seamlessly update the visual model, trigger a backend nutrition calculation, and prompt an AI
analysis required a robust state management solution, which we successfully implemented with
Zustand. Another significant hurdle was creating visually distinct 3D representations for dozens
of ingredients within the hackathon's timeframe. We overcame this by developing a procedural
generation system in three.js rather than relying on pre-made assets, which proved to be a
major success. We want to continue further with creating even more realistic 3D models. Our biggest success was the integration of the Gemini API. Engineering the prompts to get structured JSON for snack modifications and conversational, helpful advice from the AI coach truly brought the project to life, elevating it from a simple builder to an intelligent
nutritional partner.
Built With
- drei
- flask
- framermotion
- gemini
- next.js
- react
- reactthreefiber
- tailwindcss
- three.js
- typescript
- uvicorn
- zustand
Log in or sign up for Devpost to join the conversation.