InspirationOur inspiration came from a simple but pervasive problem: the disconnect between knowing what ingredients you have and knowing what you can actually cook with them. Many people want to eat healthy, home-cooked meals but are often overwhelmed by complex recipes or missing ingredients. We wanted to create a tool that bridges this gap, making healthy cooking accessible, personalized, and efficient for everyone, regardless of their culinary expertise.
What it doesMyFood is an AI-powered culinary assistant designed to revolutionize the home cooking experience. The platform allows users to:
Generate Instant Recipes: Input available ingredients to receive creative, step-by-step recipe suggestions.
Personalize Nutrition: Users can set dietary preferences (e.g., Vegetarian, Keto, Gluten-free) to ensure recipes meet their health goals.
Plan Meals: Features a smart meal planner to organize weekly eating habits.
Track Groceries: Manage a digital pantry to reduce food waste and stay organized.
How we built itWe built the MyFood web application using a modern tech stack focused on responsiveness and user experience:
Frontend: Developed with HTML5, CSS3, and JavaScript. We utilized Tailwind CSS for a clean, modern UI and ensured the design is fully responsive across all devices.
Interactivity: Used JavaScript to handle dynamic content generation and user input processing.
Design: Followed a "Mobile-First" approach to ensure the kitchen experience is seamless on smartphones and tablets.
AI Integration: Designed the logic to interface with language models to provide real-time recipe generation based on specific user constraints.
Challenges we ran intoOne of the primary challenges was creating a UI that could display complex recipe information (ingredients, instructions, nutrition facts) without cluttering the screen on mobile devices. We also spent significant time refining the prompt engineering for the AI to ensure that the recipes generated were not only creative but also safe and feasible with the provided ingredients.
Accomplishments that we're proud ofWe are incredibly proud of the UI/UX design. We managed to create an interface that feels "app-like" and intuitive. The integration of the personalized nutrition filter is another highlight, as it adds a layer of practical utility that goes beyond a standard recipe search engine. We also successfully implemented a clean, aesthetic "Fresh & Healthy" branding that resonates with our target audience.
What we learnedThrough this project, we deepened our understanding of responsive web design and the importance of user-centric features. We learned how to effectively structure a project to handle dynamic data and the importance of accessibility in web applications. Most importantly, we learned how to pivot and simplify features to ensure a high-quality "Minimum Viable Product" (MVP) within the hackathon timeframe.
What's next for Myfoodhe future of MyFood involves moving beyond a static interface:
Image Recognition: Integrating a feature where users can simply take a photo of their fridge to auto-populate the ingredient list.
Community Features: Allowing users to share their AI-generated "finds" and rate recipes.
Smart Grocery Integration: Connecting with local grocery APIs to allow users to order missing ingredients with a single click.
Log in or sign up for Devpost to join the conversation.