More Than Books

Designing a library website for the 21st Century, including a room reservation system and online community
 

CLIENT: Watertown Free Public Library

INDUSTRY: Public Libraries

SERVICES: UX Design, Web Development

library website homepage

"We performed extensive research in what we needed for a new website, gathering input from each library department. Bartlett effectively delivered a site that met the needs of the library and the greater community. We are pleased with the results and have enjoyed our working relationship for several years now."

LEONE COLE, Director, Watertown Free Public Library

 

CIRCULATING IDEAS

The Watertown Free Public Library (WFPL) serves a diverse, technology oriented community situated next to Boston with over 350,000 annual visits and 5,000 room reservations. The library has a gallery, cafe and programs for adults, teens and children as well as an extensive Project Literacy program.

WFPL spent months engaging stakeholders to come up with an extensive list of website features. This was narrowed down to a more manageable list that addressed patron’s needs.
The site was built for mobile and desktop devices and includes over 30 library specific features such as room reservations, book and media carousels, visitor registration, ADA 508 compliance, social media integration, calendars, a forum, multilingual translation, photo & video galleries and advanced search.

 

OFFLINE TO ONLINE

Libraries have served a civic role in communities for centuries. Now that public discourse is primarily online, libraries are offering services that meet people where they are.

offline to online library services

The WFPL site includes the first steps toward an online community that meets these needs. As shown in the example above: daily events, a call to action with multiple selections, a list of ways people can participate and a compelling video (‘Libraries: Changing Lives, Transforming Communities…’)

events and meeting room reservation calendar

Making it easy for people to reserve meeting and study rooms was a key goal. Most libraries use third party websites for room reservations. We created this capability within the WFPL site. This provides a more cohesive user experience (UX) as well as allows for customization specific to WFPL’s needs.

 

UX CONSIDERATIONS

library website mobile view

Homepage highlights shown above include:

  • Making it easy for people to find what they are looking for. This was done by making the Search feature (both the catalog and site) prominent in the header as well as a well thought-out primary navigation and drop down menus.
  • A 'select language' option at the top, using Google Translate to serve the 35 languages in addition to English spoken in the Watertown public schools.  
  • An optional alert area for important, last minute notices.
  • Social media sharing and feedback links on every page.
  • An easy to update slider, using Hoopla, for promoting events and programs. 

book display web carousel

Some of the areas we focused on with the interior template as shown above include:

  • A 'card style' user interface. This gives components of the page their own distinct visual area. This is made possible by having a light gray background so blocks can be shadowed on top. The dog-eared right-hand corner of each container gives another dimensional element.
  • A carousel for displaying books. This horizontal scroller is an efficient way to display content in a small area. The books are integrated with the Minuteman Library Network making it easy for patrons to find and reserve books.
  • Extensive content by age. For example as shown above, events, blog posts, summer reading, and book club for teens.

 

RESULTS

The site was well received by the client and Watertown community. Thousands of room reservations were successfully made in the first year. The new site is a vast improvement in several areas, such as: the user interface design, user experience design, information architecture, usability, accessibility, content and over 30 library specific features.

« back to case studies

How can we help?

We'd love to hear how we can help your project come to life. Send us along some info and we'll be in touch!