For a long time now, the design of websites and apps has been determined by what is happening in the real world, and a real world influence has pervaded UIs and app icons since they were first imagined. Buttons look like buttons, notepads have lined paper as their backgrounds, calendars look like the sort of calendar you have on your wall at home. You get the idea, realism, rather than functionality, has been the name of the game when it comes to online design.
Simple Rather than Realistic Design
That is all starting to change now and is mainly down to the change in how we use the devices around us. The advent of smartphones and tablets has forced designers to think more about how people interact with their work and this has resulted in a move away from bevelled buttons and 3D icons to a much more simpler type of design.
Termed ‘Flat-Design’, this idea is probably best shown in the Windows 8 UI and the latest Apple OS. Yes there are buttons, yes they are interactive, but they look so much more clean and simple. They look functional and that is the root of this trend, functionality.
The buttons are flat, there are no raised edges and no shadows. The UI is at practical as well as being simple to use and inviting. Flat-Design requires a lot more work from a designer since colour, shape and font become more important than in a realistic design. To make a login box, for example, flat, the designer has to use all their skills to make sure the input spaces, labels and the action button are easily recognised and also display clearly on the screen.
Skeuomorphism and Flat Design
Flat-Design has also seen a move away from skeuomorphic design, particularly for icons. No more does an icon have to look like what it represents (a navigator looking like a compass, for example) instead designers are beginning to be more free-form with their designs. The way users perceive the design elements, though, is still important. Buttons that do not follow the skeuomorphism school of thought need to be clear and obvious else they will confuse the user and they will move off the site.
Design has to support the content of a site, not the other way around. Be aware of trends in your design, but do not become locked into them. Design helps users flow through the site, the tools you provide in the way of buttons, text and UIs should aid this flow, but they are not the reason the user came to the site in the first place; that is always for the content.
Trends in Design
Design trends have come and gone in the past, from the frames of yesterday to the cutesy realism of many apps most recently. Flat Design will be no different and, as it is an online trend, it is likely to be over much, much faster than in the past. Today Apple are trendy, but tomorrow? Today Windows 8 is modern, but tomorrow? And the real problem with flat-design comes with the plethora of devices we use to access content. A design planned for a large screen, especially if its an app, may well be found wanting if it does not display correctly on a tablet or smartphone, whether it is flat or realistic.
Content First, then Design
Users expect the same functionality from all of their devices and, yes, they expect the same styling as well. So when you are designing your new site start with the content first – that is what users want. The styling, in fact the whole design is nothing more than a way to solve certain problems, it is not the raison d’etre of the site.
An example of this content first approach towards design can be seen in this minimalist, content centric site: http://www.mathewporter.co.uk
About the Author
Mathew Porter is an experienced Web Designer and Developer with experience in various other Online Marketing and Ecommerce fields. He is currently the Creative Director at Kumo, a Design and Marketing Agency in Nottingham / Derby, UK.