1 compelling products

Understand, guide, then engage.

People don’t do things
(without a good reason)

The problem

Your product is one more thing in your users’ busy lives. Don’t rely on “if you build it they will come” — they will only engage if you make it abundantly clear how it solves a real problem for them.

Why it happens

You care deeply about the product — after all, you spend the majority of your time working on it! It’s common to assume others will be interested enough to engage as well.

The solution

Every element of your product needs to make a case for why the user should care. If you can’t connect each design decision to the problem you’re solving for a user, it’s not likely to convince them.

Make guides, not maps

The problem

Our products do many powerful things and support many different types of users. But being presented with too many options at once is more likely to confuse and overwhelm the user rather than support them.

Why it happens

As a designer, it’s natural to want to make sure you show the user where everything is so that they don’t miss a feature or have to hunt for something. Sometimes, multiple stakeholders will have different perspectives on what’s important. Both of these situations can lead to cluttered experiences.

The solution

Clear the clutter! Provide guidance, not a map of every possible path. Focus on the most common actions and remove everything else from the view so the user can easily understand the product and find what they need. If there are less common or advanced features, use progressive disclosure and secondary affordances to support those needs without cluttering the interface.

Use familiar patterns

The problem

Users need to be able to find their way through an interaction with minimal cognitive load. Learning a new way of doing things each time can create a high-friction experience.

Why it happens

It’s easy to approach each interaction as an isolated problem to solve. But your users don’t experience that interaction in isolation. They experience it in the context of the rest of the product, as well as the context of all the other digital products they use.

The solution

Know that 90% of UI problems are already solved, so don’t reinvent the wheel. Wherever possible, use pre-existing interface patterns. Muriel, our design system, exists explicitly for this purpose. Consistent patterns create familiarity and trust for the user, reduce the learning curve, and free up your creativity for that last 10%.

Emphasize key elements

The problem

A single screen might provide multiple actions that a user can take next. It can take a lot of cognitive effort to read and understand all of the options available.

Why it happens

Digital products inevitably need to support multiple actions. For example, a publishing flow might include options to publish, preview, schedule, and more. It’s easy to end up just “putting another button on it”, which leads to a lack of clarity or orientation.

The solution

Create a clear visual hierarchy so that the user can tell what’s next at a glance. Use color, style, layout, and typography to emphasize the most important information or the logical next step. Make sure there is only one element with high importance on each screen, though there can be multiple medium and low-importance elements.

Provide clear orientation

THE PROBLEM

Every time a user has to switch context, it creates cognitive work to reorient themselves, which can lead to confusion.

WHY IT HAPPENS

There are inevitably steps in a digital product experience that require a switch to a different view or screen. Without a coherent sense of spatial relationships between parts of the product, it’s easy to lose your user.

THE SOLUTION

Avoid switching context unless necessary. Where context switching is needed, use consistent techniques for spatial orientation. Apply Muriel guidelines for spatial relationships and motion.

Buttons

A layout should contain a single prominent button that makes it clear that other buttons have less importance in the hierarchy. This high-emphasis button commands the most attention.

A triangle with three levels where at the top is highest priority, in the middle is medium, and at the bottom is lowest priority. The point being that the top of the triangle is smallest and so you want to make what is highest priority not the norm for every element when presented to a user.

Mind the copy…
but don’t rely on text

The problem

On the one hand, writing is a key part of the product design process that often gets ignored. The copy in your product shapes users’ understanding of how to engage with the product. On the other hand, the vast majority of users glance and skim — they are unlikely to read dense paragraphs of text.

Why it happens

Writing isn’t always a core skill set for designers. When we do write, it can be easy to rely on a lot of words to guide the user instead of visually designing a clear flow.

The solution

Don’t leave the words for last; consider content strategy early on in the design process. Keep it short, sweet, and skimmable. You should be able to understand what to do on a screen by standing 5 feet away and squinting.

Get to AHA!
in 60 seconds

The problem

People are busy. There is an endless sea of alternatives to your product. If you cannot convey exactly how your product solves a users unique needs within the first 60 seconds, you will lose the vast majority of potential users that take your product for a spin.

Why it happens

You understand the product deeply and know how all the features can help your users, so it’s easy to forget that they don’t have the same degree of context and buy-in as you do.

The solution

Research and test to figure out what the key user problems are. Focus on one thing that the product does to solve that problem and make sure the very first moments with the product heavily feature that solution. Make the argument visually, not with extended explanations.