Virtual try-on
A camera or photo preview that places the product on your face, body, or room before you buy it.
See it
What it is
Virtual try-on places a scaled product preview into a live camera view or uploaded image. Face landmarks can anchor glasses or makeup; body tracking can place apparel; plane detection can put furniture on a room floor. Snapchat Lenses made the face-tracking version familiar long before it became a store feature, and IKEA Place did the same for furniture in a room.
Reach for it when appearance, scale, or room fit blocks a purchase and the product has accurate visual assets. It is a confidence tool, not a promise of physical fit, so label simulated color and scale honestly.
Gotcha: tracking errors, lens distortion, lighting, hair, and occlusion can make a plausible overlay wrong. Ask for camera permission only after a clear user action, explain whether images leave the device, provide a normal photo fallback, and never hide measurement or return information behind the effect.
Ask AI for it
Build an on-device eyewear try-on using navigator.mediaDevices.getUserMedia and MediaPipe Face Landmarker. Ask for camera access only after the shopper presses 'Try on', mirror the preview, anchor a transparent glasses asset to the eye landmarks, and smooth position, scale, and rotation with an exponential moving average. Show loading, denied-permission, no-face, and unsupported states with a photo-upload fallback. Keep camera frames in the browser, stop every MediaStreamTrack when the viewer closes, and state plainly that the overlay previews appearance rather than guaranteed fit.