Analytics page on the web app
We have some experience with data visualization and wanted to represent meaningful data that have the ability to inform decisions. We decided on our idea to use qr codes to scan food items so we can keep track of eating habits through the power of data visualization.
What it does
In our app, the user first log in and then scan a qr code of a given food item which allows the user to log said food item and keep track of what they eat within a given time period. The data collected from all food items scanned is represented in an interactive visualization that allows easy filtering so trends can be easily isolated and seen.
How we built it
To visualize our dataset, we used d3.js to display a variety of graphs and charts and dc.js for the interactive filtering. We used React Native to create the user interface for the mobile application, and we used Expo to help us develop and deploy our app in React Native.
Challenges we ran into
In general, the use of React Native for our project was a challenge since it is was all of our first times using React Native. We also ran into some issues using d3.js with React Native since we were not used to visualizing data within an app setting.
Accomplishments that we're proud of
We're passionate individuals about data science, so we're proud that we managed to make a cool and interactive visualization of a dataset that can also help people make informed decisions.
What we learned
We definitely learned a lot about React Native considering it was our first time, and since a few of us are still new to the field of data science as a whole, it was great to get some more exposure and experience with data visualization.
What's next for Nutrivue
We want to make information about student's eating habits available to the school as well as the students themselves, so definitely a future goal for Nutrivue to make the data as accessible as possible for both parties.