In flight is a four part interactive infographic documenting 100 years of air travel. It’s a very well crafted HTML5 experience. All four parts of the project are preceded by guided animation and voiceover to explain the point being made and the data that supports it. The user is then free to explore the data before moving on.
- Mapping the skies is a modern interpretation of Aaron Koblin’s Flight Patterns project, but computed from live data.
- In birth of an industry we travel to Tampa Bay, Florida to hear about the the beginnings of commercial air travel.
- A century of growth charts ticket sales and the reasons behind their staggering rise over the last 100 years.
- Hitting the Limits looks at the projected growth of air travel and if the projected numbers are actually sustainable.
The project was developed for The Guardian by London data specialist Kiln. Founded by ex Guardian employees, Kiln specialise in using interactive data to tell stories. Members of the project team include Duncan Clark, Robin Houston, @effisfor and @franpanetta.
]]>
20 years ago Sanity released the Interference dentro on the Amiga and blew pretty much everyone away. It had a fantastic combination of excellent graphics, a superb soundtrack by Virgill and some very technically advanced coding (and cheating!). It’s little wonder it’s rated so highly in the Amiga demoscene.
20 years later one of the original coders Joerg Messner (Microforce / Sanity) has decided to recode it all in JavaScript / Canvas. The code is kept purely to the Canvas API with no WebGL or shaders being used. It’s interesting that Joerg doesn’t consider it a true demo, because when you have no limitations there’s no real technical challenge left, it’s just down to design and art, which I can appreciate for sure – but even so some of the canvas effects he manages to pull off in Interference are still top-notch, even 20 years on.
Personally I find it fascinating how many old sceners are using the browser as a means to express themselves creatively these days, and having a lot of fun while doing it. Sites like We Are Back now hold upwards of 240 HTML5 demos and is constantly growing.
So kick it back old-skool for a moment and view Interference Recoded. Joerg recommends Chrome but it ran fine in Firefox 25+ for me, and even mostly runs in IE11 other than one small part.
]]>
Code Club is an organization that runs after school coding clubs for kids world-wide. Something we probably all wish we had around when we were younger! They’ve created Robo-Boogie – a super fun site encouraging kids to try out some coding to make their very own dancing robot. But you don’t have to be a kid to try it out. Pick from a cast of friendly robots and play choreographer using sliders in basic mode, or dig right into the code in code mode. You can save your robot’s amazing moves to share with friends if that’s your style. Or just see if your robot could hold its own in a dance-off with the ones entered into the contest.
I assume all our readers are a bit outside the required age range, but if you know any kids age 6 to 11 in the UK, have them enter their dance into the contest. There’s just one day left to enter!
Robo-Boogie
by Hover, Albion, Timothy Winchester. & Code Club
This project is a little different than most we feature here, as it exists mostly outside of traditional screens. That’s not a place we often see web technologies used!
Star Canvas is an installation built by B-REEL to help celebrate their office’s fifth anniversary. The project uses WebGL, a canvas-based tool for creating constellations, and audio generated with Pure Data to make the whole thing an immersive experience. Check out their video for the full story. It looks like it was a whole lot of fun to build and use!
Star Canvas
From B-REEL
Tactile Tentacles is a neat little canvas experiment by Eugene Krivoruchko (@crookookoo). The experiment (as you would guess) features a multitude of interactive tentacles, which react to your mouse movements and clicks, as well as your laptops accelerometer.
In the end, there’s no better explanation than Eugene’s own:
]]>Tactile tentacles is an interactive experiment in the realm of colorful uselessness.
Squishy Earth is a playful little experiment by Byron Knoll (the name says it all, really!), showcasing an impressive little bit of volumetric physics, and some very smooth deformative textures.
Impressively enough, the experiment also runs fairly well on mobile, using the hammer.js library to manage touch inputs.
]]>
Radius Raid is a sharp little javascript + canvas game made by designer & developer Jack Rugile (@jackrugile) for this years js13k games competition.
Reminiscent of asteroids, as well as the more modern geometry wars, radius raid has you flying a small ship, defending your self from hoards of spherical enemies, and performs more than admirably (a consistent 60fps for me) for a javascript based game, built entirely on the canvas.
The controls are a little tricky to get a handle on at first, but once you’ve got them down, the game plays fantastically.
]]>
Is it raining where you are right now?
Do you wish it was?
Rainyday.js might be just what you need. You can get that meditative feel of watching rain on your window right in your browser. Hardly practical by any definition, but it’s quite fun to watch! There are two demos for you to check out, and it’s on github so you can even create your own perfect rainy day.
]]>
This piece from Mathieu ‘P01′ Henri is a 3D city crammed into a mere 256 frikkin’ bytes of JS.
Having seen Jerome Etienne’s procedural city tutorial, itself inspired by mrdoob’s threejs city generator, Mathieu figured he’d see how low he could go…
Pretty low as it turns out.
Read the accompanying overview, weep over the source, respect the art 
[UPDATE] Mini district is based on Mathieu’s earlier 1K demo Minami District – also worth checking out!
MINI DISTRICT
Overview
Jerome’s procedural city tutorial
mrdoob’s city generator
Here are two fun image manipulating experiments from Georg Fischer to start off your Monday! One for making your own glitch art, and one for distorting your favourite scenes beyond recognition.
Glitch Image might not look like much at first, but once you dig in, it’s really fun. Transform any image you have lying around into some fancy glitch art in a few seconds. You’ll be surprised with the range of results you can get!
Or, maybe distorting images is more your style? Distort Images is a similar experiment that distorts your image based on the grid parameters you choose.The source for both experiments are on github as well for digging into all the behind the scenes details.
]]>