The Sublime Text Website has some nifty animations to show of a few features. Turns out they’re not animated gifs. One of the criteria was that the animations should work everywhere, from IE6 to an iPad. This ruled out two common video options, Flash and the <video> element. Animated GIF files would have been a …
Tag Archives: canvas
Suncalc 3D
SunCalc 3D is an HTML5 application with a 3D panoramic view of the sky that shows how the Sun moves during a particular day for a given location, along with important sunlight times such as sunrise, sunset, dawn and dusk. SunCalc 3D calculates sun data on the fly, uses Canvas for rendering, and Geolocation, Google …
Paper.js
Paper.js is an open source vector graphics scripting framework that runs on top of the HTML5 Canvas. It offers a clean Scene Graph / Document Object Model and a lot of powerful functionality to create and work with vector graphics and bezier curves, all neatly wrapped up in a well designed, consistent and clean programming …
Run Puma Run
Wind Map
BrowserQuest
BrowserQuest is a tribute to classic video-games with a multiplayer twist. You play as a young warrior driven by the thrill of adventure. No princess to save here, just a dangerous world filled with treasures to discover. And it’s all done in glorious HTML5 and JavaScript. BrowserQuest → Background Info → BrowserQuest Source (GitHub) →
Spectrogram – Canvas based Musical Spectrum Analysis
Sound frequencies are displayed as they are heard. Lower frequencies are mapped low (bottom) to high (top). Brightness is determined by amplitude. Sweeping tones and rhythmic patterns create intricate structures. The circular form is in memorial of dead formats; the CD, MiniDisc and others. R.I.P. Here’s a Leesa’s The Mansion run through Spectrogram: Built by …
Continue reading “Spectrogram – Canvas based Musical Spectrum Analysis”
getUserMedia Moustache
This demo uses getUserMedia (formerly known as HTML5 <device>) to get data from a device camera, then copies it into HTML5 <canvas> in order to analyse the pixel data. It then peforms facial recognition in order to superimpose a marvellous magical moustache. Special Opera Developer Build required. Magical getUserMedia moustache → Opera getUserMedia Labs Build …
Web Typography for the Lonely
Web Typography for the Lonely is an ongoing collection of experiments and writings on web typography and the possibilities of standards-based web design. It aims to inspire the web community by pushing the boundries of what is both possible and practical in web standards in a manner that is compelling and exciting to the visually-minded …
HTML 5 Canvas Deep Dive
Very solid and in depth presentation on getting you started with canvas. This session is a three hour workshop that will deep dive into Canvas, starting with the basics and progressing into real world applications. Finally we will take a look at some experimental edges of Canvas, such as webcam and audio visualization. This is …