top of page

Access to Public Library Resouces

Winter 2021 - Solo School Project

User research, information architecture analysis, and UI Design for a mock public library website

My Role

  • Remote Interviews 

  • Information Architecture Analysis

  • Storyboard Design in Figma


"How might we design a public library website to better connect patrons with the library's lesser-known resources?"

A common gripe among library workers is that libraries have so many resources, events, and
services to offer their patrons, and yet no one seems to know about them.


In this project, I designed the home page and several important resource pages for a mock public library system, focusing on the global navigation. Using data from supplementary and primary research, I created an Information Architecture analysis that informed my final design. 

Research Methodology

Competitive Research

I looked at the pre-existing global navigation and service pages on three library websites


I interviewed two library workers; one specializing in marketing, and another working in a branch


I received 53 responses from library patrons about their expectations and desires from public libraries

Competitive Research

To better understand the problem as it currently exists, I looked to how library systems currently structured their information and offered information on their services.

From this, I learned that public libraries rely heavily on hybridized organization structures in their global navigation. Top-level labels for topics ('Books & Media'), tasks ("Learn") and audience ("Kids & Teens") exist together on the same line.


This provides a wide range of options for patrons to choose from depending on need. However it leaves an unstable gestalt that makes scanning difficult. 


The global navigation is what teaches patrons what they can expect from a library. It needs to strike a balance between informative and scanable.


I spoke to two library workers to learn about how libraries share resources online. Especially during the COVID-19 Pandemic, public libraries need an online presence to reach their patrons; their website is an online hub for social medias, digital events, and databases and resources available to the community. 

When the interviews were over, I created an Affinity Diagram to chart the patterns. I found that while many barriers to resources patrons may experience are institutional, many are digital and can be addressed by UI Design.


Many factors contribute to patrons' access to resources. We can be more effective if we focus on improving existing structures rather than a new service.


To better understand which services the community expects and values from their public libraries, I prepared a survey for library patrons and non-users. I asked not only what they used, but what they wished libraries had.








Data Points

I compared the results of what participants used at their library alongside their desired services: many participants wished their library provided services that many libraries actually do provide, like ebooks. Overall, uses and desires of participants fell into three common patterns.


The things library users expect to find at a library fall into three categories: information, education, and community involvement. 



Using the research conducted, I set out to create a website for a public library that could be easily navigated by many types of users. I narrowed my design's focus to providing a global navigation that was easy to use, informative, and adaptive to multiple styles of searching. 

Global Navigation

Prompted by the conventions of other public library sites in North America, I gave two sets of navigation: one in the top right relating to a user's account; and the main navigation relating to the library's services and collection. 

After informal feedback from peers, I learned that the purple was too strong on certain monitors, and that the cut-edge border looked outdated to some.

I also did not have a plan for how it would look to press the 'search' button. Seeing as the ability to search a library's website is very important to usability, I did not want the button to be ambiguous to the user. 

My next design iteration took this feedback into account. I opted for a less intrusive background colour, and moved the global navigation above the main content. I moved the search bar outside of the global navigation.

When seeking feedback for this design, I focused on the labelling. I asked peers things like "Where would you go to see if your library had LinkedIn Learning access?". I found that the labels were not clear, and people had a hard time distinguishing between eMaterials, Reference, and Community Service.

Here is my final design. I moved the search bar back to the global navigation, as it is an integral part of the website's navigation. I clarified the labels in the main navigation.


I also changed the labels in the top-right navigation: as this section was meant to relate to a user's account, I replaced "Contact Us" with "Get a Card", as this is traditionally where a user might expect to find "Sign Up".

When hovered, each element expands to a submenu, to allow for audience-based organization and easier navigation.


Constant iteration is key to clarifying designs! Do not get too attached to any one design or organization. Solicit feedback often.

User Scenarios

I used the three categories of expected services to create three storyboards guiding through user scenarios. 

Link to Figma File

Click image to open in new window


Museum Card

Museum Card - Hover

Collection Spotlight


Lessons & Acknowledgements

This project was completed in two weeks for the course INF2191 - User Interface Design at the University of Toronto under the direction of Professor Velian Pandeliev. 

This projected solidified the need for constant feedback and iteration. I was able to quickly change problematic aspects of the design before too much was built on it, saving myself the time of potentially high-effort redesigns. 


I also was able to focus my efforts on one design challenge, which allowed me to dive deeper into the issues surrounding global navigation rather than spread myself too thinly on a single iteration of the design.  

bottom of page