The World is Flat
In fine art, the successor to each artistic movement is typically a reaction to the previous movement, like a pendulum swinging back and forth. Similarly, in the relatively short history of web design, several trends or “movements” have come and gone. Most recently flat design has spread like wildfire and largely appears to be a reaction to skeuomorphism, an aesthetic that uses real world metaphors to communicate the functionality of interfaces. This can include the use of textures, shadows, and ornamental design elements.
By contrast, the hallmarks of flat design include minimalism, few gradients and shadows, and an emphasis on saturated colors and shapes. There have been many articles written about both topics so I don’t feel compelled to specifically add to the conversation there, but I’m definitely interested in exploring what’s next. When you’re trying to keep up with the brisk pace of the web, it’s never too early to start thinking about tomorrow.
Form Follows Function
Louis Sullivan (an American architect) coined the phrase “form follows function” in the late 19th century as a way to surmise the idea that the shape of a building should be informed by its purpose. This idea maps to web design quite well, because websites are also utilitarian; rarely are buildings or websites created for art’s sake. However, the function of a website is most certainly benefited by sound aesthetics. Design helps to make navigation feel obvious and buttons look clickable. Without good form, the function of many websites would be diminished.
Indeed, flat design is strongly influenced by function.
One reason that skeuomorphic designs became popular is because they borrowed affordances from everyday life. Designers were able to rely on users to bring their own prerequisite understanding. The lack of real world metaphors in flat design forces designers to think carefully about the hierarchy of information and the communicative value of the visual composition, which is a good thing. Flat designs also tend to load quickly because they use fewer images, which allows for the creation of experiences that are well suited to an increasingly mobile world. In fact, Microsoft made an advertisement that highlights how Windows 8 provides a unified experience across smartphones, tablets, and desktops.
Flat designs are also beautiful to look at because of the rich diversity of saturated colors that are atypical in the natural world. I’m often reminded of stained glass windows when I look at tile-based interfaces like these.
Flat design looks nice and it also stands on a strong foundation of functional purpose, so what could influence a change? There might be many reasons, but I think it’s going to come down to refinements driven by the basic elements and principles of art and design, rather than a dramatic revolution. I also think people will simply becoming tired of the same look; the evolution of aesthetic sensibilities is a constant in life.
Nobody can predict the future perfectly, but here are a few of my guesses:
Recently I blogged about the new CSS shapes module because, not only is it cool technology, I think it will also serve as a nice transition from the version of flat design we know today. Composition and shapes play a huge role in the communicative power of flat design, so if designers have easier access to shapes beyond just rectangles, it could accelerate a trend towards different types of shapes. Specifically, acute angles and the directionality of a shape’s points help to guide the eye towards actionable interface elements. More neutral or passive items could feature more obtuse angles or curves. We’ve already seen this manifest in the form of circular profile pictures, like on Treehouse.
Flat design has settled around what I would describe as saturated color triads, quads, and pentads, where there are few shades but many hues. Beautiful as this is, users will eventually grow tired of everything looking so similar. Color is great way to communicate visually without compromising everything that’s good about flat interfaces. Similar to shapes, I see this more as a diversification of what’s already present rather than harsh reaction.
Skeuomorphism doesn’t always do a good job of leveraging the power of digital displays, but it does bring a warm human element to the equation. Even with its friendly color palettes, flat design runs the risk of feeling like a Rubik’s Cube: calculated and unnatural.
Photography has always had a place on the web, but now more than ever, it has an opportunity to fill a cold void. This trend has been around for some time, but now it has more of a functional purpose. The website of Treehouse teacher Mat Helme employs edge-to-edge photography, and it gives you a better sense of Mat’s personality. I’ve also recently redesigned my personal website to use full-screen photo backgrounds in an attempt to create a place rather than a bunch of pixels.
I mentioned earlier that flat design forces designers to more carefully consider composition, which includes the relative size and placement of screen elements. This is difficult for most websites and applications as it is, but the more content and functionality you introduce to increasingly small screen sizes, the more difficult it becomes. You can only simplify so much.
One avenue that deserves more exploration is the usage of layered UI elements. This allows you to show and hide interface elements on the fly, without the need to completely change the screen. This concept has already made its way into numerous mobile apps, but my favorite example is Facebook. They’ve used the increasingly popular design pattern of sliding panels on the sides along with floating panels for real-time chat.
All of this is highly speculative. However, trying to predict the future is not only fun, it’s often times a good way to create new ideas. Where do you think design is going next? Let us know in the comments!