Clean or Messy Classifier

Original article was published by Archit Sharma on Deep Learning on Medium

Clean or Messy Classifier

This blog is the introductory blog of the series Clean or Messy Classifier . Follow the entire series for detailed implementation of deploying a machine learning classifier into web app using various frameworks.

“Room is already clean, There is nothing to clean anymore here”

Trying to solve this age-old debate between a mother and son. Clean or Messy Classifier is an open-source project which classifies a given surrounding as clean or messy based on a confidence meter.

This is an exploratory project wherein we tried to explore various approaches for training and deploying a Machine Learning based binary classification model to be used by an end-user. Different approaches were based on different experiences and platforms as required by the client.

Implementing the Concept

  1. Creating Dataset using keywords from Google Images.
  2. Model Selection and Traning.
  3. Deploying the model using different approaches :
  • A web app with React frontend and Flask REST API.
  • A web app with a tensorflowjs model.
  • A web-app based on streamlit framework.

Creating Dataset using keywords from Google Images

Dataset and its importance in Machine Learning are of no secret to a Data Scientist. Machine Learning models depend highly on the quality and quantity of data in hand. Keeping this fact in mind we had to create a dataset free of any data bias and for this, we used Google Images. Initially, we tried BeautifulSoup and Scrapy approach but this approach failed if we had to scrape images from multiple pages or scroll.

Selenium was a solution to this problem because it automates the web browser operations using python. Now we were able to scrape a larger number of images from the CSS Selector for a keyword because scrolling could be automated.

The scrapped images were then downloaded to a directory entered.

Model Selection and Traning

The model is the binary classification model which was implemented using multiple libraries. The model was initially built using the Fastai classifier for the backend API server. A similar model was later built using Keras which was further converted into TFJS to be used directly in frontend. Tensorflow Lite model was implemented for mobile app deployment.

Deploying the model using different approaches

Once the model was trained using the scrapped data. It was time to deploy and test it using multiple approaches.

A web app with React frontend and Flask REST API

Now to use the trained model to classify the surroundings, the image file had to be fed to the model then based on this image it would classify given surroundings as clean or messy. To send this image file to the model to be classified, we used Flask REST API. The API returns the JSON response from the model loaded in the backend. We preferred the Flask (python based web framework) over any other web framework due to its easy handling for light size projects.

Server Response

The end-user should see and interact only with the frontend away from things happening in the backend. To build the frontend of this project we used the React framework which allows the end-user to upload an image from local storage or upload an image using the device’s camera itself.

A web app with a tensorflowjs model

The above-mentioned approach causes a delay due to API call which can be avoided for light size projects like this, end classification can be made faster by loading the trained model in the javascript of the web frontend itself. This approach relies on the Keras model converted to tensorflowjs.

The Github repository for this project is available at this link.

If you have any questions and ideas about what else could be added or improved in the project please share in comments.

This article has been written in collaboration with Prakhar Pandey.