Category Archives: HTML5

Processing.js Experiment – Noise Field

I built this demo by porting one of my old Processing sketches to the fantastic Processing.js. The demo draws particle trails using Perlin noise to direct the particle motion. Move the mouse to change the noise function and click to randomize the particle drawing parameters.

Processing.js is a JavaScript port of Processing that renders to the HTML5 Canvas tag. It was originally built by the same guy who built jQuery. It’s nice to have a framework for handling common drawing and math functions. As a bonus, if you are familiar with Processing you will be able to jump right in.

Three.js Experiment – Cube Explosion

  • Posted On: July 19th, 2010
  • Posted In: 3D, HTML5

Had a chance to play with Mr.Doob‘s excellent JavaScript 3D library three.js today and came up with this. Resize your browser down and Refresh to increase performance. Grab the code via ‘View Source…’.

I’m getting ~54 FPS on Chrome, ~43 FPS on Safari and ~30 FPS on FireFox. The iPad gives a sad 7 FPS. To run on IE you will need the Google Chrome Frame Plugin.

There’s definitely a lot of potential in this library.