Fundamentals

Pan Am City Guides designed by George Tscherny.

Graphic design underwent certain mutations as it bled into the digital mediums we associate it with today.

However, if you look back a few decades, it’s clear that print design had already explored the extremes of ultra-minimal, symbolic design.

This Pan Am print work is a great example of large semantic distance. Instead of concerning himself with meticulously recreating the real images referred to in each print, the designer focused on design fundamentals. He focused on color, impactful typography, and especially spatial composition.

However, print design isn’t interactive. Thus, where print could afford to be abstract and intriguing, GUIs needed to rely on familiar, real-world interfaces like the button. When computers and their UIs were new to everyone, skeumorphism was a necessary tool that established symbolic continuity from the real world into the digital. I’m going to argue however, that we (users) are familiar enough with digital UIs now to no longer need that crutch (in most cases), especially if it comes at the expense of less efficient and unimaginative design.

Ego

Let’s be honest. Rewind back to 2009 and think of any great UI. Was it great for its show of the designer’s ability to draw photorealistically? Or was it great because of its adherence to fundamentally good design principles? I’d guess the latter. A pretty rendering of an object can get people’s feet in the door (mine especially), but outside of that initial moment when you’re trying to figure out what the app-in-question actually does, how useful is skeumorphism to productivity?

Switches I made for a project some time ago. There wasn’t an end-purpose to this direction aside from looking luxurious / decadent.

I feel as though (decadent) skeumorphism (as it came to be known) was in fact the fad, and not flat design.

Making photorealistic stuff was—let’s face it—showing off. We were celebrating our ability to make pleasantly realistic stuff in Photoshop. It was cool.

Not So Delicious…

But that trend wasn’t timeless nor was it good practice. It was detrimental to design because of an unwarranted emphasis on aesthetic, skeumorphic beauty. There was a whole generation of “delicious” OS X apps that were sold based on how cool they looked. Apps weren’t being sold for their functions, but for their novel and often gimmicky GUIs—and that’s problematic. It’s a UI’s job to get out of the way and make the function(s) of the app as easy to perform as possible, not to be the star of the show.

The trouble became that a skilled designer could overpower the fundamental weaknesses to a UI’s design by making it look cool. This is akin to covering a facial blemish with makeup. Given the recent surge in flat design, there are apps with flat UIs that are sold based on their visual style too, sometimes even using that style to disguise their flaws elsewhere, and that’s not okay either.

But on that note, let me try and dispel a popular opinion:

Flat Design Isn’t Easy

If only I had a nickel for how many times I’ve read something along the lines of: “So basically, I select every layer in my PSD and hit ‘Clear Layer Style?’” Even among the people I work with every day, it’s not readily apparent that design is more than just slapping on a routine 90º 1-2px, 0 dist. drop shadow and a gradient overlay. Is flat design really lazier and more replicable because it didn’t involve those simple steps? No. Granted, there are UIs that use complex graphics (that aren’t easily created by anyone) like Voice Memos in iOS 6 (see below), but generally, the skill required to style UI elements like buttons, bars, and glyphs is not noteworthy.

What’s noteworthy is the design sense required to spatially arrange elements appropriately, to use color judiciously, and to keep it simple.

Voice Memos in iOS 6 (left) vs iOS 7 (right).

This is a striking example of how decadent skeumorphism can stunt an app’s UI design. I never consciously critiqued the old Voice Memos app for using two screens before I saw the iOS 7 version. The only function I can possibly imagine for the gigantic mic graphic in the old version is to indiciate to a person you could be interviewing that they can talk to the phone from that end and be recorded.

The new UI is literally over 9,000x better. It simplifies the app into one screen and displays more relevant information. I don’t know about you, but I never had a clue about what the units meant on the old app’s meter graphic, but the frequency spectrum is (oddly) much more self-explanatory and useful. The Voice Memos redesign demonstrates the opportunities for strides in design afforded by stripping away visual decadence. It also points out that flat UIs can be just as difficult to design, if not moreso, because there’s less of an excuse to hide behind, assuming that you define design the way I do.

Let’s define design real quick.

I feel like I might incur the wrath of his ghost if his quote is used even one more time, but here it goes:

“Design is not just what it looks like and feels like.

Design is how it works.” —Steve Jobs

Now that I’ve checked every box for a run-of-the-mill, pseudo-profound design blog post, I think we can continue.