Home

Tensorflow.js + Flappy Bird = fun

So I have been playing with the Leap motion controller and it's pretty great but it would be

nice to be able to get a similar effect with just a webcam.   This should be possible with modern 

machine learning and image/object detection but is it fast enough for real time use? 

 

I ended up for now experimenting with an existing library for face detection.   Using that we should

be able to use the position of the face as input to a game. 

 

A quick google search found a video on how to make "flappy bird" in 25lines of code.  That'll do.

I modified the code slightly but the original video is here if you are interested.

https://www.youtube.com/watch?v=M45iFPVdtj0

 

I was aware of Tensorflow.js and thought I would see if there is a way to use that with real-time 

face detection.   Yes.   Yes there is!

 

Enter BlazeFace and WASM.

https://github.com/tensorflow/tfjs-models/tree/master/blazeface

 

Using these two examples I cobbled together the following demo... "FlappyFace".. where there isn't much flapping but you can control the vertical position of the bird with the position of your face in the webcam.    Enjoy.

 

https://allthethin.gs/flappyface.html

 

FlappyFace