-
-
Hero Section of Eat For Tomorrow (Dual Theme Preview)
-
About Section of Eat For Tomorrow
-
Features Section of Eat For Tomorrow
-
How to Play Section of Eat For Tomorrow
-
Example of the 14-Day Story - Day 1
-
Mini-Games 1 - Quick Click
-
Mini-Games 2 - Memory Challenge
-
Mini-Games 3 - Eco-Plate
-
Mini-Games 4 - Supermarket Dash
-
Example of the Endings - Ending 1 (Eco Hero)
Inspiration
We wanted to create a fun, story-driven game that players can enjoy in quick sessions while still having meaningful choices. The idea came from observing how everyday food choices like breakfast, lunch and dinner can subtly impact health, wallet and the environment. We wanted to gamify that experience in a playful and educational way to let users see the consequences of their decisions over a 14-day in-game journey.
What it does
Eat For Tomorrow is a 14-day interactive story game where each day presents players with food choices. Every decision affects three stats: health, wallet and the environment. At the end of 14 days, players reach different endings depending on their cumulative choices. The game also includes mini-games like quick clicks, memory challenges, eco-plate sorting and supermarket dash, each designed to reinforce the impact of smart eating in a fun way.
How we built it
We built Eat For Tomorrow using only HTML, JavaScript and CSS, focusing on:
- Modular mini-games for days after 3, 7, 11 and 13.
- Animated UI and interactive elements.
- Page transitions for smooth gameplay flow.
- Responsive design to support different screen sizes.
Challenges we ran into
- Game Animations and Transition – Ensuring smooth, glitch-free animations across mini-games.
- Synchronizing Scores Across Games – Making sure health, wallet and environment stats update consistently.
- Dark Mode – Implementing a theme toggle that works for all game screens.
- As a team of two, we occasionally faced communication challenges, especially in deciding the next steps or prioritizing which mini-games and features to implement.
Accomplishments that we're proud of
- Successfully completed a fully playable 14-days game with multiple mini-games.
- Implemented dynamic score updates and flashy visual feedback for player actions.
- Added dark mode support and smooth page transition animations.
- Polished UI for each mini-game to make them engaging and visually distinct.
What we learned
- Improved our JavaScript skills, particularly in DOM manipulation, animations and event handling.
- Enhanced CSS abilities with animations, transitions and responsive layouts.
- Learned how to structure a multi-page web game with modular mini-games and shared game state.
- Working closely together, we improved our communication and collaborative skills. By talking things out and aligning on tasks, we learned how to break down complex problems, make joint decisions efficiently and support each other in development.
What's next for Eat For Tomorrow
- Expand the story from 14 days to 30 days as well as adding different story chapters for a longer gameplay experience.
- Add more mini-games to diversify challenges.
- Continue enhancing the UI, visual feedback and animations to make the game more immersive.
- Explore mobile optimization for a seamless experience on smartphones and tablets.
Log in or sign up for Devpost to join the conversation.