Choices on your interface

Sometimes less is more

An immensely huge color palette — as a joke! [image description: a mock color palette picker, from a real flow diagram tool, with almost 1000 colorful swatches to choose from]

Versão em português aqui

The first time I heard anything about the burden of having too many options was on a TED Talk by Barry Schwartz, The paradox of choice. It stated that once upon a time western industrialized society came to the realization that “the way to maximize freedom is to maximize choice. The more choice people have, the more freedom they have, and the more freedom they have, the more welfare they have”.

And with time we as a society came to realize that maybe it wasn't so. Here's why:

Regret and anticipated regret. When you do have tons of choices is easy to regret if you feel that you are not 100% satisfied with what you chose, given that you could have easily gone for something else.

Opportunity costs. The value of something depends on what we compare them to.

Escalation of expectation. If you have all these choices available you tend to expect more from what you choose.

Self-blame. We end up with high expectations for pretty much everything, and when that is not fulfilled we tend to blame ourselves for choosing poorly.

What you end up with, after all the little decisions you have to make daily, is a sort of decision fatigue. This concept is wildly explained as the reason why top executives wear the same outfit every day.

Steve Jobs' default outfit and Monica's closet (cover #24 of a beloved Brazilian cartoon character/1988). [image description: 4 frames. The first 3 frames are pictures of Steve Jobs on different occasions wearing the same black shirt/blue jeans outfit. The last frame is an illustration depicting a cartoon character choosing an outfit from a wardrobe full of the same red dress.]

The talk about less is common in a variety of fields today, but this notion goes back certainly at least a century ago. The renowned modernist Mies van der Rohe first heard of this saying on his early days as an architect: less is more. His boss just wanted less detailing in a facade drawing, but Mies later came to reassign these 3 words to a meaning of his own. Less is more became the foundation of his works, stripping all the elements of a said object or construction to its core functionalities, in the early 20th century.

What all that has got to do with digital interfaces? Well, everything.

Whimsical and RealtimeBoard

I am an absolute fan of RealtimeBoard. As they define themselves, RealtimeBoard is a simple whiteboarding platform for
cross-functional team collaboration
. I loved that I could customize pretty much everything. Font type, font size, font color, shape fill color, shape stroke color, shape stroke line type, shape stroke line weight, and so on.

RealtimeBoard screenshots [image description: 3 frames with screenshots from color and font editors from RealtimeBoard]

Recently I was looking for a Windows-friendly flow diagram tool and someone recommended Whimsical to me. At first, I thought it was too simple, I couldn't choose the font color/type and had only a limited array of object colors. But as I tried it out, I stopped worrying about visual details altogether and my workflow improved drastically. Seriously. Of course, the limited choices were thoughtfully designed, so everything ends up looking great.

Whimsical limited choices (image source) [image description: 3 screenshots from the shape, color and text editors from whimsical]

To be fair, later on RTB released a flow diagram feature with limited editing choices, but I was already hooked on whimsical. ❤

→ update March 7, 2019: RealtimeBoard is now called Miro

Design System and design from scratch

We all probably read/heard something about Design Systems by now. There are a number of discussions around the topic, but the fact is: a well-implemented Design System speeds up the design process.

On the left an overview of IBM's Carbon Design System and on the right a blank screen. [image description: 2 screenshots, the first is a series of design components sample cards and the second one is a blank screen]

Imagine the difference when designing a brand new page, between starting from scratch and already having the basics components ready.

Medium and Wordpress

Although Medium and Wordpress serve totally different purposes, they both can be used as blog platforms, so I compared their text editing features. Here are some screenshots of the current Wordpress editor:

Wordpress Gutenberg editor screenshot
Wordpress classic editor screenshot

And here is Medium's:

Medium editing options

Medium is a great example of focusing on the content instead of the format. You get to decide whether you’re writing a title, subtitle, quote or a paragraph, and that’s about it. No choosing fonts, sizes, color, spacing. None of that. You cannot even mistakenly leave a double space between words, the platform just won’t let you do it.

And yet, when you are finished with your content, you end up with a beautifully diagramed blog post with the least amount of effort on the design part.

In the cases mentioned above, limiting choices is not the same as limiting freedom. When you get a well-designed solution the limitations can actually open up space for you to focus on what matters. It's like getting rid of mental clutter.

Of course, all this talk of less is not applicable to every design scenario, especially for those in the B2B sector. But you can still work your way around to decrease the cognitive load in an information-packed application.

Still, B2B or not, what all these products have in common is that they know what they offer and what the user is there to do after all. Getting to know their users is what allows them to take a step towards less.

--

--