Inspiration

Our project was inspired by issues we saw our friends facing while navigating the dining halls at UVA. Many students want to be able to track aspects of their diet such as sodium or protein intake. This could be for health reasons as many people need to hit certain daily requirements or for their career as an athlete. While many people are able to track and check these intake values at home, the transition to college prevents easy access to do this as not all nutritional values are provided in front of the food at dining halls. HoosNutriPlan aims to allow students to track these nutritional values while creating a meal plan based on their intake goals.

What it does

HoosNutriPlan essentially provides "the meal plan for the meal plan" at UVA. The website allows students to choose a date and view all the menu options that their dining hall offers that day. From there, students will be able to view nutritional facts for all food including values such as calories, carbohydrate values, the amount of protein, etc. From there, there will be an option to add foods that students select into their "meal plan" for the day. The website automatically calculates the total nutritional values the students would be consuming that day by following this meal plan they create. Students are also able to customize their nutritional goals. For example, they will be able to mark that they want to eat at least 100 grams of protein that day. They can add items from the dining hall to their plan until they hit or exceed the 100 gram goal.

How we built it

First, we used Figma in order to plan the website’s aesthetic and visualize how the meal plan options would be presented. From there we used React and JavaScript in order to create the website itself. We used React to make the creation of the website faster, as there were a lot of repeated components. Firebase was used as the database as well as hosting and authentication for the application.

Challenges we ran into

Some challenges we ran into include making the functionality of the website obvious. We created small arrow keys so that students can click them and expand nutritional information. We had to experiment in order to ensure that this portion of the website’s functionality was apparent so that students would not be confused on how to navigate the website. Another challenge we ran into was regarding the sheer amount of dining options at UVA. While our website focused on the three main dining halls - O'Hill, Runk, and Newcomb - there are also many other dining options on campus. We decided to focus specifically on dining halls as they were most popular for meals on campus and revolve around the meal plan UVA offers.

Accomplishments that we're proud of

Some accomplishments we are proud of include the way the website was formatted. Careful planning and testing allowed for an optimal design in which students would be able to easily navigate everything the website had to offer. We are also pleased with how the interface for the menu options turned out. Each menu item is detailed with nutrition facts and displayed in a way that is not overwhelming for the user to scroll through and select. This was achieved with extensive planning on Figma.

What we learned

During this process, we learned about the process of developing a project like this with a team. As a team of three, each member was able to contribute by allocating different tasks to work most efficiently. The use of collaboration and communicating our ideas and progress with one another allowed HoosNutriPlan to be developed optimally.

What's next for HoosNutriPlan

In the future, HoosNutriPlan could be further improved by possibly adding other dining options such as meal exchange places like Za'atar at The Castle. Currently, the website only focuses on UVA dining halls. By adding meal exchange places this would allow students to include more options in their plan and provide a more detailed nutritional intake picture. HoosNutriPlan could also implement a function in which students will be able to add foods outside of the dining hall such as the calorie count of a cereal bar they had. This would provide a more comprehensive picture of their total daily nutritional intake.

Share this project:

Updates