3 UX rules of great navigation: Help users discover the true value of your product

by 
Simon McCade

It’s more important than ever to help users find what they want quicker, such is the ferocity of competition in the SaaS product landscape.

Let’s explore the finer details of gaining and nurturing interactions with your users here so your product can work harder for you:

What’s the point in navigation? 

Plainly and simply, navigation is one of the most critical features of your SaaS product’s user experience. It allows users to flow smoothly through your application at their own speed so they can discover its true value. The quicker they achieve this, the more likely they are to stick around for longer.

At the end of the day, it can be the difference between converting trial users into paying customers by helping them find the features they need and ultimately losing them altogether because the user experience has made them, well, lose the will to live. 

It does a SaaS product no favours to make important features difficult to find and it only serves to frustrate users. 

Frustrating your users makes them much more likely to churn

Navigation plays one of the most crucial roles in facilitating interaction and engagement for users, so its ultimate aim is to help people get from point A to point B in the least frustrating way possible. 

What is navigation design and what purpose does it serve within your SaaS product?

Navigation design shapes the ways in which your users interact with your product’s categories and features by presenting them in either top (horizontal) menus or left (vertical) menus.

They are typically displayed as a grouped set of links or icons with a clear visual style that is distinguishable from the rest of the content on the screen. 

In its most basic form, good navigation should clearly show users where they are and where they can go within your product. It’s there to make it easy for users to get to where they need to be. 

Visual cues, therefore, should be clear and obvious enough to guide users through the product experience without too much effort on their part. 

If the cues cause them to get lost, which happens all too frequently, the navigation design has failed.

70% of users rely on primary navigation as a way of navigating through your product. 

Common navigation mistakes within SaaS products

Navigation becomes an issue when a product goes against conventions and displays a lack of standardisation. This essentially creates a steep learning curve for a product.

Users simply expect navigation to be easy, so the style of links and icons throughout the product should be consistent in order to deliver a cohesive and ultimately enjoyable experience

Another common mistake occurs in the form of overloading users with choice. If too many items are included in the navigational menus, user engagement will suffer because it’ll take them longer to make decisions about where to go next. If the list of items can be kept to a minimum, engagement will improve because users can focus on what matters and not get distracted. 

Our short-term memory can typically only hold around seven items in a navigation design.

Products lacking in hierarchical structure also suffer, too, because everything is lumped together and made confusing for users. An example of this is when utilities, such as notifications, help screens and profiles, are grouped together with the main categories. The categories should be kept separate as the top-level links to the main elements of your product, whilst also providing easy access to the lower level, yet still important, utilities. 

Rogo displays some of the common navigation mistakes that hold users back

Finally, one of the most significant reasons why users get lost at sea in SaaS product design is because it neglects to tell them where they are in the journey. It’s important to remember that not everybody who accesses your product will have reached it via the dashboard. One easy way to account for this is to use large headlines to indicate page titles so users know where they are at any given time. Breadcrumbs are another great tactic to help users find their ways, but I would suggest using these as sparingly as possible. 

Why navigation matters

We now know why navigation exists and what it does. Here’s why all of that matters. 

Users inherently struggle without guidance, especially when they are new to your product. A poorly considered navigation design will ultimately turn them off and repel them altogether. 

Prioritising the primary method by which users can explore and discover your product is a sure-fire way to engage them.

Consider that the average attention span of a typical user is just eight seconds, which is four seconds shorter than that of a goldfish.

That’s exactly why it’s so important to design a navigation that helps users easily and intuitively find what they want in as short a timeframe as possible. 

Even the best or newest features you build into your product will inevitably become redundant if users can’t find them. 

Practical advice for designing successful navigation systems

Great navigation design will enhance user understanding of a product. It’s that simple. Give people the confidence to keep using a product until they discover its true value. 

I have spent many years designing SaaS products and I’ve collated a few of my main insights from that experience for you here:

Align navigation with user goals

Great navigation should always be completely aligned with the goals of your users. You want to help them achieve success as quickly and efficiently as possible. 

Help your users achieve success as quickly and efficiently as possible

This is why I always recommend using category labels that are both familiar and relevant to the task at hand for the user. Avoiding jargon is a good way to help a user flow through the process

When it comes to the logo, people expect it to link right back to the homepage or dashboard. That’s just the way it is, but you’d be surprised at how many products neglect this common practice.

It also helps to think about user goals at the end of long pages of content. Consider whether it is more helpful to your particular product to have a ‘Back to top’ link or a sticky menu that remains visible whether the user is scrolling up or down. It pays to help your users browse more freely through your product.

Choose the right navigation pattern

Generally speaking, there are three types of primary navigation patterns you should consider to help your users move through your product. You probably already know that, but you might feel that your product’s implementation of them isn’t quite up to scratch. 

Firstly, top (horizontal) navigation is ideal for primary navigation because users expect to find it up there in the header. To reduce confusion, headers are typically separated from the rest of the page, so there is ample real estate for products to organise content beneath it. This is ideal for products that only need to display 4-8 navigation items. 

Choose a clean and simple navigation that is easy to use, such as horizontal navigation

If you find that there isn’t enough space for all of your primary category links, you can introduce a sub-navigation menu to house your secondary category links.

Next up is left (vertical) navigation. This is a very common pattern for SaaS dashboard designs because it allows for vertical scrolling, which is perfect for products that need to display large amounts of content. 

Todoist: Left navigation allows for more vertical scrolling by the user

It’s great for almost any kind of SaaS product, but it’s particularly useful for products that have lots of main navigation links to display. The benefits are two-fold: it enables users to find what they are looking for quicker and allows you extra scope for new items in future releases.

Lastly, there is a combination of top and left navigation systems that allows more complex products to cohesively display information, but this is only suitable for a small number of products, such as those with deeply structured navigation items with far-reaching hierarchies. 

Airtable: Combined top and left navigation is a good option for more complex products

If it appears that too many links are required, front-end developers should consider sub-navigation menus for either top or left navigation designs.

Make your navigation clear to users

You should always endeavour to place your navigation in a familiar location. Users naturally develop an expectation of where to find UI elements according to their experiences with other products. It’s crucial to meet their expectations in that regard.

Moreover, make sure the menu items actually look like they are interactive - otherwise, users might not realise the full functionality of your product and engagement will suffer as a result. To achieve this, you can use link colours that contrast with the background and introduce iconography to make certain items more recognisable. 

Another tactic is to ensure menu items have enough visual weight to them. 

If the design is cluttered, the lack of visual emphasis can mean that certain links can get lost amongst the noise. 

Make sure you carefully consider your choice of colour so a suitable balance can be struck when it comes to the impact of your navigation design. 

Asana: Strike the right balance of colour in your product and your navigation will be easier to understand

You can also make sure that a user knows which menu items are selected at any given time by employing visual cues like dots, markers or underlined words. 

How I can help improve your product navigation

Let’s face it: your product is going to be adapting and developing all the time to changing user needs, but it’s important to get the basics of navigation right so you can build on that foundation and not start from scratch every time. These tips and insights should help you make a start on designing user-friendly navigation systems that can scale as you grow.

I like to start by sticking to established conventions wherever possible so users can feel more comfortable with navigating around a product they haven’t used before.

Designing the perfect navigation design isn’t easy by any stretch of the imagination, but if you can align your users’ goals with your product strategy and navigation design, you’ll be able to create an experience that users will love. 

If the mark is missed, many users can struggle to get to grips with the product and ultimately won’t convert to paying customers. Frustration will lead to churn because your product doesn’t naturally fit into a daily workflow for a user.

This is where I can step in to help you achieve your goals. My aim is to relieve the burden of designing a great navigation system that helps users reach their own goals, so my design process includes evaluating not only your navigation, but your entire product, to ensure that any critical problems are resolved. 

I’m here to help you help users navigate your product with ease so you can spend less time training them in how to use it and more time running your business. 

Design might not be your area of expertise, but it is mine. Bringing me onboard could be the difference between sustained customer churn and sustainable customer growth. 

Get in touch today to find out if there’s a way I can help.

Continue Reading