$ cd ~/work/ar-lip-filler-preview
AR Lip Filler Preview
A proof of concept for aesthetic clinics: the phone camera tracks the face and reshapes the lips live, so a patient can preview filler styles before treatment.
00//the walkthrough
3 screens · tapclick to enlarge
01//the problem
Patients find it hard to picture what lip filler will look like on their own face, and consultations rely on before-and-after photos of other people.
02//the approach
MediaPipe tracks the face live, entirely in the browser. Anatomy-aware warping reshapes the lips and a WebGL2 renderer draws the result in real time, with style presets and a volume control. A FastAPI and PostgreSQL backend stores the before-and-after pairs a user saves.
03//what I built
Live face tracking
MediaPipe face tracking, running entirely in the browser.
Realistic warping
Anatomy-aware warping and a WebGL2 renderer.
Style presets
Natural, Russian, French and clinic presets, with adjustable volume.
Before and after
A side-by-side comparison of the face before and after.
Training data
Saved before-and-after pairs feed a dataset for training future models.
// the impact
This is a proof of concept, not a clinic's product. The live demo needs no login and works best on a phone, once you allow camera access. The 90-second video above was recorded with an AI-generated face of a person who does not exist.
// let's build yours
Have a product like this in mind?