UX Case Study# 2: Information Architecture (Brooklyn Public Library).

Overview.

As a team, we have been assigned to evaluate the overall structure of the Brooklyn Public Library website and how it currently serves their business model. The main objective of this investigation was to ensure that all best practices of web design through effective information architecture were implemented. Part of this process was to identify its competitors and comparators along with their potential deliverables in order to understand how different they are compared to the ones offered by BPL. We used our Persona as one of our main tools for a better understanding on users needs. also, we conducted a total of 2 rounds of Tree Testing and 2 of open/closed card sorting test. Next, we analyzed the Heuristic evaluation of the BPL. After synthesizing all the valid information from the previous methods and testings, we had a clearer vision of what users need and the modifications that needed to be done on the BPL website for a simplified and efficient experience for users. Lastly, we created both the actual BPL sitemap and our proposed sitemap which, consequently, helped us create our proposed high Fi mockup.

Methodology.

Our first step was analyzing the website by using a Business Model Canvas which is a tool we used to discover the BPL’s core values. Being able to determine the values of the company helped us identify and determine what our client hopes to achieve from our work as we proceeded. following the Business Model Canvas, we looked to identify competition with a Competitive Matrix. To complete the Feature Analysis, our team decided to compare the Brooklyn Public Library to 10 competitive and comparative companies. We started by analyzing both the differences and common features among the
competitors, as well as the comparators. Subsequently to our analysis, we recruited 13 people to complete a Tree Testing followed by and Open and a Closed Sorting Card test. This testing helped us understand how the user would prefer navigating through the website, while also understanding how user’s associate common phrases with each other.

After synthesizing and analyzing the first results, a second round of each testing was conducted with new participants. In order to verify whether our proposed modifications and improvements to the BPL website would meet users expectations , we based our analysis and investigation on our Persona’s needs and goals. also, as part of our work, we explored the BPL website to identify whether its design matches users mental model. The next step to take was conducting the Heuristic evaluation which helped us draw conclusions regarding whether or not the Brooklyn Public Library website meets basic usability principles. We created a Wire Flow from the BPL as if our Persona were to seek a deliverable form the Website. this method helps us understand the exact steps that a user would take to meet their goal and how we could improve it. And lastly, we created the existing Sitemap and the proposed one which led us to develop a High-Fi mockup. We will see how different the primary and secondary navigations have been developed as well as the wording of labels.

Problem Statement:

“how might we provide users a clearer and efficient way to
accomplish their task when browsing the BPL website?”.

Persona.

This is Priya, the Persona who we have been assigned to our group as our main target for this project.

Business Model Canvas.

This is Business Model Canvas we had created to help us visualize and understand our client’s business model and how it operates in a straightforward, structured way. We were able to learn how our client produces value for our users and how it produces value for the business itself.

Takeaways:

● BPL’s values primarily lie in providing their users with learning services
such as access to books, internet service, podcasts, admissions to
partnering museums, and educational programs.

● BPL is actively involved in strengthening their relationships with both
their customers and key partners across all channels.

● BPL generates a significant amount of revenue streams mostly through
government funding, donations, and event space rentals.

Competitive Matrix.

Our team created a competitive matrix in order to gain a better
understanding of where the Brooklyn Public Library stands in the
marketplace compared to its competitors. We started by drawing out a competitive set to determine who our competitors might be. We kept Priya at the forefront along with her priorities.

Takeaways.

● BPL’s closest competitors are the New York Public Library and Queens
Public Library. While all three are public Libraries, the NYPL is more
generalized than the other two boroughs’.

● Amazon Kindle and Libby both fell closely together towards Resources,
as they offer a catalog full of books and audiobooks to both buy and
rent. This region would be valuable to our users when convenience and
a need for resources is their priority.

● Barnes & Noble ended up being a more specialized competitor, with
both resources and in-store experiences to offer their users.

● The Bedford Free library is a more specialized library within its region
leaning slightly more towards resources over experiences.

Feature Analysis.

To complete the feature analysis, our team decided to compare the Brooklyn
Public Library to 10 competitive and comparative companies.Our reasoning for using this method was that we wanted to see what other companies were doing both similarly and differently, as well as analyzing what other companies were doing better than us.

Takeaways:

● What we ended up noticing while comparing competitors was that at
first glance they generally had similar features.

● While analyzing the comparative companies, we started noticing big
differences. For example: the BPL website was missing a lot of
accessibility features, FAQ, etc.

Tree Testing.

This testing is a usability technique for evaluating the findability of
topics in a website. Which means how users would prefer navigating through the website, while also understanding how user’s associate common phrases with each other. With this type of testing we will be able to see if the current user interface is effective or if it’s something that we would need to work on.

Takeaways:

● Participants found that completing Tree Testing was confusing to
navigate and that the wording of the tabs were not related to the
categories.

● The results from the Tree Testing shows us that The Brooklyn Public
Library website needs improvements and modifications in order to
offer a better navigation experience.

● Conducting Tree Testings helps us gather data which is synthesized in
order to better understand the user’s interface with the Brooklyn Public
Library website.

● We learned from the results user’s generally never knew the exact
path to navigate, but mainly had indirect success.

Open/Closed Sorting Cards.

In performing this exercise we sought to assess the users’ mental models of
how hierarchical concepts relate to one another within the site’s primary
navigation. It helped us determine whether or not the current primary navigation of the website matched the users’ mental models and, if not, how we should go about remedying the site’s navigational elements to better align with their expectations.

Open.

Takeaways:

● Most media (books/ movies/ music/ etc.) were grouped together more
than 80% of the time.

● The cards that had to do with information regarding the information on
the library itself were placed in the same category by the majority of
users.

● Users demonstrated an interest in creating a separate category for
‘people’, including immigrants, educators and age groups.

● A very low percentage of users ( around 14% — 25% ) associated the
age group cards with other cards ( ex: ‘business & career services’ )
that fell beneath the primary navigation’s ‘Learn’ tab.

Closed.

Takeaways:

● Users were split 60 / 40 regarding the classification of certain cards
and very rarely were they of the same mental model when sorting.

● Implies that the current labels found within the primary navigation do
not meet the user’s mental model and will likely prove confusing.

● Given no context, the age categories were particularly difficult for
users to categorize successfully.

● The ‘immigrants’ card was especially challenging to classify without
context.

Heuristics.

Through Heuristic evaluation, we were able to draw conclusions regarding
whether or not the Brooklyn Public Library website meets basic usability
principles such as whether the BPL is Usable, Credible, Controllable, Valuable, Learnable, Delightful, etc.

Takeaways:

● The most problematic heuristic offense that our team discovered lay
within ‘Accessibility’, which scored a 1 overall. It was the only heuristic
that did not meet best practices across all pages that we evaluated.

● Across all pages, the site proved to meet the most expectations with
credibility, ranging from scores of 2–3 on all pages.

● The eBook & Audiobooks page met the best practices overall, with the
most 3s and the accessibility being the most troublesome.

Tree Testing (Round 2).

After collecting all the information we required from the previous research methods and synthesized them, individually , each one of the members of our team conducted a second round of Tree Testing and Closed Card Sorting Test. I was able to recruit 8 participants to complete each test. The pictures below are two examples of the result graphs.

Takeaways:

● The results showed that Participants encountered language barrier issues when executing the test because of the wording in scenarios.

● Results outcome from round two were completely different than expected.

Closed Sorting Card Test (Round 2).

For the second round, I created each of the secondary navigational elements on individual cards. Users were then asked to sort these cards into the provided categories to see if the users’ mental models were in alignment with the purposed navigation’s functionality.

Takeaways:

● Participants expressed that some of the cards could belong under multiple categories, not just one specifically.

● Results didn’t turn out as expected.

BPL Sitemap (Existing).

I have designed the actual sitemap of BPL in order to have a better understanding of where the potential modifications need to be made.

BPL Sitemap (Proposed).

The proposed of BPL Sitemap was designed to show how easier and efficient it would be for users to navigate through the BPL Website. Labels from primary, secondary and tertiary navigations were simplified.

User Flow (Existing Website).

This is the User flow of the steps that Priya (Persona) would take if she were to seek a book on the BPL website.

HI-Fidelity Mockups Flow (Proposed
Navigation).

The main menu was modified and worded in a way that it is meets users’ mental model.

Secondary navigation was also modified and worded differently than the original website for an easier navigation.

I found important that each section of the website be classified by one specific color and pictures related to the deliverable users seek. In this case, I related pink and a picture of books with the “Books” section. Thus, users will have in mind that, at the BPL website, pink is related to books. The same way that “sky blue” can be related to kids section.

Hi-Fi Mockup link:

https://www.figma.com/proto/snXYSBo8L9abfkqdJHCXfZ/Untitled?page-id=0%3A1&node-id=46%3A7&viewport=55%2C115%2C0.17347866296768188&scaling=min-zoom

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Grow — Designing a Mobile App for Health and Wellness

Copy Decks for a Copywriter

How do others experience you?

Case study: mobile app to maintain visitors’ interest in museums.

Building of the Orsay museum in Paris near the Seine during sunset.

Library Design: The Art of Architecture

Exploring the Minitua of Truly Building an Experience

Easy communication on the web plays an important role in achieving success

Project Number 2: Phase Two (Mindmaps, Format Dummies, etc.)

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Alejandro Arias

Alejandro Arias

More from Medium

Concept design for Curbside food pickup

The Journey to The Parking Spot: A Case Study

QuitCarbon — UX study of an App that helps users Quit Smoking

Creating a Mobile App for all Gardeners