Armed with around 20 sheets of A4 paper in different colours, a craft knife, guillotine, ruler and glue stick I was ready to start experimenting and creating physical paper versions of websites. I had to examine the layering of interface designs. With Facebook, for example, the background is a light grey, and the blue strip across the top is an iconic part of the web design that we now all immediately recognise. I tested how many different layers were required before the webpage was recognisable as Facebook.com. Facebook's strong brand recognition meant a simple grey rectangle with a blue strip across the top was significantly recognisable in the context of website interfaces.
With over 2 billion monthly active users, Facebook is seen millions of times a day in every country. People across the world are continually being exposed to this design language so in many ways it has become iconic. Unlike branding or packaging design, interfaces don't get the same recognition, perhaps because they have a functional role that steals the attention away from the aesthetics; never the less, it's a crafted piece of design that has an emotional and symbolic significance. The same way the patented Coca-Cola contour bottle or the McDonalds' Golden arches are synonymous with their brands, the user interface design of Facebook or Google can now be a crucial part of the brand recognition. This can affect loyalty, user behaviour, the design of competitor UIs and add to the brand's monetary value.
I created paper versions of Facebook, Netflix, YouTube and Google. In a digital world, building something like this is relatively straightforward; it involves different rectangles and circles arranged on a page. Adobe's rulers, smart-guides and align tools mean it's effortless to create boxes and shapes the same size in perfect row or column. In the physical space, however, this is much more challenging as each rectangle had to be carefully measured and precisely cut to ensure it was the same size. Before being stuck down on the page, it also had to be delicately aligned manually. So much precision is required to line up shapes perfectly that my attempt inevitably resulted in some paper elements being a millimetre or two out of line. Despite the inaccuracies in alignment, this added to the end result as it emphasised that the web pages were made from sheets of real paper, not an on-screen render. The imperfections enhanced the aesthetic value.
This experiment really showed me how a user interface design itself without any text or detailed imagery can be iconic, recognisable and easy to distinguish. In the case of my experiment, the more iconic websites with simpler designs such as Facebook and Google were more easy to recognise than a site such as Netflix where the user interface design relies heavily on detailed imagery and video thumbnails. We are not used to analysing the proportional relationship of objects on a webpage. However, when we simplify them down to the core shapes, it's easy to see that our brains are very good at picking up on where things are and what things do. By removing all of the clutter, these simplified pages showed essential parts of the interface highlighting the success of the brand experience designers at these companies. This level of design is something that is invisible to most users, so I really enjoyed using this project to shine a light on something we benefit from every day that goes unnoticed.
