Tag Archives: getusermedia

Video Music – Make music by flashing colored items in front of your webcam

March 28, 2018 by Bramus! Leave a comment

This makes music and needs access to your camera. The average hue from your camera controls which chord will play. Video Music →

Elsewhere , , , , Leave a comment

Stinkmoji – Animoji on the web

February 25, 2018 by Bramus! Leave a comment

Powered by getUserMedia() and WebGL: Stinkmoji →

Elsewhere , , , Leave a comment

HTML Barcode Scanner

November 3, 2013 by Bramus! 8 Comments

window.addEventListener(‘load’, function() { barcode.config.start = 0.1; barcode.config.end = 0.9; barcode.config.video = ‘#barcodevideo’; barcode.config.canvas = ‘#barcodecanvas’; barcode.config.canvasg = ‘#barcodecanvasg’; barcode.setHandler(function(barcode) { document.getElementById(‘result’).innerHTML = barcode; }); barcode.init(); }); An HTML5 barcode scanner which scans EAN-13 barcodes using a webcam. HTML Barcode Scanner … Continue reading →

Elsewhere , , , , , 8 Comments

WebCamMesh

February 12, 2013 by Bramus! Leave a comment

WebCamMesh is a HTML5 demo that projects webcam video onto a WebGL 3D Mesh. It creates a ‘fake’ 3D depth map by mapping pixel brightness to mesh vertex Z positions. Perlin noise is used to create the ripple effect by … Continue reading →

Elsewhere , , , Leave a comment

Responsive Typography using Face Detection

February 11, 2013 by Bramus! Leave a comment

Typesetting based upon your distance to your screen. Clever use of WebRTC’s getUserMedia and JavaScript Face Detection In case you don’t have a capable browser, this is what it looks like: Responsive Typography: Breakpoints Demo → Responsive Typography: Realtime Demo … Continue reading →

Elsewhere , , , , , Leave a comment

WebRTC RTCPeerConnection interoperability between Firefox and Chrome

February 4, 2013 by Bramus! Leave a comment

RTCPeerConnection (also known simply as PeerConnection or PC) interoperability means that developers can now create Firefox WebRTC applications that make direct audio/video calls to Chrome WebRTC applications without having to install a third-party plugin. Because the functionality is now baked … Continue reading →

Elsewhere , , , , , Leave a comment

headtrackr

December 8, 2012 by Bramus! 1 Comment

headtrackr is a javascript library for real-time face tracking and head tracking, tracking the position of a users head in relation to the computer screen, via a web camera and the webRTC/getUserMedia standard. headtrackr (GitHub) →

Elsewhere , , , 1 Comment

Fun with face detection, canvas and webcam video

December 1, 2012 by Bramus! Leave a comment

With the getUser­Me­dia API, a video ele­ment, a can­vas ele­ment and LiuLiu’s excel­lent face detec­tion algo­rithm, we can eas­ily play around with web­cam video data in the browser, plug-in free. Mask over­lay experiment: Scaling content experiment: Cool! Fun with face … Continue reading →

Elsewhere , , , , Leave a comment

Photo Booth in your browser

February 22, 2012 by Bramus! 2 Comments

Use Canary Chrome (and enable MediaStream in about:flags) to actually use your webcam instead of the provided recording. Works surprisingly fast. HTML5 Webcam Toy — Photo effects using WebGL and getUserMedia → (via badassjs)

Elsewhere , , , , , , 2 Comments