Camera / Depth Lab
Камера працює локально у вашому браузері
Візуальний експеримент · 01
Подивись,
як бачить камера.
Увімкніть камеру, подивіться на себе, а потім піднесіть екран телефона. Зелена карта покаже зміни яскравості та контрасту в кадрі.
Готові перевірити глибину?
Натисніть кнопку нижче — відео та аналіз залишаються на цьому пристрої.
Inside the experiment
Від кадру
до сигналу.
Кадр проходить чотири логічні стадії: браузер отримує MediaStream, Canvas перетворює його на пікселі, vision-модель повертає landmarks, а challenge-flow приймає рішення з урахуванням порогу, часу утримання та помилок.
Quick tutorial
1 / 4 кроки
Starter implementation
camera-pipeline.ts · крок 1/4 · новий блок
const stream = await navigator.mediaDevices.getUserMedia({
video: { facingMode: "user", width: 1280, height: 720 },
audio: false,
});
video.srcObject = stream;
await video.play();Як розширити: додай cleanup для stream і landmarker, try/catch навколо inference, random challenge nonce, confidence policy та anti-spoof signals. Не зберігай face landmarks без чіткої потреби й згоди.