BookPeople
How can a menu redesign improve the user experience?
Project Overview
Improve the megamenu navigation by restructuring and simplifying the information architecture.
Role
Duration
UX Designer
80 hours
Intro
Everytime I move to a new city, I scout out the local bookstore offerings as my first step in settling into my new home.
BookPeople is a beloved independent bookstore in Austin, TX where I most recently relocated. Though there’s nothing quite like the joy of wandering through a bookstore’s many shelves, I find myself more frequently browsing their books through their website.
I was curious to see if there were opportunities to bring that same ease of in-person browsing to their website.
Original home screen of the BookPeople website.
What are the existing issues?
I started by creating a test asking people to complete tasks throughout the website. But with the constant back-tracking, I noticed people had an overall issue with the navigation.
Users often decided to use the search bar instead when looking through the menu didn’t give them immediate results.
These insights were backed up by the people behind the website when I asked what feedback they’ve heard from online customers.
“[Finding a specific book genre was] annoying and frustrating, because I had no idea how to get there.”
“Our menu is pretty large and complex, which can make finding something specific challenging on occasion.”
Online customers have difficulty navigating the menu.
Discover
I began by creating an open card sort of every menu item to see how people naturally group things together.
People were often confused about the meaning behind certain cards:
Is “Kitchen & Home” a genre of book or a type of gift?
Others got tripped up when two cards seemed too similar:
Is there a difference between “Gift Cards” and “e-Gift Codes” and should they be categorized differently?
Some cards just didn’t make sense:
What exactly does “BookPeople in a Box” mean?
Mostly, people ended up leaving many items uncategorized.
Very quickly, I realized this was not the best test to conduct.
And while a new way of testing was necessary, in the process I learned that people found the menu labels themselves confusing and would file this insight away for later.
Let’s try that again…
To really identify menu issues, I needed a test with a bit more structure.
I decided to pivot and create a tree test instead.
These more enlightening results helped me identify specific areas in need of improvement.
Tree test of the main menu
Tree Test Findings
Information was hard to find.
“I had to go back a couple of times because I went down the wrong menu, at least I thought I had.”
“I feel like there should have been an FAQ tab in the main menu rather than having to go through to ‘shop’ and then try and hunt the info there.”
When users can’t easily find what they’re looking for in the menu, they’ll often resort to the search bar or leave the site altogether. I want to make sure users feel the same, if not more, ease they'd feel if they were browsing through the physical store.
People were expecting categories the menu didn’t offer.
“I was expecting a general page about shipping or general FAQs.”
“I assumed the Shop by Category would lead to Shop by Genre or include a list of genres to shop by…I didn’t see anywhere to shop by genre.”
Most physical bookstores organize their shelves by genre. If you’re looking for a mystery book, you’d make your way to the shelves displaying the store’s mystery selection. Users expected to find this same pattern on the website menu. Similarly, many users expect e-commerce websites to have common patterns like a specific FAQ section.
There was a lack of clarity.
“Too many repeat options.”
“The wording of many of the different dropdown options were unclear to me.”
Some options in the menu appear multiple times, others will be named differently but take you to the same page, while still others have names that aren’t clearly understood by the user.