I rewrote this app! Please check out phold!
Realtime visual app based on face folding inspired by Aphex Twin's promotional images for Syro and live shows that runs in the browser
I got the idea from attending a recent Aphex Twin show and was inspired by the face fold visual. I wanted to see what extent I could replicate this visual in realtime. My initial idea was for the visual to be housed in a desktop app written in C++ and use OpenCV for performance reasons, but I wanted anyone to play with the visual simply by visiting a site, so I switched to a web-based project.
This project used webpack-starter-basic as a starting point. In-browser face detection is handled by face-api.js.
Coming soon.
node
>= 8.xnpm
>= 6.x
Some steps
Clone the repo.
git clone https://github.com/helmetroo/phacephold.git
Install required modules.
npm i
webpack-dev-server
is used to serve a development build, and enables you to quickly see changes you make from your editor. To start it, run
npm run dev
http-server
is used to serve a production build for preview purposes.
It also allows you to run the app from other devices on your network, say a mobile device connected to the same wireless router.
To preview a production build, you will need to host a root SSL certificate as there is functionality (fetching from your webcam) requiring the build to be served via HTTPS. You can quickly create a self-signed one for development purposes by running
npm run create-cert
You can also follow this tutorial. You will need openssl
installed to run through the tutorial.
By default, http-server
will look for a certificate and a private key file. You can change the filenames http-server
will use for your private key and certificate in package.json
under config.https
.
To preview a production build, run
npm run preview
To make a production build, run
npm run build