ActiveCampaign Navigation

Improving page discoverability by 18% for 150,000+ users

ActiveCampaign Navigation

The updated navigation IA and sidebar.

Background

ActiveCampaign is an email marketing, marketing automation, and CRM tool used by over 150,000 customers globally to create unique customer experiences.

In 2021, our company decided to operationalize a portion of development time for customer love and trust: an initiative to resolve defects and improve the user experience. I worked alongside a team of designers to tackle navigation.

Goals

  • Eliminate unsightly page jumps due to unorganized navigation

  • Increase average success rate of finding pages across the application

  • Improve traffic to related features

My role

  • Lead information architect

  • Lead researcher

  • Icon design assistance

The Problem

In 2021, our usability NPS score had declined. When digging into the customer feedback, navigation was mentioned as a main detractor to ActiveCampaign's user experience.

๐Ÿค” Wayfinding

The previous navigation provided a difficult wayfinding experience for customers as they mentioned an inability to find key features.

๐Ÿ‘Ž Siloed features

When considering a the day-to-day tasks of a marketer or sales rep, routine tasks that required multiple features were placed in unrelated, siloed sections of the navigation.

โš™๏ธ Unscalable settings menu

The settings menu had become a dumping ground for any and all features. This was a byproduct of some feature areas not having their own sub-menu.

The Process

Over the course of 6 months, myself and 3 designers led a tiger team to propose a solution and gain buy-in from our executive stakeholders to change the most coveted area of the platform. โœ‹ I was in charge of customer research and information architecture.

While I typically handle visual design in my projects, we decided to divide and conquer our work into two work streams (Information Architecture and Visual Design) to best tackle such a large project:

My information architecture process

  • Review existing customer feedback

  • Conducting task analysis to understand what tasks and features are most important to find

  • Test the current IA effectiveness with tree-testing

  • Co-design workshop to propose a revised IA

  • Test the revised IA and compare to see if there is improvement in task discoverability

1. Task analysis

Using data from pendo as well as product marketing content, I identified tasks users are most likely to take in our platform. These would be the basis for our testing the new navigation.

ActiveCampaign Navigation

Above is a list of the tasks I identified as highest priority.

2. Test current state

I translated the highest priority tasks into questions we would ask users in a tree-testing tool to test the effectiveness of our current navigation structure.

ActiveCampaign Navigation

The users walked through each task and chose where they thought they could find the items within the previous navigation.

Benchmark stats - How was the previous navigation performing?

39
Negative NPS mentions in past 6 months
8
Ideas submitted on customer idea portal to improve navigation
58%
Success rate of sampled users who can find a specific page to complete a task
ActiveCampaign Navigation

After combing through existing feedback, the above themes emerged which help guide my key recommendations.

3. Revise IA

Following the current-state navigation study, I identified a few key recommendations which helped to guide us toward our first solution.

Key recommendations

Image alt tag

Eliminate jump flows

Many navigation items previously jumped the user from one section to another. Our new navigation should focus on keeping the user where they expect to be.

Image alt tag

Create consistent UX

Some of the previous sections of the nav did not have any sub-menu to house relevant features and settings. Going forward, each section should have a space to keep relevant sub-menu items.

Image alt tag

Merge together related features

Contacts and lists were separate menu items with features that cut across both areas. It made sense to merge these two and others like it. Some features could have a persona-based function.

Image alt tag

Better relate settings & reports

Tree tests revealed that customers often looked at feature areas to find settings and reports, so we should group these items together.

Co-design workshop

I led an ideation session with our design team to discuss our findings and identify the largest areas of improvement.

ActiveCampaign Navigation

Card sorting session with internal team members.

Initial proposal

Considering all of the research as well as internal team member ideas, we found many areas of agreement of how we could group a new, usable navigation.

ActiveCampaign Navigation

The initial structure we decided on together to address feature, settings & report consolidation as well as persona-based navigation.

ActiveCampaign Navigation

4. Test again and collect internal feedback

After testing this revised IA and seeing an improvement in task completion time, we presented our proposal for the change to the structure to our executive leadership. We got buy-in on the project and a few key themes:

โœ… Move relevant settings to feature areas

โœ… Move relevant reports to feature areas

โœ… Consolidate related features

โŒ Industry, persona-based navigation

5. Revise IA

Following the proposal, our leadership team was eager to dive into the details of our new navigation and sign-off on each item. After calling out which settings items would move, I outlined the full IA in a spreadsheet to collaboratively review all pages changing locations and which items would now have their own dedicated sub-navigation.

Image alt tag

I proposed and documented a scalable structure for each menu item.

Image alt tag

Full IA changes mapped.

ActiveCampaign Navigation

Converging the new IA with the new visual design.

The Solution

After converging with my visual design partners, we collaborated on a final prototype to create a streamlined navigation which grouped related features, eliminated page jumps, and gave each menu item a proper home.

ActiveCampaign Navigation

Information architecture credit: Myself

Visual and interaction design credit: Evan Tank and Mamie Hatter

Icons credit: Sean Brice and myself

ActiveCampaign Navigation

Relevant features are grouped together

Relevant features will now be grouped togetherโ€”no more jumping around the platform. Tasks and Deals have also been consolidated because they are both related sales features.

ActiveCampaign Navigation

Access settings and reports in the moment, right where they are needed

Settings had become a long, inaccessible, and hard to find menu list. Each relevant settings page and report was moved to its corresponding product area.

The impact
10
Jump flows eliminated
+18%
Increase in avg. success rate of finding pages to complete tasks
23%
More traffic to related report pages
ActiveCampaign Navigation

"Get more done in less time with a more streamlined and intuitive navigation."

ActiveCampaign Blog June 2022

Read more about this release โ†’

Lessons learned

  • Review research plans with stakeholders early on. Our stakeholders weren't initially bought into our recommendations because we weren't using the same metrics for success. We had to re-do our test as a result of this.

  • Test the visual and interaction design, too. I led research and focused evaluating designs of the information architecture, but left out testing the visual design. This resulted in some negative customer feedback about colors and interactions following release.