UI/UX

Using Norman doors to inform your next design

by

on

View all posts

While sitting in a cafe, I notice a really tall guy making his way through the outside area. He’s at least 6’6, but he doesn’t have to duck under the roof beams.

It’s interesting how the beams were designed to account for his height, and how everyone’s sitting in a chair that fits their back, and they’re drinking from cups that fit their hands.

norman-doors-cafe

What’s weird is the doors. I’ve seen at least 3 people in the past hour try to walk inside by pushing straight into a “pull” door. When you look at how ergonomic the rest of the cafe is, it’s a laughable oversight how counterintuitive it is to design a door with misleading design signals.

These kinds of doors are called Norman doors, named after Don Norman, the author of The Design of Everyday Things and one-half of the NNGroup. Norman doors appear as if they’re push/pull when they’re actually the opposite, causing confusion and embarrassment to the user.

Some even have labels to override the misleading signals.

That made me wonder: “If you need to label something, has it been poorly designed?”

Think of other usable objects in the cafe: cups, chairs, tables. You don’t need to slap a “SIT” label on a chair. As you can see from the above image, even, a push and a pull door can look identical apart from the labels—and doors don’t always have labels.

To get the heart of the matter: We understand most everyday design it because it has been conditioned into our heads ever since we learned to use it. But doors? They’re designed with nothing more in mind than “this is a door,” which raises an interesting parallel. Are we making the same mistakes in our user interfaces?

“If you need to label something, has it been poorly designed?”

While labels have been an easy get-out in the past, are we now relying on them to awkwardly clarify confusing design?

The problem is, we’re not yet in the era where we have a standardized, universally recognized icon for everything.

Here are a couple of examples:

The great hamburger menu dispute of ’14

The hamburger menu, while it flourished in popularity recently, has a long history. In fact, it appeared in one of the first GUIs ever on the Xerox Star in 1981. It was a contextual icon designed to “mimic the look of the resulting displayed menu list,” says Geoff Alday.

Although it started out with good intentions, as it gained visibility and ubiquity, the hamburger menu became a hot topic for debate among almost every single designer with a platform in 2014.

Here we see the “hamburger” icon as a typical menu toggle. Read more: Designing with developers in mind.

Here we see the “hamburger” icon as a typical menu toggle. Read more: Designing with developers in mind.

In 2015, after giving the hamburger menu a home for quite some time in Chrome, Google decided to replace the hamburger menu with 3 vertical dots.

Arguments in favor state that ellipses are a recognized sign for more or a continuation, which makes sense because we’re more used to reading text than we are to using a UI-specific element. But again, is making that alteration necessary when everyone’s already used to the hamburger menu? That’s a question that really starts to pick at the point I’m making: If something works, and everyone understands it, is it worthwhile to innovate for innovation’s sake?

There’s even more confusion when it comes to the many incarnations of the share button.

The legendary share button mixup (also of ’14)

The launch of Mac OS X Yosemite and iOS 7 sent incredulous reverberations around the design community. As if we didn’t already have enough share icons, Apple’s gone and added another!

sharing-icons

The update in question concerned the 2 icons to the left, the latest of which Apple updated to match their download button. But as you can see, that was only the catalyst for discussion. Before that, there was a fair bit of innovation while designers decided the one true way to get users to share.

Shareaholic released a Creative Commons graphic called the Open Share Icon with the hope to standardize it, but even still there’s no agreed-upon style.

How Microsoft overcame this problem (and hundreds of other problems just like it)

It’s in situations like this—where we’re killing off labels and arguing over icons—where it’s important to remember the role of conditioning in UI design.

Everything you do and everything you know is informed by your own conceived ideas and the influence of other forces (people, memories, etc.). When you’re attempting something totally new (something maybe a little more complex than an icon), it’s historically interesting and useful to look back at how Microsoft introduced people to the GUI through their user onboarding experience.

“We need to live up to our users’ expecations.”

Microsoft had a unique issue in 1995. Since no one had gotten used to using the mouse to interact with objects on the screen, they had to get creative. Instead of burying the instructions in a giant user manual like had been done in the past, they constructed a user onboarding flow and made a game of it.

Using now-popular games like Minesweeper, Solitaire, and Hearts, they taught users to right-click, drag-and-drop, and network with each other. In short, they tapped into the human desire to compete and gamify their life to get users onboarded with their software. This is the kind of care and attention that needed to go into the experience because it wasn’t only teaching one piece of software, it was teaching how to use new hardware and totally new concepts to the mainstream buyer.

Just like Microsoft was on the cusp of a revolution in 1995, we live in a world where users demand DWIM approaches and where confusing interfaces are starting to get outclassed by conversations. As clunky as Windows 95 feels to us now, next time you slam into a pull door, you have to admit they were onto something.

Overcoming today’s troublesome times of confusion

Going back to the cafe: Thing about the design of cups and all the different kinds of cups that have been popular over the years before we’ve settled on something (pretty much) uniform. You’ve got designs spanning all the way from hands to animal horns to modern mugs, evolving with that same turbulence as any UI standardization.

In the meantime, the only thing we can hope to do is to live up to the expectations of our users. Now, that might not sound particularly creative, but it’s sometimes necessary in the era where even doors—an object that’s existed since the dawn of architecture—can be a source of confusion.

More posts like this
CTA for those not in hs to DO UI kit
Author

Benjamin Brandall
Benjamin Brandall is the head of content marketing at Process Street, where he writes on SaaS, processes, and productivity. When not at work, he runs the obscure entertainment blog Secret Cave.

Join over 2 million designers

Who get our content first.

No sales pitches, no games, and one-click unsubscribe.

Over 2 million designers
get our newsletter
every week

Find out why

Get awesome design content in your inbox every week

Just like over 2 million of your fellow designers do.

Plus get 3 free downloads, just for signing up.

Give it a try—it only takes a click to unsubscribe.

Thanks for signing up!

You should have a thank you gift in your inbox now—and you'll hear from us again soon!

Prototype better experiences with InVision

Just like over 2 million of your fellow designers do.

I agree to InVision's Terms of Service.

Want a free t-shirt?

Join the 2 million+ designers who get our newsletter weekly for your chance to win!

We hate spam as much as you do, and you can unsubscribe anytime.

Double your chances to win!

Tweet and automatically get a second entry

Tweet Now

No Thanks

Stay in touch!

We share news, freebies, and more on Twitter.