Monday 22 September 2014

Big design

gov.uk
When the award-winning gov.uk site launched in 2012, it marked the moment ‘big design’ entered the mainstream.

Driven partly by the need to be accessible, and partly by the requirement to work on mobile devices, the launch of gov.uk also coincided with the design industry moving from skeuomorphic design towards the flat aesthetic seen in Microsoft’s Windows 8 ‘Metro’ interface, Apples iOS8 and Google’s Materials Design.

This combination of HTML5 dynamic backgrounds, overlayed with large type and control icons on flat colour panels has created a youthful ‘flat’ UI design meme that references the Bauhaus and Swiss Design schools and provides a single underlying system providing a unified experience across platforms and device sizes.

The new BBC responsive website, now in beta testing, follows the same principles.




BBC Beta

Every week, the BBC News website gets around 115 million visits, and the number coming from mobiles and tablets is increasing all the time to the point that these devices now account for 43% of unique browsers.

Looking at device usage, it seems clear that the increased take up of tablet and mobile devices, with their requirement for larger button target areas, is driving the move towards ‘big design’.


Apple iOS7
For any organisation, maintaining different versions of websites for desktop, tablet and mobile (as well as accounting for different screen sizes, different browsers and legacy systems) is unsustainable. Designing simpler responsive sites, optimised for different screen sizes, is the most efficient structure, but it means that control areas designed for display on mobile devices take up a proportionally larger area of screen when displayed on a desktop device.



Microsoft Metro/Windows8
Google Material Design
This also represents a shift in the way websites are designed. In the early days of the web, websites were merely ‘brochureware’ extensions of printed publications. (The first web page I designed for the DTI just had a telephone number on it.) Then came sites that replicated the (sometimes labyrinthine) internal structure of an organisation. In the third wave these sites were turned around to be more user-centric.

Now we are seeing the rise of more focused task-centric sites, and enabling users to carry out these tasks (often on the move) using a simple graphic UI that stands out from the background visual noise is a major driver in big design.

But in deploying large blocks within your content, the challenge now for a designer is how to develop the visual structure without losing a sense of style.

The resolution of mobile screens means that good typography, tracked and spaced with as much precision as print, is now achievable. Icons and other UI elements don’t need candy stripes or glossy reflections to make them look better at low resolutions.

So while it’s good to know what best-practice is, it’s possible for designers to push the boundaries, because we can.