A “navigation model” describes the paths to each user goal on a website. Usually your product will have more than one user, and each user may have multiple goals, so models like this can be pretty extensive. Creating a navigation model is also an opportunity to review any existing content you may have and understand the context in which you will be creating the structure.
As a web designer it’s your job to help users find their way to what they’re looking for. It can be easy to put the needs of your users to one side, but knowing your users, understanding their roles, goals, motives and behavior will confirm how you structure your navigation model. A well designed navigation promotes discovery.
In this article I’ve put together a guide on how to create a navigation model, so that your interaction design supports the goals of the user, your client and other stakeholders involved in the project.
Your Users’ Goals
Before going any further, create a user persona.
Do your homework. Understand your users’ goals, motivations and pain points before you go anywhere near your navigation design.
For example, let’s say your product connects dog owners with people who’ll mind their dog while they’re away on holiday. Consider all the information dog owners will need to achieve their goal and map out the steps involved.
Role: Dog Owner
Goal: Find a dog minder to look after (including washing, walking and caring for) their dog while they’re away on holiday.
Steps: Find the Perfect Minder for Dog → Schedule and Book Online → Travel with Absolute Peace of Mind
Consider what the user will need to see and do at each stage to reach their goal. How do they know that they achieved it successfully?
Establishing User Levels
It’s important to understand the navigation levels needed and to plan for each level separately.
Consider Other User Journeys
Often, there are multiple user journeys to consider. In the example above, the dog owner looking for someone to take care of their pet is relying on a dog minder, whose needs and motivations vary.
Consider your key audience, but also bear in mind any secondary ‘actors’. This will help you capture your user stories, so you can plan your navigation effectively.
Understanding the Context of your Project
Also consider the business goals for the site, what stakeholders will be involved? What are some of the constraints you will face?
In a nutshell, your aim is to deliver a user-centered interface with an intuitive interface for users, but also something which works for the businesses involved.
What are the Project Goals?
What type of business model does your client have? Are they trying to create an e-commerce website for selling products? Or are they trying to monetize a subscription, advertising... or something else?
It’s very important to understand the desired outcome–this will influence how you structure your navigation. If you don’t yet know, interview project stakeholders and explore the business problem with them further.
Once you’ve drafted a rough web navigation model you can also consider where the product will be used, platform, frequency of use and what the user will be doing at the time.
Make sure that you prioritise your users and sketch the many varied and different journeys they will take to reach their goals.
Consider Your Content
If you are redesigning an existing web navigation, or have researched similar websites you will have an idea of the type of content accessed.
At this stage check available analytics. Take a look at what content users are currently benefiting from. Try to understand what they are looking at most and least often.
In the example above think about the information the primary user (our dog owner) will need in order to complete the first step (finding the perfect minder for their dog). Before performing a search they might have concerns over the legitimacy of the site, or vetted minders. Or even understand how the process of your site or application works. In this case you need to make sure information is available before the more direct process of moving toward a goal begins. This path is likely to be a one-off experience, taken only by newcomers.
Card Sort
A card sort is a good way to organize and prioritize your I.A. (information architecture), or review existing content that you have to work with, which can help you to understand the current navigation structure.
Preparing some of your user stories on index cards, and organizing them into groups can help you flesh out your navigation model.
Here is a quick overview to a card sort:
- Group similar cards
- Stack alike cards
- Discuss uncertainties
- Count alike cards and put a number on top of stack
- Discuss trends, patterns and questions
Materials:
- Sharpies (black, blue and red)
- Index Cards
- Blue Tack
- Stickers
- Butchers Paper
- Sticky Tape
Online Tools:
There are also a number of desktop publishing and cloud computing tools available:
Resources:
For more detailed discussion and examples of card sorting please visit the following more comprehensive resources:
- Card Sorting - Usability.gov
- Card Sorting - Interaction-Design.org
- Card Sorting - MeasuringUserExperience.com
Conclusion
A solid web navigation model is the backbone of your I.A. Once you’ve successfully completed this phase of your project you can look at creating a search definition (what users are likely to type when they search) and sitemap (the structure of the different pages). These are the main I.A. deliverables, but there are a few more depending on the nature of your project.
In order to create a solid navigation model consider your users, and put yourself in their shoes.
Help them overcome their pains and achieve their goals in a way that is easy to do. Consider the context in which they are using the website. Will it be digested in a mobile format? Will they be on the go?
And finally, research similar products. See how others structure pathways you’re designing.
Are you currently working on a navigation model? Leave your thoughts below!
