PUBLIC MARKS from sbrothier with tag WebGL

How we used Polymer to create a high-performance WebGL mobile controlled Lightsaber that is modular and configurable. We review some of the key details of our project https://lightsaber.withgoogle.com/ to help you save time when creating your own next time you run into a pack of angry Stormtroopers.

In this demonstration, we build upon the previous example by replacing our static textures with the frames of a playing Ogg video file. This is actually pretty easy to do, but is fun to look at, so let's get started. Similar code can be used to use any sort of data (such as a canvas as the source for your textures.

Three.js supports some basic rigging and skeletal animation. The simplest way to achieve a nice character animation is to make it in appropriate software first. This article is going to be about Blender rigging workflow and how to do the best for a clean Three.js export.

Today I’ve faced a rather difficult problem to solve. Creating model in Blender, animating it with armature and exporting the animation to THREE.js (r56) JSON format.

Pixi.js is a devoted rendering engine. There are a host of other engines covering game, sound and physics etc. and they all work beautifully with Pixi. We know developers have their favourites for all these components in their projects and they use them for their strengths.

Can a comic still work in 3D? I don't know, but this website is a step towards finding out. Have an explore, have a laugh and have a good time!

Traditionally, maps have been expensive and time-consuming to make, but that’s changing fast. High-quality maps are easier to make every day thanks to OpenStreetMap and modern computer graphics capabilities, and we feel they can be pushed even further with ideas and techniques from 3D animation, video games, and other visual disciplines. To test this theory, the Mapzen graphics team has been working on a mapping library called Tangram.

I hope there's no snakes

If you've read some of my other articles on this blog you probably know I'm a fan of HTML5. With HTML5 we get all this interesting functionality, directly in the browser, in a way that, eventually, is standard across browsers. One of the new HTML5 APIs that is slowly moving through the standardization process is the Web Audio API. With this API, currently only supported in Chrome and as of October 2013 also in Firefox, we get access to all kinds of interesting audio components you can use to create, modify and visualize sounds (such as the following spectrogram).

A showcase of awesome JavaScript that pushes the boundaries of what's possible on the web, by @devongovett.

This is a demo of face substitution using the javascript library clmtrackr. Keep your face still until the facemodel has fitted and try out different masks from the dropdown. Note that the face substitution works best with good, even lighting. The demo also needs support for WebGL, and works best in Google Chrome.

3d mesh

Plus de 80 effets amusants à utiliser avec votre webcam. Prenez des photos et publiez-les sur Twitter ou Facebook !

YouGlitch is a website where the Corrupted GIFs created with Corrupt.Video are displayed. The Software (Corrupt.Video) allows its users to glitch videos stored on their computer, videos from their webcam or their desktop in realtime. When a clip is recorded, a 10 seconds video and an animated GIF are saved locally and automatically uploaded to uglitch.com

An experiment using WebRTC's getUserMedia feature to access the user's webcam and perform some effects using optical flow. Coded using oflow.js and three.js.

webcam mesh

WebGLImageFilter is a small JavaScript library for applying a chain of filters to an image.