A few weeks ago I was sat with good pal and developer @frasiocht (Brendan) talking about the latest OS update for the iPhone which enabled the Safari browser to access the accelerometer. I asked him how easy it would be to create a snowglobe and be able to shake the phone to make it snow on-screen. Within 24 hours Brendan had a hacked-up working prototype.

I began to put together the template for the page and asked the awesome illustrator Leigh (@leighpearce) if he could create some lovely festive graphics and the look and feel for the snowglobe and robot. I cracked on with creating the footer. Once we were done, it all got sliced up and handed over to Brendan to stitch together.

We all managed to nick a few hours in our spare time to put this together and get it out before Christmas and although there’s some missing aestical touches, it defo works as a proof of concept.

This sort of stuff is going to be amazing for the mobile web, it gives you the ability to create massively engaging experiences whether it’s a site, advertising banner or game. We’ve already seen some examples of the possibilities with the gyroscope.

Give it a go! Demo link: http://pus.hu/g6pKPI (Tilt phone forward and back for best effect)

If you’re interested in what this could mean for mobile advertising, check out this post I wrote in February 2010.

Remember this is early days for this feature in browser so there’s certain things which don’t quite work as expected. One problem is that you can’t disable the iPhone switching from portrait to landscape view when you shake the phone, so the screen spazzes out quite a bit (that’s why tilting to move the snow around works a bit better).

It may also throw you out of Safari every now and then, if you find it is running reaaallly slow, close Safari from your multi-tasking bar and then try again.

Big shout out to Brendan and Leigh for making this!

Any issues? Feedback? Leave them in the comments.