Munch

Snap! Learn! Enjoy!

The Inspiration

Surprisingly our inspiration for this app came during our trip to ECHacks. We were eating a granola bar on the bus and wondered whether there was effective way to keep track of the nutrition values of the food that we ate. So this little snack gave birth to our great idea: Munch!

The Process

How we built it

We wanted to make an app that was as seamless as possible for the user, so we decided to use photo recognition in order for the user to "Snap" a photo and get its data almost instantly. To do this we used a machine learning/artificial intelligence library called Clarifai. In order to make calls to the api we used a NodeJS backend (served on AWS) to make http requests and send necessary data back to the app.

The user has the option to either enquire or eat the item that they took a picture of. Both options provide nutritional data about the item (retrieved from a government food database), while "eat" will go ahead and store certain values to the Local Storage on the device.

Stored data can be viewed on another part of the app, so that the user can keep track of various parts of their diet such as calorie intake and the balance of carbs, proteins, sugars and fats.

Challenges we ran into

We ran into issues both in the front and back end of the application.

In the frontend, we faced issues with implementing clean and dynamic UI that worked well with the data that we are displaying for the user. Additionally, we decided to store data using the Local Storage in the mobile device and this gave us issues in terms of not being able to reliably access data. All of this was overcome by spending time either finding a better solution or working around existing issues with the technologies we were using.

In the backend, we spent time learning some NodeJS and faced issues with actually having the app communicate with it. We tested requests that worked with Postman and not with the app (which was quite frustrating), but figured it out with some further research into the appropriate headers and format required for the request itself. In addition we had to learn how to actually host the server on an EC2 instance using AWS. This was definitely something cool to learn about, but provided us some grief in the earlier stages when we were actually setting it up.

The Endgame

Accomplishments that we're proud of and cool stuff we learned:

1) Created a useful app capable of making a meaningul impact on the health and well-being of humanity 2) Learned how to use Ionic framework effectively 3) Made a clean backend capable of receiving images through a base64 string (we didn't know that was possible) and send useful nutritional facts using API and database requests 3) Integrated ChartJS so that users can easily visualize data about their health

What's next for Munch

Implement diet plans and goal tracking. Make food recommendations (maybe even tailored to dietary restrictions). Integrated with fitness to give a better overall view of your health.

Try it out

Mobile App Backend Server

Share this project:

Updates