Website Navigation Redesign- The Brooklyn Public Library
Nichole Tyler
My Role: UX Researcher | Duration: 1.5Weeks | Project Status: Completed
Project Overview
PROBLEM SPACE
Modern day library users are a paradox of wanting access to a vast amount of information while also wanting specific information without having to look very hard for it. This provides libraries with the challenge of balancing ease and accessibility with depth and specialized offerings. We narrowed that scope further by looking through the eyes of our persona, Priya, and evaluated how limited or lack of access to information regarding product availability would affect her.
OUR GOAL
How can we provide Priya with a way to locate available titles without having to navigate through three levels of information? We focused on evaluating the current primary and secondary navigation structures of the Brooklyn Public Library’s website to determine if the information architecture could be better organized to solve Priya’s problem while still achieving business goals of the library.
METHODOLOGY
We structured the research for this project into two phases: business and user research on the existing navigation structure, and then user research and heuristic recommendations on the proposed navigation structure and home page redesign. We then took that research and incorporated into a hi-fidelity prototype.
TAKEAWAYS
Overall, we learned that users are overwhelmed by too much information in a navigation structure, especially when there is little context for what those navigations mean or where they lead. We also learned that too much similarity in secondary navigation labels makes it hard for users to differentiate between primary navigation, leading to frustration and task abandonment. Finally we learned that design practices like inconsistency in navigation or page labeling unintuitive interactivity can lead users to feel like they are lost within the website and failing at controlling their experience. We incorporated all of those insights into the design of our high-fidelity prototype, which we believe addresses Priya’s problem directly and helps the Brooklyn Public Library achieve it’s goal of providing information about product availability.
Scope of Work
Modern users have little patience for ambiguity or confusion about whether or not a product or service is available, and modern library users are no exception. Users also expect to be able to intuitively navigate sites soon after they are introduced and utilize site resources to filter through massive amounts of information to find what they are looking for.
Process (Explaining the UX Framework at a High-Level)
For our project methodology, we first focused on designing the right thing through business and user research; we then transitioned to designing things right through heuristic evaluations and prototyping. Below, we have included our UX Methodologies at each step in our project:
UX Methodologies: Our Process from Start to Finish-
Discover: Competitive Research and Analysis
- Business Model Canvas: Used to build a foundational knowledge of the business and industry so that we were able to then understand who our true competitors are
- Competitive Matrix: Defined services/resources the library currently provides that are important to our user and evaluated interfaces/features offered by successful competitors that may serve as an opportunity for the Brooklyn Public Library to improve it’s offerings
- Features Analysis: Defined the space in terms of understanding the landscape, avoiding “me too’s” and finding ways to differentiate
Define: Information Architecture Evaluation/User Research
- Tree Test: Determined if user flow through the existing and proposed navigation structure of the website was intuitive based on user expectations
- Card Sorting: Helped us understand if a path is clear and allowed us to understand commonalities in how users group data points and if that matches up with current/proposed navigation
- Heuristic Evaluation: Identified (in terms of user experience) design strengths we can leverage or weaknesses we can focus on improving as we transition into the redesign phase
Design
- Site Maps: Helped us understand and communicate how the different pages within navigation structure relate to one another in both current and proposed design.
- User Flows: Helps us understand all the possible steps a user could go through to achieve a task so that we could make sure our proposed design addresses every step within that task.
Deliver
- Hi-Fidelity Prototype Mockup: Culmination of research and heuristic evaluation into visual representation of redesigned navigation system
- Hi-Fidelity Prototype: Interactive prototype used to communicate functionality and design of new navigation system outcomes
Persona (Provided by the Brooklyn Public Library)
Problem Space Statement
Scenario: Modern day library users expect to have instant access to information regarding title availability.
Persona: As a result, Priya expects to be able to know whether or not a book is available to rent without having to visit each individual book page.
Goal: How might we provide Priya with immediate access to available titles?
RESEARCH PHASE
Business Research
Goal of Research
Our goal for business research was to understand the library as an organization, the competitive landscape in which it exists, and the competitors and comparators that exist in its space. Additionally, through heuristic analysis, we wanted to evaluate the current site design’s compliance with recognized usability principles through the Abby framework.
Methodology
Business Model Canvas: Our team performed secondary research through the Brooklyn Public Library site as well as other industry resources to fill out each category of the business model canvas, a representative tool of the library as an organization.
Competitive Matrix: Our team first focused on the user persona and analyzed her behaviors, habits, pain points, goals and needs to come to a baseline of services that were most important for her (i.e. access to information, accessibility of material, and opportunities to learn). We then created a list of businesses, in addition to the Brooklyn Public Library, that currently solve one or more of those needs and created a visual representation of where those businesses fall in relation to one another.
Features Analysis- Competitors: Our team conducted secondary research through the Brooklyn Public Library website as well as competitor websites to generate the list of features to compare for this analysis. Considerations include some method of engaging customers on new release information, classes and learning opportunities, providing customization based on established or provided interests and immediate availability of books or e-books. Although our business model is for a non profit organization (NPO), we are not competing in that business model alone but are in direct competition with commerce/e-commerce as well.
Features Analysis- Comparators: : Our team conducted secondary research through the Brooklyn Public Library website as well as comparator websites to generate the list of features to compare for this analysis. Considerations include some method of easy online membership, online customer service, classes and learning opportunities, providing customization based on established or provided interests and immediate availability of resources or immediate opportunity to visit. Although our business model is for a non profit organization (NPO), we are not competing in that business model alone but are in direct comparison with organizations that are privately and federally funded.
User Research- Existing Navigation
Methodology
Goal of Research
Our goal for our first round of user research was to determine if user flow through the existing navigation structure of the website was intuitive based on user expectations.
Tree Test: In this type of testing we used the existing labels in the primary and secondary navigation on the website and provided a pool of ten testers with three task scenarios to complete. Through the test results, we wanted to answer the following questions in order to provide insights we can leverage in the design phase: How easy is it for our users to achieve their tasks? Were their paths direct or indirect? Do they ultimately succeed or fail?
Card Sort-Open: In our team’s open card sort we provided participants with 30 cards derived from the primary and secondary navigation existing in the current menus on the Brooklyn Public Library’s site. Users generated their own groups and then titled those groups in ways logical to them. We conducted the test through the Optimal Workshop website and had a total of 6 participants for the open card sort.
Card Sort- Closed: We implemented this approach into our research so that we could better understand how our users organize information within the current taxonomy of the Brooklyn Public Library’s website, which is currently broken out into the following primary navigation sections: Borrow, Learn, Attend, and More. We provided the users with the secondary navigation content and asked them to sort them into those four categories so we could better understand where our user expectations deviated from the current navigation structure. As with the open card sort, we conducted the test through the Optimal Workshop website and had a total of 6 participants for the closed card sort.
Heuristic Evaluation: We selected four pages from the current website (Home, Borrow: Books, Learn: Adults, Attend: Adults) that we believed best represented the activities of the target user and analyzed the pages across Abby’s ten heuristic categories: findable, accessible, clear, communicative, usable, credibility, controllable, valuable, learnable, and delightful. We scored each page on the ten categories through a scale of 0–3 (0 representing a major problem and 3 representing best practices) then combined the totaled category scores across the four pages to get an average score per heuristic. The graph below represents the website as a whole.
RESEARCH » DESIGN (Intersection)
Business Research >> Design
User Research >> Design
Heuristic Evaluation>> Design
DESIGN PHASE
Design of New Navigation Structure
User Testing- Proposed Navigation
Tree Testing: In this type of testing, we used the proposed labels of the primary and secondary navigation in our redesigned structure and provided a pool of testers with three task scenarios to complete. Through the test results, we wanted to answer the following questions in order to provide insights we can leverage in creating the prototype: How easy is it for our users to achieve their tasks? Were their paths direct or indirect? Do they ultimately succeed or fail? We conducted the tree test through Optimal and had 14 participants.
Card Sorting-Closed: We implemented this approach into our research so that we could better understand how our users organize information within the proposed taxonomy of the Brooklyn Public Library’s website, which is has been redesigned to be broken out into the following primary navigation sections: Books + Movies + Music, Attend Events + Classes, Learn, Explore, and More. We provided the users with the secondary navigation content and asked them to sort them into those four categories so we could better understand where our user expectations deviated from the proposed navigation structure. As with the open card sort, we conducted the test through the Optimal Workshop website and had a total of 6 participants for the closed card sort.
Research Synthesis- Proposed Navigation
Synthesis: We saw an overall improvement from round one of user testing, validating the information architecture of the redesign and prompting us to create a minimum viable product prototype for presentation.
MVP Reveal
Next Steps
- Consider changing the names of the secondary navigation labels under the learning category. Although it wasn’t included in the scope of the inital project, user research in both rounds indicated confusion between similar labels “Attend” and “Learn” navigation such as “For Kids” and “Kids”
- Apply heuristic feedback from rest of site and create a hi-fidelity prototype of entire site redesign
- Conduct usability testing on hi-fidelity prototype of site redesign and get user feedback
