Simplifying For The Wrong Reasons

There has been a recent shift to Flat UI, No Interface and Hiding Navigation Menus. The basis of simplifying is good, but can be counter-intuitive if badly executed. “Make everything as simple as possible, but not simpler.”, Albert Einstein said. When a product is too simple, it can become sterile or worse, it can be deceptive and frustrating at times.

• Download the .sketch file

Hiding Navigation Menus

The best user experience reduces the amount of clicks to as few as possible. It makes sense to have a Menu icon on mobile because of the lack of screen real estate, but for desktop and tablets, that is not the case. A good navigation keeps the menu simple – you should typically have 3 items or fewer alongside the logo. Those items should be frequently used.

Hiding a navigation menu not only adds an extra click but also takes up one of the 3 important menu items. It’s a compromise. For the Web, this menu concept should be treated as a drop down menu and should be used only for secondary options. By making things visible, you increase the chance that your users will see and use your menus. Hide to solve clutter, but only if there is clutter.

• Windows 8 hides their Charms menu, effectively making their UI less cluttered. But it’s not readily obvious that there is a menu. Also, they made the power options, which are fairly important, 3 clicks away (Charms > Settings > Power > Restart).

• There is an interesting debate about Squarespace‘s decision to use a “hamburger” menu for their main navigation. While it’s likely intentional to let users focus on the content, it makes me doubt on the actual usage of that menu, especially for non-savvy people.

Flat UI

A flat user interface simplifies the visual richness, but can compromise the clarity of important design elements such as buttons. It also doesn’t rely on real life metaphors that people are familiar with. While those metaphors can be of bad taste and quite distracting (see Find My Friends), there are also good metaphors such as physics, animations, sounds and gestures.

The simplest metaphor of all is of course the button. There are buttons everywhere, from the door bell to your phone’s home button. Buttons should be designed in a way that it stands out, whether you apply gradients or flat colors.

• Without a shadow, a gradient and rounded corners, buttons can be mistaken as banners or titles. Flat UI also typically relies on more colors to structure the design.

Regardless of the style you are going for, make sure that you design with clarity. If you’re going flat, you must have a solid understanding of colors and contrast. If you’re going realistic, practice your gradients and shadows. Design is how it works, therefore make it obvious and functional.

• When you open the shop section in Path, you get a nice ring sound reminiscent of an ice cream shop. As you tilt your phone, the stickers follow the direction. It’s beautiful. Making the shopping experience heartwarming may seem unnecessary on the surface, but if you stop and think for a minute, it is actually solving a problem. That problem is that users, especially in a social network context are put off by the idea of e-commerce. So, by emotionally connecting with the user, Path manages to not only make it acceptable, but also delights its users with a fun and nostalgic experience.

No Interface

Simplifying an interface to a point of having no interface can be rewarding, but can come with a cost. There are False Positives and that is the danger of No Interface. Think for example of Google Now, which serves you information by guessing who you are. It is a great concept in theory, but when the guesses are wrong, it can be very frustrating. Siri is another example. How many times have you been disappointed by how well Siri understands you? Accuracy plays a big role in earning the user’s trust.

Good design is honest, and with honesty comes trust. When you see a button, you know exactly how it’s going to behave. There is delight in using a beautiful interface.

• By using a natural language, Fantastical can guess at a 100% accuracy the event you want to add to your calendar. Please note that we’re still using an interface here (keyboard) and that the same wouldn’t be true by using your voice. Our technology is not there yet.

This is not to say that No Interface will never happen. When technology can guess at a 100% accuracy, it will happen. In fact, as designers, we should always aim for As Little Design As Possible. But rules are meant to be broken, and while following one particular design principle, you must not compromise other principles such as honesty and clarity. Sometimes, you have to make the hard decision to prioritize.