Brooklyn Public Library

Developing a progressive web app to cut operational costs and improve user satisfaction of the digital catalog


Brooklyn Public Library


UX Designer (Me), Web Developer


10 Months


Desk research, Heuristic Evaluation, User Interviews, Task Flows, Wireframes, Prototypes, Competitive Analysis, Card Sorting


I collaborated closely with the Web Developer at Brooklyn Public Library (BPL) to transform the mobile digital catalog into a progressive web app. I led the design process, starting from research and problem identification, all the way through design and handoff.

Additionally, I took on the role of Product Lead, where I led prioritization workshops, devised sprint plans, and oversaw backlog management.


BPL is a beloved institution with 59 branches serving a vast and diverse community. Their responsive website (managed and developed by BPL) and mobile app (managed and developed by a third-party vendor) provide users with the ability to access and manage library resources from anywhere.


  • Pioneered a proof-of-concept that garnered leadership buy-in for the BPL team, propelling the project forward.

  • Leveraged the digital catalog experience to gather valuable insights from patrons and librarians, enabling us to better understand their priorities and address their concerns.


BPL's current digital catalog experience is fragmented across two separate platforms: a responsive website and a mobile app

While users appreciate the convenience of the mobile app, it lacks the features they find valuable on the website. Conversely, although users enjoy the features of the website, it's not as accessible on the go. This forces them to choose between the two platforms or switch between them constantly, creating friction and frustration.

Mobile App




Search results screen on the mobile app


Users cannot narrow down their search results unless they click into ‘Advanced Search’


Users must click into item detail page to place a hold


No labels on icons make them harder to identify




Item detail page


A lot of information in a small viewport


‘Request Item’ is a CTA but shares same treatment as ‘Item Details’ which is a static header


Overall, UI feels cluttered and outdated. Does not incorporate BPL’s updated primary brand colors.


Screen shots of app reviews from the Apple store


App does not have booklist feature, which is something many users value

Mobile Responsive Website




Search results on mobile responsive site


Search bar and filters take up most of viewport


In user interviews, participants were unsure what these filters meant


Users uncertain what icons mean. Place a hold, in particular, is not obvious to users.


Recording of catalog filters


Filter dropdown: Long scroll and lots of content to shift through


Recording: adding a book to a booktlist


Add to booklist: minor feedback loop caused friction and low confidence during usability tests


Improved user satisfaction

Users would have a more consistent and enjoyable experience across all devices and platforms.

Increased engagement

A more user-friendly digital experience would encourage users to engage more actively with the library's resources and services.

Reduced operational costs

Consolidating the mobile app into a single platform would yield efficiency and cost savings by eliminating the need for separate systems.

Focusing on access patterns, we chose leisure patrons (mobile-first) as primary users and BPL librarians (desktop-dominant, occasional mobile) as secondary

Leisure Patrons


Browse the catalog, exploring different genres or popular titles

Use more surface level features, like borrowing items and mobile checkout


Curated booklists

An easy way to browse, search & filter, and place holds while on the go

E-readers and audiobook options

Personalized recommendations


Design for mobile-first

Prioritize popular features

Optimize for small screens and quick interactions

BPL Librarians


Help patrons find materials and educate them on how to use resources


Advanced search capabilities

Ability to create booklists

Detailed information about resources

Seamless integration with a Library Management System (LMS)


Allow desktop functionality on mobile

Provide access to full resource data

Offer options for bulk actions and customization


Through extensive research, I gained valuable insights into the challenges and needs of library users

My research included:

In-depth conversations and usability tests with 10 leisure patrons, staff members, and people who haven't used the library yet. This allowed me to gather firsthand information about their experiences and pain points.

Analysis of insights from key stakeholders. This provided valuable perspective on the library's goals and priorities.

Review of previous UX research conducted by BPL. This helped me identify existing knowledge and build upon past findings.

A comprehensive audit of the website and mobile app. This revealed usability issues and opportunities for improvement.

Photo of in-person usability test of mobile app (left) and screenshot of research plan (right)

Challenges with filtering, confidence completing tasks and concerns with the user interface were the top takeaways from research

Filtering and Searching:

Challenges: Users struggled to narrow down search results and were unaware of alternative browsing options.

Opportunities: Enhance filtering options, provide clear instructions on browsing without keywords, and emphasize awareness of these features.

Task Completion Confidence:

Challenges: Users lacked confidence in placing holds and adding books to booklists, often making errors due to unclear instructions or confusing user flow.

Opportunities: Improve clarity of instructions for key tasks, streamline user flow by minimizing unnecessary steps, and provide visual cues for placing holds and adding to booklists.

User Interface:

Challenges: Users found the website and mobile app cluttered and visually confusing, with inconsistent design elements and placement of links.

Opportunities: Implement a cleaner design, ensure consistency in color, style, and layout, and improve information hierarchy.


Figuring out the next step

The research revealed a wealth of UX opportunities, but with limited resources, we needed to prioritize. I facilitated a workshop with BPL's web developer, where we identified critical issues with the highest impact and feasibility. These areas became my primary focus for the duration of my contract. As BPL developed designs, I provided continuous feedback and collaboration to ensure quality throughout the process.


Ensuring solutions embody the values that matter most to users and the Library

By listening to stakeholders and users, I was able to unearthed core concerns that became the foundation for our design principles.

Content first design:

Design should support and enhance content, not compete with it. We will embrace a minimalist design approach that prioritizes content clarity and ease of navigation.

Make me feel included:

Ensure accessibility and inclusivity across all aspects of the catalog. Users should be able to easily understand how to interact with the catalog and its various functions.


How might we reduce user anxiety and uncertainty about adding items to booklists?

  • Changed the primary action in the overlay from "Create new list" to "Done" to match user mental models and provide a more intuitive experience

  • Added a toast/snackbar that confirms the action to increase confidence that an item has been added successfully

  • Utilized the full screen to give patrons more space to see booklists

  • Evolved icon-only actions in search results cards into CTA buttons with accompanying icons. This provides additional context and cues for understanding, making it easier for users to identify and take action




How might we enhance the filtering experience?

Filtering through content is one of the bigger user pain points that we determined is high effort-high-impact, with two core issues to address:

  • How might we visually reinforce the dynamic nature of filters, making it clear that their behavior and options are dependent on the currently selected tab?

  • How might we enhance the search narrowing experience to minimize user overwhelm caused by excessive scrolling and information overload?

Option 1: Partial screen overlay.

We needed even more space to see what’s available. Not enough real estate to add categories.

Option 2: Accordion embedded within the page.

Usability testing showed that scrolling between filters and search results was an issue.

👑 Option 3: Full-screen overlay

Allowed for more explanation of each tab (category) while saving space.


How might we minimize user confusion and facilitate effortless navigation?

My Account - Home

❌ Option 1: Button like tabs combined with a hub and spoke model within the page. Didn’t feel very intuitive.

❌ Option 2: List form. Not all high-level categories were visible without the user scrolling. Format didn’t feel engaging or reflective of the BPL brand.

👑 Option 3: Improved tabs with engaging metadata (e.g. number of checkouts). Familiar file-folder tabs mirrors traditional web menus, feels more intuitive.

My Account - Holds

❌ Option 1: Top portion takes up too much real estate. In usability testing, participants misunderstood Filter buttons.

❌ Option 2: Top portion still takes up a lot of real estate, number of physical holds vs digital holds is not the most important information.

👑 Option 3: Simplified, condensed top portion and de-emphasized physical vs digital holds. Since filter & sort options are limited, these options were pulled out for easier access.

Let's work together!

© Daryle Ward-Cherry 2023