Trending: Flat Design

by Joshua Bolt on 6 Comments

It’s hard telling what the future of design holds, but we can tell you the current trend in UI/UX. It’s flat design and we’re seeing elements of it popping up more and more every day on websites, mobile apps and even operating systems.

Screen Shot 2013-10-05 at 5.11.09 PM

Flat design places a strong emphasis on typography, solid colors, and simplistic layouts and shapes, steering clear of gradients, shading, shadows, beveled edges, reflections, dimension and texture. In flat design, you won’t see much detail or ornamentation, making the object/function appear as something else – this is called skeuomorphism, the opposite of flat design. A few primary examples of skeuomorphism is the volume control on your keyboard, that trash can icon on your Mac computer (or Recycle Bin for you Windows users), or even that decorative (and also fake) wood paneling on the side of that Chrysler Town and Country.

Relevant Examples of Flat Design

Apple iOS 7
Look below. The image on the left is a text message conversation on iOS 7, while the image on the right is the previous version of iOS. Notice how the left is simply less in-your-face and subtle? This is just one of many ways Apple has made the dramatic change over to flat design.

ios_compare_messages

Image courtesy of currenteditorials.com

In an interview with USA Today, Apple’s long-time designer, Jony Ive said, ”When we sat down last November (to work on iOS 7), we understood that people had already become comfortable with touching glass, they didn’t need physical buttons, they understood the benefits, so there was an incredible liberty in not having to reference the physical world so literally. We were trying to create an environment that was less specific. It got design out of the way.” We’re also seeing many iOS apps update with similar design patterns, such as Instagram, LinkedIn, OkCupid (look, I’m human), Twitter and Evernote.

Google
Google scrapped the beveled edges and went for smooth, solid 2D branding. All Google has mentioned about their enhanced logo is, “As part of this design, we’ve also refined the color palette and letter shapes of the Google logo.” That’s it.

GoogleLogo

Image courtesy of mashable.com

Windows 8
An early example of flat design stemmed from the Windows 8 Start screen back in August 2012.

windows-8-11

Image courtesy of wikipedia.org

Is this new way of streamlining information the way of the future? Or is this just a fad with a dead-end? You tell us. What are your thoughts on everyday designs getting flattened?

Posted in: Interface DesignRedesignTypographyUI/UXWeb Design Tags: Flat DesignTrending 6 Comments

Leave a Reply

  1. Rose Matsa

    I think flat design may in part have stemmed from responsive design. The need to really have a hard look at the content and find ways to present it on a small, handheld screen. You have to do away with all the unnecessary elements, gradients, and bevels. It has to be clear and straightforward, and it has to be fast. It’s also easier to scale a flat mobile design to desktop, and vice versa.

    Web design and the user experience are now much more about how something functions, than how it looks, because we’re making the web a functional part of our everyday lives — we are not just looking; we are interacting with it. The web is much more abstract now. Flat design suits this abstract web more, and I think it’s going to stick.

    • Joshua Bolt

      Responsive design absolutely calls for lot’s of functionalities on a smaller screen. There just isn’t room for fancy effects, which is unnecessary and causes clutter. Nice insight, Rose.

  2. Oscar

    Great article, you might want to check this Medium post on the topic.
    Pretty much the same argument, but additional details.
    https://medium.com/product-design/b8b099cde38c
    cheers!

    • Joshua Bolt

      Thanks Oscar. Definitely a good post. Love this statement:

      “User research discovered that a lot of Microsoft Office users had no idea what the Save icon represents. And if they did, then their kids did not.”

      Keep reading.

  3. Michelle Babyok

    I have a theory that skeuomorphic design is easier on the eyes– softening the edges and contrasts of items on a screen. Eyes may work better and possibly be less strained, particularly after long days at the office. And it may just be more pleasurable to look at– our optic nerves are stimulated by texture, highlight, and shadow. It may be more intuitive too: your mind always takes a nanosecond to interpret what a flat icon signifies. That said, some flat design thrown in to the mix can be refreshing. The cynical designer in me wonders if Jonny Ive wants to redesign the wheel for the fame and fortune, not because it’s good design; that iOS has some serious design issues.
    As for the skeuomorphic car, how can you not like the vintage woody? http://www.examiner.com/article/50-cars-for-50-states-california-s-classic-surf-woody

    • Joshua Bolt

      Very true, Michelle. Good insight. PS: Love that car!