There’s been growing unrest about the future of interaction design trends. In the past week alone, I’ve read three separate discussions about the so-called “end of flat design.” This kind of talk is awesome because some of the best aesthetic and interaction design work is done at the dawn of a brand new trend. It gets designers thinking and inspires that special kind of creativity that our industry thrives on.
The pendulum swings
In the beginning, CSS only allowed for basic control over HTML documents. As web design technology grew up, the skeuomorphic aesthetic took hold, pushing the boundaries of what was possible on the Web. But as the style matured, some interfaces became difficult to use, confusing, or downright ugly. We abused the textures, shadows, and fine details that helped us define our industry. Designers and developers wanted something fresh and simple to replace it.
The flat movement was born out of a need to get as far away from skeuomorphism as possible. Shadows and metallic sheen were replaced with solid hues and typography-driven design. It was a harken back to the Swiss ‘international style’ of design where strong typography and blocks of color reigned supreme in print.
But perhaps the pendulum swung too far in the flat direction. In the transition to flat we lost some of the helpful affordances – especially on buttons and forms – that more traditional aesthetics used to make our products easy to use. When everything became flat, creating a clear visual hierarchy became a constant challenge.
Can you tell which Shift key is enabled?
Flat has been the predominant visual style for over a year, and some brilliant work has come out of it. But it’s clear that now it’s time to let the pendulum swing back – if even only a little bit.
I propose post flat design – not just as a new way of thinking about design aesthetic – but also creating sensible visual hierarchy and more understandable interfaces for our users. Some qualities of a post flat interface may include:
- Hierarchy defined using size, and composition along with color.
- Affordant buttons, forms, and interactive elements
- Skeuomorphs to represent 1:1 analogs to real-life objects (the curl of an e-book page, for example) in the name of user delight or affordance
- Strong emphasis on content, not ornamentation
- Beautiful, readable typography
Both skeuomorphic and flat extremes have uniquely beautiful and useful qualities, but merging the two styles allows us to leverage the strengths of both. For example, a mobile app might have dimensional buttons instead of colored text to represent primary actions within the interface.
Flaer by Brian Benitez
Without strict visual requirements associated with flat design, post flat offers designers tons of variety to explore new aesthetics – informed by the best qualities of skeuomorphic and flat design. Designers won’t have to sacrifice usability to “fit in” with the latest trend.
Light and Switch by Sebastien Gabriel
Animated Safari Icon by Ray
Let’s try this out. Dust off your drop shadows and gradients, and introduce them to your flat color buttons and icons. Do your absolute best work without feeling restricted to a single aesthetic. Bring variety, creativity, and delight back to your interfaces and themes. We’re trying some exciting things here at Collective Ray in the spirit of post flat design – it’s a refreshing and exciting challenge.
And we'll keep trying new and exciting things as long as we're in this industry.