Create an animated interface

Eddie Gachegua and Neil Muralee explain how to create a dynamic web frontpage, using only some simple code.

Shares

Ever wondered how to create a smoothly animated interface for your website, without using Flash?

Based on a grid of images that expand smoothly when you drag your mouse over them, this project feels like Flash, but is all done with JavaScript and CSS. Television production company Lion and digital agency Numiko used this technique to build their Britain From Above site for the BBC, and the site went on to scoop an Interactive Emmy.

As a visual interface it's extremely versatile, and would make an excellent portfolio site for a photographer or illustrator, for instance. In this project we design the image grid in Photoshop, then explain the code to get it working.