Atomic design, before it was a thing


The new vw.co.uk launched in February 2008 broke new ground in using Adobe Flex to enable a degree of seamlessness and interactivity in the new cars area not seen before outside video games.

By 2012 however the world had moved on and Flash-based technologies were nearing their expiration date. It was clear we had to replace the new cars area with a new solution powered by a robust CMS not only built in HTML5 but also fully compliant with responsive design best practice.

As UX Lead I proposed a new strategic template strategy codenamed NCSA Mosaic (after the original web browser), exploiting the latent possibilities suggested by the recently-renewed HTML New Model Landing Page (see above).

This system was intended to accommodate the full range of page structures characteristic of the new cars section of a car website, and also featured a kind of z axis in which the range of cars was laid out on a two-dimensional map and the view zoomed in or out according to the level of detail required.

The approach was not so much "liquid" as a "lumpy liquid" responsive approach, where quasi solid components would float into position according to the media query.

This modular approach to system components owed much to my original training as an architect and prefigured more recent developments going the under the title of Atomic Design.