Flat design, affordance and taking responsibility
Flat design is as the name suggest a very simplified, pared back design aesthetic favouring design elements that lives on a 2D plain hence the name.
First championed by Windows Mobile with Metro it is now favoured at Microsoft, Apple and Google. Google having developed their Material Design standards based on flat design:
It is thought to have developed as a direct result of skeuomorphic design or an overly heavy use of real world design cues and textures. The worst example being iOS Podcasts app:
Flat design is seemingly simpler, it is certainly easier on the eye but it suffers from a big usability problem. There is no affordance.
Let’s talk about doors. In his seminal book on design The Design of Everyday Things (you have read it right? Amazon USA | Amazon UK) Donald Norman talks about the problem with push and pull doors and how a design can make you feel stupid.
It’s a problem we’ve all come across, even George Bush.
By looking at the handle of a door you should know how to open it.
A push plate to push the door a pull handle to pull a door. (sorry for the crappy stock imagery!)
Affordance in digital, or how flat design gets it wrong
Here’s an example of a first time Google user who is educated, has owned a feature phone for a few months and is asked to search for images of his favourite actress:
There are a number of ways the design could be improved. Maybe adding help text? Or adding the word search to the button? Neither of these approaches will be as successful as making the text box look like a text box and making the search button look like a search button.
Adding help text doesn’t ever work, how many times have you tried to pull that handle to open the door and not read the help text “PUSH”? It happens all the time.
Adding help text doesn’t help. It takes more brain power to understand the door.
The same is true in digital design. From the iOS set-up process. Which of these items are links? Where are the visual cues? The links have no affordance. The same is true of Google’s Material Design. Where do I click to get more on the forecast? Which parts of the music player can I interact with?
It’s not easy to understand. It takes time to figure the interface out. That’s fine if you are an educated, experienced internet user but if you are, you are in the minority. Many people struggle with flat design.
We need to go back to basics
Flat design is an aesthetic reaction to over used real world design cues. We need to reign it back. Buttons need to look like buttons again, text boxes need to look like you can type in them.
I’m not advocating going back to 1998’s design approach but it rejecting the old we’ve lost a lot of what made designs work. We lost text boxes the look like you can enter something in there and buttons that look like they can be pressed.
We need to stop designing for ourselves and take collective responsibility for our designs because we are alienating our users by blindly following fashion.
Originally published at Joe Leech.