How Flat Design Is Preparing iOS For The Gadgets Of Tomorrow

iOS 7's new look isn't just a fresh coat of paint. It's a powerful design language that can be extended to the iWatch, iTV, and iCar of the future.

When we talk about Jony Ive's massive overhaul of Apple's mobile operating system in iOS 7, we tend to think about it in terms of a mere facelift. First unveiled in June and inspired by the work of legendary German designer Otl Aicher, Ive embraced a flat look in iOS, 7 largely marked by the use of bold colors, lots of white space, elegant typography and simple geometric shapes. Ever the sophisticate, it seems natural that iOS's previous skeuomorphic look would strike Ive as a design crime that must be eliminated.

All of this is doubtlessly true. The flat design of iOS 7 is about Jony Ive waging a holy war against the tacky skeuomorphism of previous versions of iOS. But that's only part of the story. With iOS 7, Jony Ive has designed a visual look that isn't just suited for the iPhones and iPads of today, but the iWatch, iTV, and even iCar of the future. This is about iOS taking over the world.

iOS In The Car expands iOS 7's icons into rectangles.

Let's start with a simple observation: although iOS started on smartphones and tablets, Apple's long-term vision for the operating system is much bolder. It already runs on smartphones, tablets, portable media players, and set-top boxes. But Apple isn't going to stop there.

It is noteworthy, then, that alongside announcing iOS 7's new look at the Worldwide Developer Conference in June, Apple also unveiled a new type of device iOS would soon be running on: automobiles. Called iOS In The Car, the new feature would allow drivers to make calls, listen to music, access maps, or even send messages, all from their automobile's in-dash screen. No one really noticed at the time, but iOS In The Car was a hint why iOS 7 had been redesigned to begin with. As it turns out, an operating system designed to be flat is much better suited to running on multiple devices than a skeuomorphic operating system is.

From a design perspective, there are two things that are interesting about iOS In The Car. Its visual design is entirely consistent with iOS 7 on the iPhone or iPad, but its UI is different, with big rectangular buttons instead of iOS's more traditional small square icons. The reason the icons are different is simple: safety. When you're driving, you need to be able to quickly and safely push a button without having to take your eyes off the road for long to find it. Yet despite the fact that iOS In The Car uses differently sized and shaped on-screen elements, the icons themselves can be the same because they're flat.

With a flat design, you can change the shape of the icon without needing to redo the art.

Think of it this way. Let's take two square images. One is a simple red box with a silhouette of a phone in the middle: typical flat design, as seen in iOS 7. The other is a photograph of the Vatican. Now let's say that you want to turn each image into a rectangle, not by cropping it and losing parts of the image, but by expanding it. With the flat icon, you can simply add more red around the edges, and it'll look great. But the picture of the Vatican? You'd need to take the photo all over again to capture the detail on the edges you missed the first time around.

Look at the icons of iOS 6 side-by-side with iOS 7. Almost across the board, every iOS 7 icon can be expanded both vertically and horizontally, just by filling the blank space with the colors on the edges. For example, the Photos or Safari icons can be expanded to a length rectangle just by placing the existing icon in the middle and filling the rest of the rectangle with white space. Likewise, the new Messages, Facetime, Music, Mail or Phone icons can all be extended into any shape, just by taking the colors at their edges and repeating them to fill the remaining space.

Flat design is also more appropriate for the curved displays of the future.

Think about how easy this makes Apple's job, adapting their visual language to new devices. If Apple ever releases their long-rumored HDTV, it will likely feature large icons that can be seen across the room. But Apple won't have to create new entirely new icons or art for this new user interface: instead, flat design allows them to easily (and even automatically) expand their existing icons to fit any shape they want. If Apple hadn't redesigned iOS 7 to be flat, this would be impossible. Icons would have complicated patterns, shadows, light sources, and gradients that would need to be reinterpreted and recreated for each new device. But because iOS 7 was designed to be flat, none of this is a problem.

There's another benefit here, too. Right now, all displays are flat, but in the future, displays will come in all shapes, sizes, and contours. Samsung has already unveiled the Samsung Galaxy Round, the world's first smartphone with a curved OLED display, and the iWatch is similarly widely rumored to curved. Skeuomorphism tends to look strange on curved displays, like seeing something in a funhouse mirror, but flat designs don't distort in the same way. Ironically, by going flat with their UI, Apple has prepared itself to eventually go 3-D with its displays.

Even if you love the way iOS 7 looks, it's easy to dismiss it as just a new coat of paint, but the reality is that flat design is far more than a panacea to skeuomorphism for Apple. It's the way Apple is future-proofing iOS's design language for the curvy, crazy, groundbreaking gadgets of the future that we can't even imagine yet.

Add New Comment


  • Ryan Maynard

    Everyone needs to shut the F#$% up. Design is design. Its an ever flowing, yet sometimes reproducing creature. Yes flat designs have been used for icons, yes Apple is switching to a flat design...Is it the future? Who knows. Any student of design knows that all these elements have already been explored. Take a History of Graphic Design class before you remark and make shi%%& comments about anything.

  • Just one problem, iOS7 looks like a 12yo girl's sketchbook. The bright flat colors make it harder to distinguish and remember interface elements. The previous design was better in that things looked sharper, more defined, with purpose, depth on a flat glass screen. Why pile flat on top of flat?

    It's no wonder they released 7.1 to fix a few of design elements people were complaining about. Even buttons they had to admit were annoyingly minimal, and in iOS7.1 they brought in an option to use button shapes.

    Ever hear of anyone hating on iOS6 design? Not really.. but iOS7 has a lot of haters for good reason. It's a step backwards in design, you can talk about glossy wearable tech and cars of the future all you like, the simple fact is a lot of people don't like the flat, overly bright white - stark, blinding appstore white look of iOS7. Get a new designer in, Apple.

  • Written from inside the Apple Bubble. Making it sound as Apple was the one starting the trend, while in reality they where the last one to adapt it. and boy was it hard for them as they always used real-world contextual user interface, which made for some good looking UI's and gave them their distinguished look. but as everybody that studied HCI knows, using real-world contexts doesn't always make for most efficient user interfaces. And it has been painful for Apple to adapt their UI and not loosing their look in the process, resulting in some good and some bizarre looking icons and UI Views.

    But one have to wonder what is the point of this Article, to mention Apple and its products as many times as possible?

  • Renato Oli Carri

    Ok! It's seems just a functional design!! Yep, that's ok.... but think really beyond the facts the true that I can feel is a big and no so smart rats racing!!! Let's dominate the world!! Now, In the moment the score is, in first place, leading by a head Apple..... in second...

  • Zane

    I think iOS 7 really can make a big impact, even Microsoft has changed their icons and web browser BING to match iOS 7. But will iOS 7 change all products, and is Microsoft steeling from Apple?

  • Fred

    Microsoft has had the flat icon design before iOS7, look at windows phone 7 and the "metro" design theme.

  • Thinkyhead

    I still want borders on my buttons, at least the ones that look like ambiguous floating words.

  • hocestquisumus

    interesting take. but why pick apple? they're the last of the bunch to embrace flat and IMHO did it worse than MS or google.

    but sure, i know. it only becomes real when apple does it. it's inconceivable that things exist they did not invent :rolleyes:

  • Max Cacchiotti

    YOU PRAISE APPLE for flat design, all they did was steal the idea from Google and Microsoft. Microsoft started this whole FLAT DESIGN with Zune and Windows Phone. Google followed and then Apple.

    Don't praise Apple for something they didn't know. You're just a fanboy...

  • Nathan Davies

    They didn't 'steal' flat design. You cannot 'steal' a design aesthetic. Flat design wasn't even invented or created by Microsoft, Google or Apple; it is a direction all good design is going in of simplicity. It shouldn't even be called 'Flat' design as it is simplicity. The only thing is - Apple has done it a HELL of a lot better than Microsoft and Google. Adding depth and quality to a UI rather than a having simple coloured box with an icon inside of it (Windows 8) don't sit there and say "Don't praise Apple for something thing didn't know" because your talking about something YOU do not know.

  • Krystyn Heide

    Apple did it better than Google or Microsoft. That being said, a lot of designers did it better before Apple on smaller projects.

  • Daniel Keller

    you must be blind because you're an iphone user.
    iOS7 has bright colors, weird gradients, poorly made icons, they even got sued by SBB (swiss train company) for using their clock design.

    so what exactly did they better?

  • Krystyn Heide

    You got me. I am actually blind. I just think flat design feels better because I'm so used to braille. It's so minimal.

  • Nathan Davies

    As a consumer Krystyn has every right to decide that. You just have to compare them side by side and see that its been done better.