Creating a HTML version of this blog’s header

Update: this post was made when I was using a different blog design. Please view the original swf file here.

Below is a little experiment I did which involved creating a version of this blog’s image flipping Flickr feed header (which I made in Flash) – in HTML/CSS/Javascript.

Luckily jQuery includes a JSON parsing feature and Flickr provides a JSON feed and so it was very easy to get the Flickr feed. The image flipping was done with CSS3’s 3D transforms and so unfortunately it will only work in Chrome and Safari. Now I just need to work out how to get more than 20 images from the Flickr feed (I need 36 to fill the header), and turn the images black and white. I found a jQuery plugin that apparently can apply image effects but I haven’t gotten it to work yet.


Inspiring Inspiration #5

A collection of awesomeness from Vimeo…


Falls Creek with a GoPro HD Hero

A couple weeks ago I bought a GoPro HD Here camera. The video below is the first test using the camera mounted to my helmet. I was planning on doing some shots with it mounted to my board but the sticky stuff failed the second I started moving!

I’m pretty happy with the quality of the video, except the waterproof casing kept fogging up in the centre of the lens which rendered a lot of footage unusable. I shot at 1280×720 @ 60FPS. The clips with the tilt shift effect were graded with Magic Bullet Looks and the others just have a simple curves adjustment applied to them.