Augmented Reality Performance

Mixing graphics and the real world is nothing new - hollywood movies have been doing it for years with CG heavy films topping the summer blockbuster list each year.
The difference now of course is what used to cost millions to produce, is now in the hands of a growing band of developers and producers who can create live action experiences with a fraction of the budget and what’s more do it live, in real time and make it interactive.
Creativity is just connecting things
Fine by Virgilio Villoresi
2012, Hand, Hand Painting
Fine is the story of birth, life and death of a soldier, represented on a hand
The movie is inspired by the concept of handpainting, very close to the works of italian artist Mariotti and the finger videos movement. Dedicated transitions created with the technique of the shuft pan has been used to create a true cinematografic editing through the hand.
both the initial and final soundtrack, as well as the military salute of the last scene are a hommage to Jiri Trnka’s masterpiece “The Hand”.
Tilt Shift Video
I know this is a fairly established visual affect but I wanted to put it on record as something I like and I’m not bored with yet!
What amazes me is how such seemingly mundane subject matter can be elevated with such a simple trick.
If you didn’t know, this is achieved using the Tilt-Shift effect, enhanced to some extent through the audio. Tilt-Shift is a visual device I came across a year or so back and can be effective as either a video or an image. There are lots of example videos out there but the best ones I think are the ones that focus on the least interesting of daily activities and somehow manage to elevate them beyond anything we thought possible.

If you are interested there are a number of very easy ways to achieve a similar result for both moving and still images. Many smart phone camera apps also include the function, as do several photo apps for post production manipulation on your old footage.
Tutorial on how to achieve the affect:
Using photoshop
http://visualphotoguide.com/tilt-shift-photoshop-tutorial-how-to-make-fake-miniature-scenes/
Using the Chrome browser app Tilt-maker
(You need to be using Google Chrome to download this)
https://chrome.google.com/webstore/detail/hjjofhgnhekhkccpcnnloagmdpafifeo
Powercam - Iphone app
Allows you to take photo’s and video - you’ll need an iphone to use it!
http://itunes.apple.com/gb/app/powercam/id453180850?mt=8
BeFunkyFx - Iphone app
Allows you to turn existing photos into Tilt-Shift-esqe images
http://www.befunky.com/explore/tag/befunky-fx/
The photos of Audrey Heller:
Not achieved with the tilt shift affect but equally fascinating
http://squint-pictures.myshopify.com/
HTML5 Abridged | A Resource Overview

I created this guide as an HTML5 resource for myself as much as anyone else. It’s a straight up, no nonsense guide of everything you need to know about this developing markup language.
Over time I will update it with fresh links to other resources and tutorials for those who wish to explore further. I hope you find it useful.
Top of the list for resources is the W3Cschools website. You can use it to try out your HTML5/CSS3 and JavaScript. I will point to other specific pages through out my overview:
Animation Short - The Night Of All Fears
Created By Cyril Corallo, Emmanuel Briand, Gaaelle Rouby & Jonathan Malnoury
A creative challenge to bring life back a classic B-Movie genre
I chose to showcase this here because it is created & animated entirely in FLASH (save for some paper drawn character design and storyboarding. It just goes to show what can be achieved with a nice little story and some animation talent.
No fancy 3D effects or sophisticated software. In fact, the same could be achieved with even an outdated version of FLASH, which illustrates the point that it isn’t the tools that make something successful it’s how you use them.
You can check out the ‘making of’ below which show’s the production process off from start to finish very nicely.
True Motion Graphics
Audio and beat reaction No. 2 | By Diana Lange | Created using Processing
Three stunning examples of computer code and imagery coming together to produce beautiful Art. For those interested they are achieved by the very established coding api called Processing.
Taxi Driver - Kinetic Typography
There seems to be a plethora of kinetic typography animation on the web from both the professional and the graphics student - I guess it’s an obvious task to set an undergraduate. This one is slightly special not only because it is good but because it uses a scene in the brilliant film Taxi Driver as it’s inspiration.
This the last kinetic typography video I’m going to showcase for a while. Head over to my dedicated Kinetic Typography category on the left for more continuously updated feeeeeeds - bare in mind that I haven’t chosen these as they are a dynamic link from someone else (using my very own feed script). I’m confident there should be some gems to inspire you.
200 Free Tools For Professional Web Development

“As an engineer, there is a short list of tools that you must be rabid about. Rabid! Foaming at the mouth crazy.” - a quote from
I’ve got a list of tools here that I use everyday…. well not every day, but I do use them so I’ve only included those that I think are worth sharing. I thought it might be useful for others too.
These are all tools that Web Application developers should know or should be actively learning. Let the tools do the work!
I’ve got a load more that I’m going to add here over the coming weeks.
If anything it should be a useful resource!
Kinetic Typography
Kinetic typography - the technical name for “moving text” - is an animation technique mixing motion and text.
This text is presented over time in a manner intended to convey or evoke a particular idea or emotion. It is often studied in Communication Design and Interaction Design courses. Some commonly seen examples of this technique include movie title sequences and credits, web page animation and other entertainment media.
This post features a ‘dyamic feed’ of motion graphic videos which are constantly updated. I will include it as a permanent link in the navigation on the right so that it is easy to find.

