Dallas Public Library
📚 Re-envisioning an outdated website so that visitors can easily find media, events, and locations on desktop and mobile
See design flats / See desktop prototype / See mobile prototype
OVERVIEW
A space for learning & community
The Dallas Public Library website connects visitors to a variety of services, from borrowing books and media to free online courses. The website also informs visitors about upcoming events at the libraries, like extracurricular activities, financial planning assistance, and voting.
The Problem
Visitors find the website difficult to navigate due to its cramped resolution, inconsistent typography, and disorganized layouts. The site is also only partially responsive, making it hard for mobile users to access and engage with content.
The Solution
Refresh the website with cohesive layouts and clear navigation, enabling visitors to easily find services and information in their preferred language and platform.
Impact
- 100% of usability participants reported a positive sentiment of the updated layout, noting that features were easy to locate, and elements were visually accessible
- 90% of usability participants appreciated the integrated map feature and its ease-of-use
- Participants who spoke non-English languages valued the multilingual options
- Consolidated three disparate layouts into a unified design
- Simplified the typography by reducing the nine original fonts to a unified pairing
DISCOVERY
Understanding library visitors
Usability Test
I first conducted a usability test of the base website to determine essential features and pain points. I guided five diverse participants through Home, Catalog, Events, and Hours & Locations. Participants appreciated the content of the website but expressed an overwhelming negative reaction to the navigation and presentation. One participant noted:
“Sometimes when information is laid out like this, you wonder if the website still works.”
Three disparate layouts
Participants were frustrated with finding information because of the inconsistent formats.
Unresponsive table
Participants had difficulty discerning library locations because of the cluttered and small text.
Desk Research
I then consulted primary source articles to explore demographic information about Dallas residents, library visitors, and the devices they use. A notable intersection is that lower income Americans are more likely to rely on smartphones for internet access and to value the services that libraries provide.
The desk research coupled with the usability test enabled me to identify user needs:
- Clear navigation
Users need to easily browse content and find information, such as library hours and locations. - Modern & unified presentation
Users need the website to be engaging and cohesive across different pages. - Responsive layout
Users, especially those who only have access to a phone, need a functional mobile layout. - Multilingual support
Users need information to be available in their preferred languages, such as Spanish, Chinese and Vietnamese.
DESIGN
Brainstorming solutions
Comparative Audit
To explore possible solutions, I evaluated the user experiences of other library/bookseller websites in a comparative audit. The websites share common elements, such as a desktop navigation bar with drop-down menu, mobile hamburger menus, and multi-lingual support.
Comparative websites also provide interactive maps, enabling visitors to quickly find the closest locations by identifying landmarks or entering a library name or zip code.
Low-fi Prototype
Referring to the user needs and design patterns from competitor websites, I incorporated improvements in low-fidelity mobile and desktop prototypes:
- Cohesive grouping of related content
- Expanded screen space; unified and modernized presentation
- Layouts that are responsive for desktop and mobile
- Dropdown menu to switch languages
- Interactive map of locations
TESTING & ITERATIONS
Providing more context for locations
I conducted 4 rounds of usability tests and iterations for the desktop and mobile prototypes, each with five participants of diverse ages and languages. Participants found the website to be relatively straightforward to use but felt confused when navigating Hours & Locations. I addressed these issues in the high-fidelity prototypes.
Visitors need more context for the pins on the map.
Problem
2 participants felt lost by the lack of context for pins on the map.
Solution
A numbered list of locations with details correlates with the pins on the map.
Visitors need to find locations more quickly and conveniently.
Problem
3 participants found List View to be too long. Each location card occupies sizeable screen space.
Solution
Without pictures, each card occupies less space. A Show More button reveals cards in increments of five.
FINAL DESIGNS
A streamlined & cohesive experience
With a cohesive layout, clearer navigation, and accessible presentation of content, the redesign empowers visitors to comfortably find the information that they need. See design flats.
Visitors can quickly find a library via the map or by entering a location.
Prominent filter options enable visitors to easily browse events.
REFLECTIONS
Guided by feedback
I improved the user experience and navigation across four key pages by incorporating cohesive and streamlined layouts. Close observation of comparative websites and usability participant feedback was essential for improving each iteration. Looking back, I would change my approach from page-level improvements to streamlining a specific user flow, such as looking for an event and its location. This approach would focus on more specific user needs and illustrate a visitor’s real experience for stakeholders.
Yihyoung Li 