Before I go any further, I’m playing my Get Out Of Jail Free card. I’m not a web designer, so some of the turns I’ve taken on my path to enlightenment may be wrong.
However, I wanted to put this down in the hope of opening up a wider conversation as I think it’s fascinating that marketers are increasingly having to gen up on UI, UX and technical design.
For any actual designers reading, please do weigh in on this, I’d love to hear your thoughts.
Flat design and iconography
The main difference between skeuomorphic and flat design is that flat doesn’t try to mimic solid, ‘real’ objects.
In effect, it removes the idea of iconography from the design. You don’t need a little 3D rendered button to click on an element, you just need to click.
For context, it’s worth knowing something about the history of flat design, which has roots in the 1950s, and the International Typographic Style (also known as the ‘Swiss Style’).
According to Wiki, it “emphasizes cleanliness, readability and objectivity.” In other words, big, clean images combined with Sans Serif and Helvetica fonts.
Here are a couple of classic examples:
And for comparison, Windows 8:
While it can still promote some confusion for users, it’s becoming more common and familiar, and as users we are developing new common gestures to cope with this, just as a system of gestures and responses evolved to deal with touchscreens in the recent past.
By removing iconography, flat designs become simulations, or particularly, simulacra.
The rise of simulacra
Simulacra are “copies that depict things that either had no reality to begin with, or that no longer have an original”, and you already see them all over the web:
(Interestingly, I actually had to write this article twice after forgetting to click that earlier).
Annihilating mechanics
While these simulacra are certainly elegant, the philosopher who originally came up with the idea, Jean Baudrilliard, noted that they have a particular aspect which in design is both useful and disconcerting. They serve to ‘annihilate mechanics’.
They remove all the cumbersome clicking and grinding that actual, physical devices rely on.
Offline, cars are probably one of the best examples of this. Think of all the technology rammed into a new automobile, and how hard it would be for the average person to fix, compared to a car from 20 or 30 years ago.
Online, this is great. No need to animate a click, which means your page loads quicker, and everything looks lovely and smooth.
On the downside though, things can run a little too smoothly for the users liking. Without a satisfying clunk, we’re not always sure if an action has actually been accomplished (or if one has been accomplished by accident).
In psychological terms, this is the fear that there is nothing underneath that lovely flat square. A fear exemplified recently by Virus Shield, an Android app that promised to safeguard your phone, but actually just featured an animated ‘X’ that turned into a tick.
It did nothing else, and by all accounts made $20,000 before it was pulled from the store:
What does the image conceal?
Trying to get under the hood and, to mix metaphors, work out how the magic happens may partly explain some of the current lust for coding. Everybody is doing it. If you don’t then you have to just assume that your iPhone works by magic (I am aware that huge piles of money also figure in the desire to learn to code, but that’s a discussion for another time).
This ‘fear of nothing’ is at the core of another design movement, one that coincidentally, almost directly followed the Swiss Style: Postmodernism.
Nothing = despair. What can fill the void?
I’m not going to delve too deeply into postmodernism here, but let’s just say that it revolves partly around the idea that nothing is new. We’ve seen and done it all before. Which is either utterly, existentially terrifying, or… quite liberating.
To address the terror, we need something to ‘fill the void’.
Otherwise we’re all slaves to small pieces of glass we carry around that may not actually do anything. There’s a lot that can be done about this.
From a user perspective, coding may be the best way to gain an understanding. For marketers, it might help to invest in content, meaning we can calm users and reassure them that these random apps will lead to a warm, human experience, rather than a nightmarish void. But I’m digressing.
Systems become ‘weightless’
The good side of all this is that the systems and UIs we design no longer need to be tied to any particular form.
To borrow another philosophical term, they become ‘weightless’. Objects on the screen are liberated from ‘the constraints of the figural’.
So rather than a small floppy disk icon, I could just as easily have a flock of starlings, or a lightning bolt. It’s an intriguing idea that features heavily in classic design’s next major movement: Futurism.
Futurism allows for this ‘playfulness of form’. Why have a square app icon when you can have a flashing star or row of dancers? Novelty and newness are the order of the day. Wouldn’t you rather squeeze a steel globe than push a button?
But there’s a problem (isn’t there always).
Online, users need a certain amount of standardization. Otherwise, no one knows what the hell they are doing.
Flat design works well because it relies heavily on grids. Objects are tethered in place.
Part of this is evolution, part intuition. As users, we know roughly where to look when we want to accomplish something. This alone means that Futurism, while not lacking totally in form, may be unsuited for web design.
Form that communicates concept
So where is design headed?
Discussing this in the office bought up a particularly interesting point: How would you design a UI for a device without a screen?
As the Internet of Things grows, we’re going to need ways to communicate with more than just screens. Your house needs instructions. Cans of Soup may need to send you a text. In short, we’ll be dealing with digital appliances as often as we deal with actual ‘computers’.
I’ve been thinking about it and (bear with me on this next bit), the best solution I could think of was a garden.
Gardens have form and meaning. Whether these are described in the formal lines of Versailles, or the meandering, organic forms of a Chinese Element Garden.
Entering a garden we are confronted by an inspiring array of elements, each unique to its location, but all placed to direct and communicate with the visitor, conveying subtle ideas, or even political or religious commentary purely through form.
It’s far from an ideal analogy, but I do think the idea that UIs may evolve in the next few years to communicate concepts through varied forms is at least worthy of consideration,.
We haven’t seen the last of more traditional design work by a long shot. I’m certain ‘click here’ will be with us for many years to come, but as devices and usage evolve, it’s going to become more important to find new ways to communicate with users.
I’d love to hear what you think about this – are we headed for a connected web full of fireworks and bouquets, or do proven, formal grids just work? Please do let me know what you think.
Now if you’ll excuse me, I‘ve got some begonias that need pruning…
Comments