I used Google's AutoML Vision service (https://cloud.google.com/vision) to train the model off of pictures of masked and unmasked faces from coworkers and creative commons images from Flickr, and am running the model in-brower in a React app. It was pretty cool to see how easy it was to set up an object detection model without having to figure out how to set it up with Keras or something.

I recently built a similar system for HackOHI/O, my college's hackathon. Was a great challenge! We used a slightly different approach, as we didn't have the time or expertise to train our own models.

Oh cool! Was it also a mask detector, and if so did you find a pre-trained model for it?

Can you provide more details about how you're running them model in-browser?

Yeah! AutoML lets you export a TensorFlow.js version of the model to Google cloud storage, and there's a frontend library, tfjs-automl (https://github.com/tensorflow/tfjs/tree/master/tfjs-automl), that downloads the model and sets it up for detections.

Then I'm connecting to the device's webcam with navigator.mediaDevices.getUserMedia, and twice a second send a reference to the video stream object to the detector, which runs inferences locally and returns the coordinates of any detected objects.

There's some glue code to do the whole dance to connect to the camera and model, but after that it works pretty seamlessly, on my desktop and mobile browsers

Dr. Masky FTW :)