LookItUp

LookItUp is a web application that allows its users to scan the ingredient list of their cosmetic products to check for harmful compositions. It will categorize the components of the product as Safe or Harmful. Further, you can look up the use case of each component used in the product and how it is manufactured. Ratings of the product will also be displayed to the user based on safety composition (accuracy improves as our database expands).
To begin with, the user will have to first log in or sign-up for authenticity reasons. Once he logs in, he will be directed to the scanner page. On the scanner page, the user will have the option to upload an image of the product label. Once he uploads an image, our application will preprocess the image using OCR and identify the list of ingredients from the image. The web application will then show all the ingredients present in the product in a structured tabular manner. It will also show a brief description of all the ingredients and their safety rating. A pie chart of the product composition is also shown.

Video Demonstration of the Product

Project.Demo-1.mp4

YouTube: https://youtu.be/OvEVCmvt4fY

Cypress Testing

Cypress-1.mp4

Backend Unit Testing

2022-04-21.16-04-05-1.mp4

API Documentation

• API 1

• API 2

• API 3

• API 4

• API 5

• API 6

Project Boards

• Sprint 1
• Sprint 2
• Sprint 3
• Sprint 4

Sprint Deliverables

• Sprint 1
• Sprint 2
• Sprint 3
• Sprint 4

Team Members

• Raghav Rathi : raghav-rathi (Frontend)
• Daksh Mehta: dakshmehta23 (Frontend)
• Priyanshu Prasad: priyanshu0499 (Backend)
• Suneet Jain: suneet10 (Backend)

Tech Stack

• Frontend: React
  
• Backend :
  • Go
  • Echo
  • Tesseract
• Database : MySQL
• Testing : Cypress

Project Setup - How to run

1. In order for this application to run you must make sure you have installed all libraries mentioned in requirements.txt.
   
2. Then you should connect to the MySQL database using XAMPP server and you can import the CSV file into a database.
   
3. We have saved an SQL database that you can easily import and it has the table comestic_ingredients ready.
   
4. After that you must make sure that you have ran npm install or npm i in the main react folder (newcomponent_scanner/scannerfrontend) this is where the react file is.
   
5. Ensure that all the packages mentioned in the package.json file have been downloaded and installed with the same version to avoid any errors.
   
6. Then run the command npm start.
   
7. Open a new terminal, then go to the folder where the main.go file resides and run the command "go run main.go".
   
8. Upload a picture in the browser and give it a few seconds for the results to appear.
   

Components and Functions

• Sign up page

A new user can setup their account to use our product by entering their details and credentials.

• Login Page

Existing users can enter their credentials to login into their account and use our product.

• File Upload

Users can upload an image of their product's label to scan the ingredients with the OCR.

• Ingredients Detail

After reading the ingredients of the product entered by the user, application displays the details of every ingredients after comparing it with our database and tells whether the ingredients are good or bad.

• Pie chart of Ingredient's Composition

Graphical representation of composition of ingredients gives a better understanding of the composition of the ingredients that is used in the user's product.

Web Hosted Application

• Deployment : Netlify