Detection. Two small convolutional networks run entirely in your browser via TensorFlow.js
(face-api.js):
a TinyFaceDetector finds the face box, then a 68-point landmark network locates the jaw,
eyebrows, eyes, nose and mouth within it. Both model files together are under 600 KB and are vendored
in this repo — no CDN, no API call, no network request carries your image anywhere.
Capture. A capture is a 480×480 snapshot (from your camera or an uploaded photo) plus the 68 landmark points detected on it, with 8 extra points added around the frame's edges so the whole photo warps smoothly, not just an oval cut-out of the face.
Morphing. The 68+8 = 76 points always mean the same thing in the same order for every capture
(point 30 is always the nose tip, point 8 is always the chin, and so on), so instead of re-triangulating
on the fly, this app uses one fixed Delaunay triangulation — 142 triangles — computed once offline
on a canonical face layout and verified to exactly tile the frame with no gaps or overlaps (triangle-area
sum matches the convex-hull area to floating-point precision). At blend position t, each triangle's
target shape is the linear interpolation between its shape in photo A and photo B; both photos are warped
into that shared target shape with a per-triangle affine transform (ctx.transform + clip +
drawImage), then cross-dissolved (A drawn opaque, B drawn on top at alpha t). That's
the whole algorithm — the same one behind classic photo-morph effects, just computed live in a
<canvas>.