Apple’s iOS7 reveals the challenges of designing Flat Design

Two very recent articles I’ve come across regarding Apple’s new iOS7 and the challenges it brings to UI design.

Unless you’ve been on another planet for the past month, Apple launched a new iOS embracing flat design–eliminating skeuomorphic UI and other effects like glossy highlights and drop shadows. For those of you who have been off-planet, skeuomorphic UI design is the concept of creating graphic elements that emulate real-world objects. For example, a yellow ruled notepad interface for entering notes. To be fair,  Android introduced the concept first but when Apple did it, suddenly people payed attention. Go figure.

Both Luke W (Designing for iOS7: Perils & Pluses) and Baruch Sachs (Flat Design Won’t Hide Your UX Sins) discuss how flat design challenges UI designers because many of the elements of visual language designers once used to communicate have been eliminated.

The simplicity of iOS7’s design language comes at a cost: a reduction in the amount of visual elements designers can use to create hierarchy and thereby understanding. … How people makes sense of what they see gives designers a set of attributes to play with to create meaning within a design. Elements like color, size, and texture can create similarity, differences, and hierarchy within a layout. When these elements are “flattened”, some of this vocabulary goes away.

Instead, UI designers designing for flat design have to be more cognizant of information architecture, layout, typography and the principles of design – basically getting down to the bare essentials – that make interfaces usable and useful without the former aesthetic distractions.

In flat design a clearly structured typography ladder has become more crucial to help a user differentiate between say, a primary CTA, a secondary CTA, and a non-CTA (plain text). Additionally, the placement of the CTA in relationship to other elements in the UI is even more crucial to give succeed in helping the user make confident decisions and interactions with the interface. If the UI implementation has no hierarchy or structure, looks the same and makes the user work harder to find their way through it, then it’s a fail.

As Luke W points out, intelligent flat design success probably ain’t gonna happen on the first round. Making something look and feel transparent and easy is actually very difficult. Which is what flat design UI takes in order to succeed. Just because a designer removes all the shadows and gloss, effectively making the UI flat, doesn’t mean it’s achieving it’s goal of helping guide and direct users in their tasks.

And, as Sachs sagely writes, flat design may not be the most appropriate UI solution for the project,

Sometimes flat design works, and sometimes it doesn’t. … To judge the best approach, you need to understand usage patterns. You need to know how people do their work.

I think what I appreciate most about flat design is that it takes us back to the roots of user experience practice and pushes utilization of the most basic, yet time-tested principles of UX design to the forefront again.

Truly, what is old is new.

Update 10/14/2013: Nielsen Norman Group (NNGroup) gives us their iOS7 User-Experience Appraisal

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: