Five Valuable Lessons From our 2017 Usability Labs

We’ve spent countless hours watching people interact with sites and systems in our usability lab. Some of the findings, regardless of the industry or audience are universal. We wanted to take a moment to share some of these with you.

1. Use clear patterns and design treatments for your navigation

It’s important that people know how to navigate around your site. All too often we see sites that make that navigation more difficult than it needs to be. An effective and easy to understand navigation structure includes using:

• common navigation patterns
• clear labels
• consistent color and visual treatment for links and buttons

Make the navigation location and options clear. Many sites use a “hamburger” icon for their menu on smaller screens, which can be difficult for users. Adding the word “Menu” goes a long way to help people navigate your site.

Make sure all of your navigation items are easy to find. Avoid primary navigation in which the menu is presented in an unconventional fashion. Split button navigation, for example, uses a category or hub page label that is clickable and, typically, an arrow to the right of the label that is also clickable and reveals navigation to the pages available in that category. We’ve seen users struggle with these kinds of patterns.

When sites use the same color for both content headlines and links, many users will assume both are clickable. Using grey or black for your navigation elements can be equally tricky. In the lab, we’ve seen users assume that navigation with a black font color is simply text and not clickable. Similarly, we’ve had users comment that navigation elements that use grey text look inactive.

2. Icons can be tricky

In our studies, we’ve found that there is a limited number of icons that are easily recognized by most people and, even then, you can’t always assume that the meaning will be clear or consistently interpreted from user to user.

When using icons to indicate key calls to action or navigation, include a label to make sure everyone can quickly and easily understand what action they can take.

People are inclined to click on icons. When icons are presented in a bounding box, usually a light icon treatment on a darker background, people will assume it is a button. Flat design, which lacks stylistic elements that give the illusion of three dimensions, has exacerbated this issue.

People often assume that an icon is supposed to mean something. Think twice before using iconography for solely decorative purposes.

3. Provide clear calls to action

Try to provide one clear call to action (CTA) on any given page of your site or system. If you need to offer more than one CTA on a page, identify the most common or preferred CTA and make the priority of the CTAs obvious. It’s common to see usability participants struggle to know which thing to click when there are multiple options on a page. If you need to present multiple options for your users, make sure it’s clear what each option does and why they would want to choose one over the other.

It’s not uncommon for an initial screen design to suggest that both CTAs will display on the visible screen. Once the content is integrated and the development work has been completed, the original design may have changed. Perhaps one CTA has been pushed below the visible screen content, leaving users to think they only the single visible option. If you’re providing multiple CTAs, make sure they’re all visible to the user.

4. Set expectations and let users know where they are in the process

When you send your user on a journey to complete a process in your site or application, make sure to provide guideposts, such as:

• How long will the process take?
• What information will they need to have or know to complete the process?
• Once they start, where are they in the process and how much further do they have to go?

We’ve seen many clients who have taken all of the precautions mentioned, and still, users just don’t see those details when they’re going through the process. So, not only do you have to make sure that you include expectation setting content and the ability for the user to track their progress – you also need to make sure those are clear to the user as they’re completing the process.

It’s great to get these kinds of interfaces in the usability lab to make sure they work as planned, even if your process includes all the guideposts we mentioned. Usually we find that a bounding box or font change can make previously invisible details become more intuitive. In the lab, we can tweak the visual display and immediately validate that the changes are working as expected.

5. Make sure your charts and graphs are clear

Charts and graphs can be an invaluable tool to show the relationship between data points, and to help people make decisions. But only if they actually make sense.

Make sure you provide a key to help users understand what is being represented. Provide definitions for industry terms and consider including additional educational content or context for complex concepts that can be difficult for laypeople to understand. If a chart or graph doesn’t enhance the user’s understanding of the content, then omit it.

“Wiz bang” can be an important component of a sales pitch. When you need your customer to understand complex data, err on the side of clarity over flash.

Want to make sure your site or application is the best it can be? In our usability lab, we’ve helped countless companies improve their interfaces. Contact us and let’s talk about how a usability study can improve your interface.