Search by Algolia
What is ecommerce merchandising? Key components and best practices
e-commerce

What is ecommerce merchandising? Key components and best practices

A potential customer is about to land on the home page of your ecommerce platform, curious to see what cool ...

Catherine Dee

Search and Discovery writer

AI-powered search: From keywords to conversations
ai

AI-powered search: From keywords to conversations

By now, everyone’s had the opportunity to experiment with AI tools like ChatGPT or Midjourney and ponder their inner ...

Chris Stevenson

Director, Product Marketing

Vector vs Keyword Search: Why You Should Care
ai

Vector vs Keyword Search: Why You Should Care

Search has been around for a while, to the point that it is now considered a standard requirement in many ...

Nicolas Fiorini

Senior Machine Learning Engineer

What is AI-powered site search?
ai

What is AI-powered site search?

With the advent of artificial intelligence (AI) technologies enabling services such as Alexa, Google search, and self-driving cars, the ...

John Stewart

VP Corporate Marketing

What is a B2B marketplace?
e-commerce

What is a B2B marketplace?

It’s no secret that B2B (business-to-business) transactions have largely migrated online. According to Gartner, by 2025, 80 ...

Vincent Caruana

Sr. SEO Web Digital Marketing Manager

3 strategies for B2B ecommerce growth: key takeaways from B2B Online - Chicago
e-commerce

3 strategies for B2B ecommerce growth: key takeaways from B2B Online - Chicago

Twice a year, B2B Online brings together industry leaders to discuss the trends affecting the B2B ecommerce industry. At the ...

Elena Moravec

Director of Product Marketing & Strategy

Deconstructing smart digital merchandising
e-commerce

Deconstructing smart digital merchandising

This is Part 2 of a series that dives into the transformational journey made by digital merchandising to drive positive ...

Benoit Reulier
Reshma Iyer

Benoit Reulier &

Reshma Iyer

The death of traditional shopping: How AI-powered conversational commerce changes everything
ai

The death of traditional shopping: How AI-powered conversational commerce changes everything

Get ready for the ride: online shopping is about to be completely upended by AI. Over the past few years ...

Aayush Iyer

Director, User Experience & UI Platform

What is B2C ecommerce? Models, examples, and definitions
e-commerce

What is B2C ecommerce? Models, examples, and definitions

Remember life before online shopping? When you had to actually leave the house for a brick-and-mortar store to ...

Catherine Dee

Search and Discovery writer

What are marketplace platforms and software? Why are they important?
e-commerce

What are marketplace platforms and software? Why are they important?

If you imagine pushing a virtual shopping cart down the aisles of an online store, or browsing items in an ...

Vincent Caruana

Sr. SEO Web Digital Marketing Manager

What is an online marketplace?
e-commerce

What is an online marketplace?

Remember the world before the convenience of online commerce? Before the pandemic, before the proliferation of ecommerce sites, when the ...

Catherine Dee

Search and Discovery writer

10 ways AI is transforming ecommerce
e-commerce

10 ways AI is transforming ecommerce

Artificial intelligence (AI) is no longer just the stuff of scary futuristic movies; it’s recently burst into the headlines ...

Catherine Dee

Search and Discovery writer

AI as a Service (AIaaS) in the era of "buy not build"
ai

AI as a Service (AIaaS) in the era of "buy not build"

Imagine you are the CTO of a company that has just undergone a massive decade long digital transformation. You’ve ...

Sean Mullaney

CTO @Algolia

By the numbers: the ROI of keyword and AI site search for digital commerce
product

By the numbers: the ROI of keyword and AI site search for digital commerce

Did you know that the tiny search bar at the top of many ecommerce sites can offer an outsized return ...

Jon Silvers

Director, Digital Marketing

Using pre-trained AI algorithms to solve the cold start problem
ai

Using pre-trained AI algorithms to solve the cold start problem

Artificial intelligence (AI) has quickly moved from hot topic to everyday life. Now, ecommerce businesses are beginning to clearly see ...

Etienne Martin

VP of Product

Introducing Algolia NeuralSearch
product

Introducing Algolia NeuralSearch

We couldn’t be more excited to announce the availability of our breakthrough product, Algolia NeuralSearch. The world has stepped ...

Bernadette Nixon

Chief Executive Officer and Board Member at Algolia

AI is eating ecommerce
ai

AI is eating ecommerce

The ecommerce industry has experienced steady and reliable growth over the last 20 years (albeit interrupted briefly by a global ...

Sean Mullaney

CTO @Algolia

Semantic textual similarity: a game changer for search results and recommendations
product

Semantic textual similarity: a game changer for search results and recommendations

As an ecommerce professional, you know the importance of providing a five-star search experience on your site or in ...

Vincent Caruana

Sr. SEO Web Digital Marketing Manager

Looking for something?

facebookfacebooklinkedinlinkedintwittertwittermailmail

We’re excited to share a behind the scenes look at our newly redesigned navigation. The redesign is the result of lots of research and hard work, and it’s still evolving. We’ve been listening carefully to feedback and now that it’s launching, we’ll continue to listen and make it better.  

Algolia is growing

There were many good reasons to rethink the way our users navigate around our Dashboard. We’re constantly conducting research with our users, and we had amassed a growing list of issues they were encountering with the existing navigation. Choices that made sense back when we had fewer features were no longer working. At certain screen sizes, our navigation was disappearing off the bottom of the screen. 

For instance, we were using the sidebar to handle:

  • Managing and switching between applications
  • Navigating around different search features
  • Managing billing and team roles
  • Managing personal account settings

Our navigation was practically bursting at the seams!

… and growing!

On top of all of that, we’ve recently released our second product: Recommend (psst, more about that here. It’s super cool!). So, along with all the other things competing for attention in the navigation, now we needed a way for our users to move between the two distinct products, Search and Recommend, easily. It had to be crystal clear where they were in the dashboard at all times, and they needed to be able to understand why they should use one product over the other. And we needed a solution that would scale as more products come along.

Rethinking the hierarchy

One of our first steps was to give each separate function a home. As you can see in the old design, we were asking the sidebar to carry a heavy load. Application switching, search navigation, personal settings, and help all lived within a shared space. The unfortunate result was that the mental load was transferred to the user, who was expected to make sense of it all.

So we devised a new model where each type of action has a defined place. Now, the sidebar is reserved solely for navigating through the dashboard. Want to change or add an app or index? That will always be right at the top center of the screen. By defining these spaces more concretely, we’re allowing users to make assumptions about where to find things based on their past experiences. When we need to add something new, there’s no question about where it belongs.

We also dedicated space in the top right corner for Support, Documentation, and Help-related items. If you need to get to the Docs quickly, you’re always just a click away.

Designing an intuitive navigation

Separating out our products

When it comes to navigating through the Algolia dashboard, we’ve made some changes to help you find what you need. The most obvious change is that we’ve given each of our products its own place in the navigation. It’s a small shift in the way we think about working in the Algolia dashboard, but it allows us to surface more specific features right when you need them.

For example, if you’re using Recommend, you’ll only see features that are relevant to Recommend. The same goes for Search. Time and time again we watched our users become frustrated and confused during tests because they were seeing navigation that wasn’t relevant to the product they were using. 

Creating a single platform

Offering multiple products brings some new complexities that we needed to solve. Many things that had always been tied to Search, like an index, might now be used elsewhere. It’s entirely possible to have indices that are only used for Recommend, so we suddenly needed a place where you can see both Search and Recommend indices together. So we added a third section called “Platform.”

Initially, we added the Platform to house navigation items that crossed multiple products. It sat at the same level as our products, but served to aggregate shared elements. I say initially, because, well, it’s not there anymore. But I’ll get to that in a bit. 😉

Grouping related features

To me, this is where things started to get really interesting. An important thing to realize about Algolia’s dashboard is that our users aren’t all technical. Lots of them are, but some of them really aren’t. We see lots of PM’s, merchandisers, and even designers, and it’s equally important to us that we support them all. 

So with this in mind, we knew that certain terms that are obvious to one type of user are often completely baffling to another. User testing had shown that there was a bit of a cliff in terms of technical understanding–basically non-technical users were getting stumped by the same terminologies over and over again. We needed to build a bridge.

We added feature groups to help us solve this problem by rearranging the items into groups based on their functionality. Over and over, we saw testers use the group headings as clues to figure out where something might live in the navigation. As a designer, it was exactly the type of thing we’d hope to see them do. 

Within each product, we’ve grouped features so that they connect better to the user journey. For example, within Search you’ll find “Configure,” “Observe,” and “Enhance” groups.

As seen here, Enhance groups together ways to “enhance” relevance. Configure is where you can do things like add an index, or make query suggestions. In Observe, you’ll be able to check search analytics or launch an A/B test. 

And More!

Of course, we didn’t stick with just those updates. We also took the opportunity to make some adjustments to the UI in preparation for planned updates. In general, we’ve cleaned things up as much as possible and made a lot of subtle improvements. Now we have a cleaner slate for what’s coming. 

The last big change I want to mention is actually the first thing you’ll encounter when you come to the Algolia Dashboard: a revamped Overview page. I know this sounds crazy, but we wanted the Overview page to actually be an overview. So now you’ll have a bird’s-eye view across everything you do in Algolia, not just search. We’ve added quick links for the things you’ll need most, and we have lots of interesting plans for how this screen can be even more useful for you. What you see today is really just a first step for this screen.

 

Beta Testing

For me, the best part of the design process happens after people start using the interface. The truth is, all of the changes I’ve just talked about so far were guesses. We go through a design process to make them well-educated guesses, but they’re still guesses all the same. That changes when real users start telling us what it’s like to use Algolia to do their job.

And when we released our public beta in July, we found some issues right away. People had trouble finding some really important things like API keys, Billing, and Team Settings. And the reason they had trouble finding them is because putting them all in a section called “Platform” didn’t make sense. With the help of some really insightful user interviews, we ended up splitting Platform into three new sections in the navigation: API Monitoring, Data Sources, and Settings. I love it because we never would have come to that solution without the help of our users.

Though not as big and noticeable as that, we also made some other important changes during the beta. We made adjustments to the UI contrast to make the hierarchy a bit more obvious. We iterated on how the secondary navigation opens and closes. And we tightened up the tooltips that appear when the product navigation is minimized. They’re not something that the average person might notice, but taken as a whole they make a big difference in the way it feels to use the navigation. 

Let’s go!

I’m incredibly proud of the team that worked to make the navigation what it is today. The role teamwork plays in rethinking a long-standing navigation can’t be overstated.

There are a lot of great product updates coming on the heels of this navigation. To be honest, it really feels like the navigation is a gate that we’re opening, allowing everything else we’ve been working on to come roaring out. It’s a really exciting time here at Algolia and I can’t wait for you to see what’s next. 

About the author
Craig Williams

Director of Product Design & Research

Curious about what Algolia can do for your business?

Get a free and personalized demo of our search and discovery solutions

Request a demo
Curious about what Algolia can do for your business?

Recommended Articles

Powered byAlgolia Algolia Recommend

Good API Documentation Is Not About Choosing the Right Tool
engineering

Maxime Locqueville

DX Engineering Manager

Why we recommend Recommend to make recommendations
product

Pauline Lafontaine

Sr. Product Marketing Manager

Why you should capture click and conversion events from day one
engineering

Jaden Baptista

Technical Writer