The Food Zoo

Inspiration

One of our team members, Zahra, has an Indonesian cousin who faced malnutrition at a young age. From this story, we were inspired to tackle an issue that pertains to millions of young children in Indonesia who face a lack of nutrition in their diet due to a number of external factors. With this quiz, we hope that children can intrinsically make the best eating choices through the influence they gain from the characters that they get from the quiz.

What it does

Our website features a quiz for users to partake in and see what character fits them the most. To align ourselves with the younger audience, we tried to appeal to the “Buzzfeed Quiz” trend! Oftentimes, children and younger teens don’t have engaging platforms to teach them about healthy choices, and we figured that one way to try and make healthy eating choices applicable and appealing to children would be through a personality style quiz.

How we built it

We built the website through Replit using three programming languages: HTML, CSS, and Javascript.

Challenges we ran into

We ran into quite a few problems. First, debugging took hours, and we tried multiple types of code for the quiz to work, but we agreed that the first style (which is the one seen on our website) was what suited our website the best. We realized after hours of trying to debug that the issue was because we hardcoded the HTML that was added through JS! We also ran into a number of issues after.

Accomplishments that we're proud of

We’re extremely proud of the quiz! Many of our frustrations were from debugging the quiz.

What we learned

We learned that it was extremely important to communicate with our fellow team members. Because of our busy schedules as the summer is nearing its end, we had to come up with the hours where we could join a call and simply…work!

What's next for The Food Zoo

We hope to add more questions into the quiz to make it even more personalized! Also, we would really love to add more languages into the website.

Built With

• canva
• css3
• figma
• html5
• javascript