Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

UX Design

Learn more
1 min read

The Role of Usability Metrics in User-Centered Design

The term ‘usability’ captures sentiments of how usable, useful, enjoyable, and intuitive a website or app is perceived by users. By its very nature, usability is somewhat subjective. But what we’re really looking for when we talk about usability is how well a website can be used to achieve a specific task or goal. Using this definition we can analyze usability metrics (standard units of measurement) to understand how well user experience design is performing.

Usability metrics provide helpful insights before and after any digital product is launched. They help us form a deeper understanding of how we can design with the user front of mind. This user-centered design approach is considered the best-practice in building effective information architecture and user experiences that help websites, apps, and software meet and exceed users' needs.

In this article, we’ll highlight key usability metrics, how to measure and understand them, and how you can apply them to improve user experience.

Understanding Usability Metrics

Usability metrics aim to understand three core elements of usability, namely: effectiveness, efficiency, and satisfaction. A variety of research techniques offer designers an avenue for quantifying usability. Quantifying usability is key because we want to measure and understand it objectively, rather than making assumptions.

Types of Usability Metrics

There are a few key metrics that we can measure directly if we’re looking to quantify effectiveness, efficiency, and satisfaction. Here are four common examples:

  • Success rate: Also known as ‘completion rate’, success rate is the percentage of users who were able to successfully complete the tasks.
  • Time-based efficiency: Also known as ‘time on task’, time-based efficiency measures how much time a user needs to complete a certain task.
  • Number of errors: Sounds like what it is! It measures the average number of times where an error occurred per user when performing a given task.
  • Post-task satisfaction: Measures a user's general impression or satisfaction after completing (or not completing) a given task.

How to Collect Usability Metrics


Usability metrics are outputs from research techniques deployed when conducting usability testing. Usability testing in web design, for example, involves assessing how a user interacts with the website by observing (and listening to) users completing defined tasks, such as purchasing a product or signing up for newsletters.

Conducting usability testing and collecting usability metrics usually involves:

  • Defining a set of tasks that you want to test
  • Recruitment of test participants
  • Observing participants (remotely or in-person)
  • Recording detailed observations
  • Follow-up satisfaction survey or questionnaire

Tools such Reframer are helpful in conducting usability tests remotely, and they enable live collaboration of multiple team members. It is extremely handy when trying to record and organize those insightful observations! Using paper prototypes is an inexpensive way to test usability early in the design process.

The Importance of Usability Metrics in User-Centered Design

User-centered design challenges designers to put user needs first. This means in order to deploy user-centered design, you need to understand your user. This is where usability testing and metrics add value to website and app performance; they provide direct, objective insight into user behavior, needs, and frustrations. If your user isn’t getting what they want or expect, they’ll simply leave and look elsewhere.

Usability metrics identify which parts of your design aren’t hitting the mark. Recognizing where users might be having trouble completing certain actions, or where users are regularly making errors, are vital insights when implementing user-centered design. In short, user-centered design relies on data-driven user insight.

But why hark on about usability metrics and user-centered design? Because at the heart of most successful businesses is a well-solved user problem. Take Spotify, for example, which solved the problem of dodgy, pirated digital files being so unreliable. People liked access to free digital music, but they had to battle viruses and fake files to get it. With Spotify, for a small monthly fee, or the cost of listening to a few ads, users have the best of both worlds. The same principle applies to user experience - identify recurring problems, then solve them.

Best Practices for Using Usability Metrics

Usability metrics should be analyzed by design teams of every size. However, there are some things to bear in mind when using usability metrics to inform design decisions:

  • Defining success: Usability metrics are only valuable if they are being measured against clearly defined benchmarks. Many tasks and processes are unique to each business, so use appropriate comparisons and targets; usually in the form of an ‘optimized’ user (a user with high efficiency).
  • Real user metrics: Be sure to test with participants that represent your final user base. For example, there’s little point in testing your team, who will likely be intimately aware of your business structure, terminology, and internal workflows.
  • Test early: Usability testing and subsequent usability metrics provide the most impact early on in the design process. This usually means testing an early prototype or even a paper prototype. Early testing helps to avoid any significant, unforeseen challenges that could be difficult to rewind in your information architecture.
  • Regular testing: Usability metrics can change over time as user behavior and familiarity with digital products evolve. You should also test and analyze the usability of new feature releases on your website or app.

Remember, data analysis is only as good as the data itself. Give yourself the best chance of designing exceptional user experiences by collecting, researching, and analyzing meaningful and accurate usability metrics.

Conclusion

Usability metrics are a guiding light when it comes to user experience. As the old saying goes, “you can’t manage what you can’t measure”. By including usability metrics in your design process, you invite direct user feedback into your product. This is ideal because we want to leave any assumptions or guesswork about user experience at the door.

User-centered design inherently relies on constant user research. Usability metrics such as success rate, time-based efficiency, number of errors, and post-task satisfaction will highlight potential shortcomings in your design. Subsequently, they identify where improvements can be made, AND they lay down a benchmark to check whether any resulting updates addressed the issues.

Ready to start collecting and analyzing usability metrics? Check out our guide to planning and running effective usability tests to get a head start!

Learn more
1 min read

How to create an effective customer journey map

Understanding your customers is central to any organization which wants to deliver an outstanding experience. But how do you understand your customers better? Tailoring their experience with your products and your organization to suit them should include a customer journey map.

It doesn’t mean your organization needs a brightly colored, fully designed infographic that outlines each and every action your user takes within your product. It does mean an effective customer journey map that promotes empathy and provides a clear vision for improving customer interactions. There are no rules around what that visualization looks like and it is up to your team to create one that makes the most of your customer’s journey.

What is customer journey mapping? 🤔

Customer journey mapping (sometimes referred to as a user experience map) is a technique that allows you to visualize your customer’s key touchpoints, sentiments, pain points, and actions. Plotted in sequential order. It’s a map of a customer’s experience with your brand or product, from awareness to purchase and beyond. 

Customer journey mapping helps you look beyond key touchpoints and encourages empathy with your customers. To understand who they are, even a persona to give them a life and demographic. Helping designers and key stakeholders understand where they are coming from. And where you can address their needs, avoid their pain points and encourage them to engage with your product. And even identify opportunities for innovation and improvement across the board.

Why you need a customer journey map 💥

What’s better than a customer that feels seen and understood once? A customer that feels the organization or product really understands their needs (and responds to their frustrations). Like all successful, long-term relationships, keeping customers returning is built on empathy and a solid grasp of their needs and frustrations. 

When you want to get to know your customer, like really get to know them, it’s essential to map their customer journey. Creating a shared understanding of what your customers think, feel, and struggle with as they interact with your organization. Spending the time to establish a customer journey map can help align around identifying known problems, identifying new user pain points, and removing roadblocks for your customers, ensuring their success.

Spending the time to get inside the mind and journeys of your customers through mapping helps your team to:

  • Create a visual guide of the end-to-end customer experience
  • Get an understanding of multiple customer pathways and unravel complex user experiences
  • Create target personas and allow insights to solve problems more effectively
  • Increase your organization’s empathy for your current and future customers
  • Identify potential pain points and roadblocks for your customers
  • Breakdown silos within your organization and improve alignment across teams
  • With a clearer understanding of your customers, better insights to achieve stakeholder buy-in

How to create a customer journey map 🛤️

Here are 8 key steps to get the most out of your customer journey map process:

  1. Bring key stakeholders together for an initial brainstorming session
  2. Identify potential user personas - demographics, pain points, interests, etc
  3. Create an empathy map - get a real feel for your customer, who they are, and what they want
  4. Flesh out your ideas with user research. Get under your user persona skin with focus groups, interviews, and surveys
  5. Identify possible customer touchpoints
  6. Choose the information you want to highlight - not everything will be relevant
  7. Decide on the best customer journey map tool to answer your questions
  8. Start building your map

Customer journey mapping examples 🗺️

Each and every customer’s journey is different. This, of course, means that there is no single best customer journey map example or template. Instead, the best customer journey map for any given situation will depend not only on your customers but also on your product, your team, and the goals you’re hoping to achieve by creating the map in the first place.

We’ve found a few examples of customer journey maps to help inspire your thinking:

Current state customer journey maps help you to visualize a user’s experience as it is right now. These are fact-based journey maps - to create an accurate, current state journey map. A good dose of user research data around your actual customers and interactions will help shape this.

An example of a customer journey map
An example of a customer journey map

Future state customer journey maps focus on what the customer journey can and should look like in the future. Although UX data is certainly an important aspect of understanding customers, future state journey maps involve a fair amount of creative speculation and interpretation. These customer journey maps focus on customer hopes and wants (future feelings), in addition to experiences and reactions. They can be a little objective and should be developed in balance with both positive and negative interactions.

Day in the life customer journey maps help you visualize your customer’s entire daily routine. Interactions with family, their commute, work meetings, afternoon coffee, etc. Regardless of whether or not the activities are related to your company. This type of journey map should be organized chronologically to give key insights into how and where customers are. What are the distractions, and where could they interact with your brand or product? How can key pain points be eased?

Service blueprints are a useful counterpart to a classic customer journey map. Whereas a customer journey map focuses on the thoughts, needs, and actions of the customer, a service blueprint reflects the perspective of the organization and its employees. What needs to happen behind the scenes to ensure the customer’s experience is the very best it can be.

Circular customer journey maps may be useful to visualize the customer journey as a circle or loop. Recognizing that some customers are recurring and non-transactional. Particularly through subscription-based relationships.

An empathy map is used to create a shared understanding of customers around their wants, needs, thoughts, and actions. This can be a great starting point to getting under your customer’s skin.

An example of an empathy map
An example of an empathy map

Wrap Up 🌯

There is no one size fits all customer journey map. Each customer is unique, each organization is different. Through creating customer journeys, personas and visualizing their key touchpoints, pain points, and understanding who they are, empathy throughout the organization can be generated. With this as a tool to bring key stakeholders on board and to pinpoint where products (and services) can be improved to keep customers or even bring new ones on board, the user experience can be better and more effective.

Learn more
1 min read

Information architecture is much more than navigation

Information architecture is so much more than finding your way around a website or app. IA should be considered the foundation of a great user experience. The planning and consideration that goes into how information is organized labeled, and named. Once this foundation is laid, the user interface is what sits above and allows users to access the information. Navigation is one way that designers can point users in the right direction. But without correct labeling and naming (or even searching) navigation can only get us part of the way.

Let’s go into detail about what information architecture and the role navigation really plays. 

What is information architecture for a website?

Probably the easiest example of navigation is on a website. We are familiar with websites and how navigation can make or break a user experience. A website's information architecture (IA) can be considered to be made of two main components:

  • Identification and the definition of the site content and functionality.
  • Underlying organization, labeling, and structure that will define the relationship between the site's content and functionality.

When a user lands on your website they won’t see the information architecture, rather, they will be interacting with the user interface (UI). While the IA itself is not visible while using the user interface it most certainly impacts the user's experience (UX). 

The IA should be planned and the content structure visualized through diagrams, spreadsheets, and with wireframes, prototypes, or comprehensive layouts. Designing with the IA in mind web designers can create a better user experience. The user will not see the structure of the website but they will quickly discover the way the content has been divided up and then connected visually. And how well the information architecture matches these expectations will influence their UX.

When this interaction is not a great experience, users may leave feeling that your website content or functionality is not what they needed. They may end up feeling disappointed with the experience due to poor organization, naming, or structure.

What’s the difference between IA and navigation?

Ensuring that the information architecture is thought through, considered from the end users’ perspective, tested, and planned is essential to building a great website from the ground up. Great navigation is what cues users to move on to the next step in their journey and ultimately will determine their experience.

Navigation is but one part of the story and tools to help users find their way through a website, app, or other product. 

Information architecture can be broken down into three main areas to consider when building a great user experience:

  • Navigation: How people make their way through information (website content)
  • Labels: How information is named and represented.
  • Search: How people will look for information (keywords, categories)

When put like this it does seem pretty straightforward. Information architecture isn’t just how your information is navigated (on a website or app) but how it is labeled, the taxonomy, and the searchability help users find what they need from the information architecture.

How do the IA and navigation work together best?

An information architecture that has been planned, considered, researched, and structured with understanding and the intention of the needs of users and the owners will be robust and at its very best intuitive.

With an information architecture that has been organized well the navigation doesn’t need to work as hard. With correct labeling and organization of the content, navigation acts as a visual guide on your product to help users find their way to what they want. Imagine well-named road signs that are expected and easily seen. It makes finding what (where) you want much easier, even on a dark night.

Coupled with robust IA navigation will provide intuitive pathways for users to complete tasks. For instance, if you want your users to find where your contact information is, making certain that there is a navigation tab at the top of your website labeled ‘contact us’ which then has what might be expected (address, phone number, map, and even an email contact form) will make sense for users and the owners of the website.

Wrap Up

Whilst navigation is a key component to users finding their way through your content information architecture is so much more than navigation. IA is the foundation of a great product, naming, labeling, organizing, and planning your information in a logical and expected way. Navigation is the sign that directs people to the content they want. And from there to the task or product they are looking for. If there is navigation without thought through information architecture, they may look in the wrong place, becoming lost and abandoning their task altogether.

Learn more
1 min read

Why information architecture is the foundation of UX

Ever wondered what the relationship is between information architecture (IA) and UX? Simply put, IA is the foundation of UX. We outline why.

What is Information Architecture? 🛠️

According to Abby Covert, a leader in the field of information architecture, IA is ‘the way we arrange the parts to make sense of the whole.’ This can relate to a website, a retail store or an app. And you could even consider the way a library is sorted to be information architecture. For the purposes of this article, we will focus on digital products (apps or websites).

Well-organized information architecture is fundamentally important to the success of your product. As a designer, knowing the content you are delivering and how, is fundamental to creating a UX that performs. Working with the needs of the organization and meeting the requirements of the users in a meaningful and delightful way. Organizing and structuring the information so that navigating, searching, and understanding your product is seamless is ultimately what UX design is all about. Arranging the parts to make sense of the whole, you could say.

While design is about creating visual pointers for users to find their way, information architecture can be broken down into 3 main areas to consider when building a great user experience:

  • Navigation: How people make their way through information 
  • Labels: How information is named and represented.
  • Search: How people will look for information (keywords, categories)

When put like this it does seem pretty straightforward. Maybe even simple? But these tasks need to be straightforward for your users. Putting thought, time, and research at the front of your design and build can increase your chances of delivering an intuitive product. In fact, at any point in your product’s life cycle, it’s worth testing and reviewing these 3 areas.  

Key things to consider to build an effective IA for UX 🏗

Developing a well-thought-out and researched information architecture for your product could be considered a foundation step to creating a great UX product. To help you on your way, here are 6 key things to consider when building effective information architecture for a great user experience. 

  1. Define the goals of your organization: Before starting your IA plan, uncover what is the purpose of your product and how this will align with the goals of your stakeholders.
  2. Figure out your user’s goals: Who do you want to use your product? Create scenarios, discuss with probable users and find out what they’ll use your product for and how they’ll use it.  
  3. Study your competitors: Take note of websites, apps and other digital products that are similar to yours and look at their information architecture from a UX point of view. How does the design work with the IA. Is it simple to navigate? Easy to find what to do next?  Look at how key information is designed and displayed.
  4. Draw a site map: Once the IA is planned and developed and the content is ready, it’s time to figure out how users are going to access all of your information. Spend time planning navigation that is not too complex that will help users to browse your product easily. 
  5. Cross browser testing: Your information architecture behavior may vary from one browser so it’s worth doing some cross-browser compatibility testing. It would be very disappointing to work so hard to get the best UX with your product, only to be let down because of browser variances.
  6. Usability testing: End users are the perfect people to let you know how your product is performing. Set up a testing/staging environment and test on external users. Observing your participants while they move their way through your product uninterrupted and listening to their opinions can shed light on the successes (and failures) in a very insightful way. 

Wrap Up 🌯

Information architecture is the foundation of designing a great product that meets (or even exceeds) your users’ needs, wants, and desires. By balancing an organization’s needs with insight into what users actually want, you’re well equipped to design an information architecture  that helps build a product that delivers a positive user experience. Research, test, research, and test again should be the mantra throughout the development, design, and implementation of your product and beyond.

Learn more
1 min read

Designing information architecture for mobile apps

Designing for a mobile app is quite different to designing for websites. The content may be similar (even the same) but the intent for users is likely to be different, as are the environments and occasions they use them. When designing for mobile the information architecture (IA) uses a different set of rules. The key consideration needs to be around ease of use on a smaller screen for a user that is possibly on the move and very likely distracted. They have limited time, limited attention and need a quick result.

Your app could be the first point of contact. It might be the only way your user interacts with you on a regular basis. It needs to be super simple, clean, and quick to interact with. A well thought out, thoroughly researched, and organized information architecture plays a big part in helping to deliver an easy and enjoyable user experience.

What is information architecture?

According to Abby Covert, a leader in the field of information architecture, IA is ‘the way we arrange the parts to make sense of the whole.’ Information architecture (IA)is found in every digital product, from websites, apps to an intranet and can even be applied to the physical world in places like libraries and supermarkets.For the purposes of this blog we will focus on the importance of information architecture for mobile apps. Researching and designing an app’s IA with just the right amount of information is key. And providing a way of navigating that content in a way that is quick and intuitive is key to a good user experience.

How is designing for mobile different?

The first thing to understand about mobile app information architecture is that it’s different – and not just with regards to size. The sheer physicality and specifications of mobile devices mean we need to consider different design requirements. Because mobile devices are light and portable, users are in constant contact with them and they are by far the most convenient way to access information. With mobile apps it can be even more important to consider the user journey, to keep that journey as short as possible, and anticipate the user's needs. Consideration should be given to:

  1. Physicality and specifications
  2. Constant accessibility
  3. How people behave and feel

1. Physicality and specifications

Most mobile device interfaces are accessed through touch screens. Users rely on learnt gestures – in addition to a simple interface – to interact. Because of their smaller dimensions, users often expect the content structures to be simpler and smaller. Also, because of limited bandwidth and connectivity, mobile devices require app designs to be optimized for loading time, with reduced data demands.

2. Constant accessibility

Because we have constant access to our mobile devices, we tend to use them a lot more. They come with us on the bus, walking the dog, or even watching TV. We often use them while ‘doing’ something else. This means we often use the device under difficult viewing conditions, or among a variety of distractions.

3. How we behave and feel

We have different attitudes, behaviors and priorities while using mobile devices. Many of us often have our mobile device within arms reach at all times. We have become attached to these devices and feel ‘lost’ when we don’t have them nearby. Some people even consider them an extension of their being!

How do you factor information architecture into your mobile app design?

We need to think of mobile devices as having their own particular information architecture structure to work within their unique requirements and environments. While the structure of a responsive website may follow the same IA, native apps often employ navigational structures that are tab-based. There’s no one or ‘right’ way to architect a mobile site or application. Rather it’s dependent on factors like the size of the content you need to organize or what the intended user journey is that informs the choice of  information architecture structure. Let’s take a look at some of the most popular IA structures for mobile apps:

Hierarchy

A standard website structure with an index page and a series of sub pages. If you are designing a responsive website you may be restricted to this structure, however introducing additional structural patterns could allow you to tailor the user experience for mobile.

Hub and spoke

Gives you a central index from which users will navigate from. It’s the default pattern on Apple’s iPhone, with a home screen and the various apps users download. Users can’t navigate between spokes but must return to the hub (home screen), instead.

Example: Hierarchy
Example: Hub and spoke

Nested doll

Leads users in a linear fashion to more detailed content. It’s a simplified interface which quickly leads on to the next step. It can be most useful when users are in distracting conditions because  it’s a quick and easy method of navigation.

Tabbed view

Regular app users will be familiar with this structure. It’s a collection of sections tied together by a toolbar menu. This allows the user to quickly scan and understand the functionality of the app as soon as it’s opened. Easy to navigate throughout the app.

Example: Nested doll
Example: Tabbed view

Filtered view

Allows the user to navigate within a set of data by selecting filter options to create a view that suits them. Can be more difficult to view on mobile if there is too much content, as it can be difficult to display.

Example: Filtered view

Wrap up

When designing for mobile devices it is important to always keep in mind the user journey and how (and when) users  are likely to be interacting with your app. What is their primary objective? What is your organization's objective? How do you move them through their tasks to enable them to complete them quickly, simply and easily? Working within the size restrictions and limitations of mobile devices and users needs and desires with a thoroughly thought out IA structure will always win on the day.

Learn more
1 min read

Why is information architecture important to UX design?

What is information architecture? ✏️

According to Abby Covert, a leader in the field of information architecture, IA is ‘the way we arrange the parts to make sense of the whole.’ Information architecture (IA) is found in every digital product, from websites and apps to an intranet. 

For the purposes of this article we focus on the importance of information architecture to user experience (UX) design because IA is fundamentally important to the success of your user experience. It determines how users will access your  content and ultimately how successful their experience is when using your product. 

When put like this it does seem pretty straightforward. Maybe even simple? But these tasks need to be straightforward for your users. Putting thought, time and research in at the front of your design and build can help build an intuitive product. IA is the structure that sits in behind and allows the design to tell the story and the content to be found in an easy way.

The role of information architecture in UX design 🏗️

Information architecture forms the framework for any UX design project. You need to consider the visual elements, functionality, interaction, and navigation and if they are built according to IA principles. If not considered fully even the most compelling content and powerful user experience design can fail without an organized and functional IA design. Disorganized content can make finding your way through difficult, meaning users get lost, annoyed and frustrated. Frustrated users don’t stick around and most likely don’t come back.

Through solving or preempting users’ issues with research and designing powerful and effective IA it reduces usability and navigation problems. Meaning that researched, thought through and designed information architecture can save both money and time for your organization in the longer term.

What is the difference between IA and UX? 🤯

Often it can be confusing that there isn’t much difference between IA and UX design. While these terms do relate to each other and need to be considered alongside, they are not one and the same.

Information architecture (IA) is the discipline of making information findable and understandable, helping people understand their surroundings and find what they’re looking for online and in the real world” - Interaction Design

User experience (UX) design is the process design teams use to create products
that provide meaningful and relevant experiences to users” - Interaction Design

UX design is well grounded with good functional information architecture but that’s not where it stops. The user experience focus is on influencing users’ behaviors and actions through emotion and psychology. Information architecture is focussed on the users' goals and task completion. They work together to create the very best user experience. IA provides the foundation of a well organized space that is easy to navigate and UX design ensures that the overall experience meets (or exceeds) users’ expectations, through their wants, needs and desires.

The key components of IA 🧱

There are four key components to consider when building a strong information architecture:

Labeling

How information is named and represented. Labels need to communicate information to users without using too much space or requiring much work on the user’s part.

Navigation

How people make their way through information. Without robust IA which has been thought through this is the quickest way to confuse users. If they can’t find their way to the information they need, they won’t be able to complete their task. It really is that simple.

Search

How people will look for information (keywords, categories). A search system is especially important when there is a lot of content to wade through. A search engine, filters, and many other tools help users search content. Great UX design will consider how the information will be displayed once searched.

Organization

How the information is ordered. These help users to predict where they can find information easily:

  • Hierarchical is the hierarchy of the content and literally the order of importance
    the user expects to see information against what the organization needs.
  • Sequential Taking a stroll in your user's shoes can be valuable. Considering the path a user would take and the journey they make. Walking step-by-step, ensuring that as users progress through their tasks they are easily led to the next step.
  • Matrix This is a little more complicated for users as it lets them choose how to navigate on their own. Users are given the choice of content organization. For example, the searchability of a website. Where the user could choose to search by topic, size, price or any other filter or option.

Wrap up 🥙

Information architecture is a key part of a powerful user experience design. Efficient IA helps users quickly and easily move through content and find what they want.  And what do users want but to find what they want, complete their task and get on with their day!

Provide an IA that functions well, is intuitive to use and well labeled, coupled with UX design that is smooth, attractive and responds to users needs, wants and desires and you’ll have a winner on the day.

No results found.

Please try different keywords.

Subscribe to OW blog for an instantly better inbox

Thanks for subscribing!
Oops! Something went wrong while submitting the form.

Seeing is believing

Explore our tools and see how Optimal makes gathering insights simple, powerful, and impactful.