Accessibility Design for Metadata to improve CELA Library's Search Experience
About CELA Library
UX Research
Accessibility Audit
Contributors
Amaar Fatmi
Megan Toye (Client Representative)
Hailing Zhang
Hannah Lee
Teresa Lau
Thaksha Shivakumar
My Role
UX Resources
Persona
Affinity Mapping
Thematic Analysis
Experience Map
The Centre for Equitable Library Access (CELA), Canada's comprehensive accessible reading service, providing books and other materials to Canadians with print disabilities in the formats of their choice. Our group is currently working with the client to improve users' ability to search, find, and select books based on the accessibility features.
Prototyping
Problem
Improve users ability to search, find and select books based on the accessibility features.
Our team collaborated with the representative from the CELA Library team to uncover the problem statement and conducted background research to help our team narrow down the design problem
Sector Analysis
A print disability refers to an “inability to read printed material due to perceptual, physical or visual disability”. Such disabilities could be attributed to visual impairment, a learning disability like dyslexia, or other illnesses like Parkinson’s disease, arthritis, and early dementia
Library Services for Users with Print Accessibilities
.png)
However, only 5% of printed materials are available in alternative formats tailored for individuals with print accessibilities
"As of 2020, about three million Canadians are estimated to be living with print disabilities."
Design Challenge
How might we expand and iterate upon the current search functions within the CELA website to improve the users’ experience when searching for reading material in the alternative format of their choice?
Interviews
Understanding User Needs and Pain Points
5 Patrons with Print Disabilities
.png)
2 Librarians using CELA's services
.png)
2 Stakeholders as part of the CELA team
.png)
To truly understand what could be the underlying pain of our users, during our user research planning, our group focused mainly on qualitative attitudinal primary research: interviews and observation. We proposed interviewing 7 end users: 5 patrons with print disabilities and 2 librarians using CELA's services and 2 stakeholders representing the organization.
From the interviews conducted, evidently our group found recurring themes users share when searching for books using CELA's services. Our group created an affinity diagram, which led us to conducting a thematic analysis to generate the shared themes.
Affinity Diagram to Conduct Thematic Analysis
Identification of Themes
Theme #1 Search Systems
We discovered 6 sub themes within this group starting with, searching systems and results and the challenges end-users may encounter, problems with the search user interface, problems with filtering for search results, a desire towards improving the search system on CELA’s website, challenges for end-users when finding a book, and lastly, cataloging issues where a book exists within the CELA library but cannot be easily found by end-users and stakeholders.
Theme #2 Accessibility Metadata
A common theme found between both stakeholders was accessibility metadata and the challenges of integrating it into CELA’s website for end-users to make use of. Problems with book indexing were another common theme relating to this.
Theme #3 Information Architecture
The last theme found was the users' browsing experience with the CELA website. Most of the users prefer browsing the website instead of searching a particular book. Several users experienced challenges throughout the whole browsing process
Theme #4 Browsing Experience
.png)
.png)
.png)
A common theme found between the interaction of the users and CELA site was the complex information architecture they experienced from logging in the site to downloading a specific book they want.
.png)
Stakeholders (User Group)
Primary Audience: Patrons with Print Disabilities
The primary user group of CELA is patrons with print disabilities ranging from low vision to complete vision loss. They are primarily older adults who are retired with limited disposable income. They leverage assistive technologies such as screen reader software (e.g., JAWS, NVDA)
Secondary Audience: Public Librarians
The secondary user group of CELA is public librarians who act as a liaison between patrons with print disabilities and the materials that they want from CELA. Their goal is to make sure that patrons - especially patrons who are nervous about using the internet (technological barrier) - can get access to books and other materials.
Meet Una, who is an older adult with vision loss using screen reader to browse the internet. As a patron of CELA for 10+ years, Una wants CELA to works seamlessly with her assistive technology, and that when she looks for books, she can simply search the book title alongside her preferred alternative format. But unfortunately, it does not always work like that.
Mapping the Current Journey
Problems Defined
Based on our group's research and discovery, the main problem that our group will be focusing on is the search process on the CELA website, which does not seamlessly allow patrons with print disabilities to find books in their preferred alternative formats. This problem can be broken down into specific problems that our group will be tackling and creating potential actionable solutions upon. Our group highlighted the specific problems based on the persona of our end users. The problems are as follows:
Problem #1
The overall information architecture of the CELA website, from the login function, is not always compatible with users’ assistive technologies, disrupting their navigation experience.
Problem #2
Search results pages are not chronologically ordered, where the latest edition of the same book will be displayed first.
Problem #3
Users cannot apply multiple filters (e.g., language, format, genre of books) simultaneously because the website will refresh each time when a new filter is added.
Problem #4
The search function requires the user to type in book titles with the exact spelling of the words, and no result will be displayed if they miss plural nouns or mistype a single letter.
How might we expand and iterate upon the current search functions within the CELA website to improve the users’ experience when searching for reading material in the alternative format of their choice?
Big Idea
Our team prioritized the big ideas we came up with through dot voting, measuring its impact and feasibility. We came up with 4 key solution
Idea #1:
Onboarding Tutorial throughout the login page
Idea #2:
Streamlining Breadcrumbs
Idea #3:
Filtering Enhancement
Idea #4:
Redesign UI Book Card Element
.png)
Wireframes
High-Fidelity Prototype
Home Page Redesign
In our home page redesign, to improve the breadcrumbs of the CELA site, our group proposed "New Titles" as a designated section. From our research insight, we noticed how users browse through the "New Titles". Our group also redesigned the overall homepage and incorporate better hierarchy through the use of grid and card elements to improve accessibility
Filtering
The filtering redesign has two section. (1) Designing a "Personalize your search preferences" page, allowing users with print disabilities to select their preferred format (2) Allow users to edit their search preferences in the sidebar, showcasing their "preferred format"
The external "Create your Search Preference" page leads Users to select their preferred preferences and save it in their account. The prorotype adheres to the accessibility principles
The saved "Preferred Preferences" will be showed immediately in the sidebar under the new column of "Preferred Format" before users started browsing. There are also 2 new hyperlinks "Create my search preferences" and "Edit my search preferences" that allows users to edit their preferred preferences.
The filtering redesign has two section. (1) Designing a "Personalize your search preferences" page, allowing users with print disabilities to select their preferred format (2) Allow users to edit their search preferences in the sidebar, showcasing their "preferred format"
UI Cards
In our user interviews, we found that users users place immense value on the narrative aspect of their reading experiences. The current book card allows users to choose the format, but they have no idea what the narrative will be like. They’ll have to reserve and download to see if it’s the right narrative. To address this gap, our team proposed a preview feature that enables easy narrative comparison and selection.
After selecting the format, users are now able to listen to an audio sample and easily compare to get the preferred style.
The purpose of the test is to investigate the strengths and weaknesses of our new design of the CELA (Centre for Equitable Library Access) website regarding the display of accessibility metadata. We conducted an accessibility usability testing using 2 main screen readers: Voiceover and NVDA
Usability Testing
Pre-Testing (Ensure Figma Prototype is in Accessible Format)
To ensure that our prototype on Figma is accessible, by turning on accessible mode on Figma and tested our prototype using Voiceover on Mac and NVDA on Windows
User Testing Insight
Issues during the Pre-Testing
-
The Screen Reader was not reading some of the elements and frames
-
Navigating accessibly using keyboard was a learning curve for our group
Our group fixed the prototype and the interactive flow by ensuring all elements are inside a single frame with clear labelling to avoid unnecessary voiceover of elements using the screen reader
Our group tested the prototype with a CELA user who has print disabilities. Our group gained immense insight throughout the Think-A-Loud testing sessions. We conducted 2 Tasks for the users to conduct
-
Task 1: "Navigate to the “New Audio Books” within the “New Titles” section
-> For the first book and choose a format -> Listen to the sample and get it. -
Task 2: "Search for: “Hunger Games” -> Then in the filter, edit filter preferences for all future search -> Instead of braille print, choose human-narrated format audio option
Main Findings
-
There are a lot of cluttering at the top banner, it is not accessible
-
Page elements needs to be well labeled in a clear matter
-
Because there were many articles, harder to differentiate elements of interest and those the user must ignore
-
The skip the content link doesn’t bring her anywhere
Conclusion
This project was truly a learning curve for our group. Having to dive deep about accessibility design, I enjoyed learning about the different types of assistive technologies, interacting with patrons with print disabilities.
Key Takeaways
-
Designing As-is and To-be Journey Maps to visualize the user journey and their pain points
-
Creating high-fidelity prototype to help solve the issues from the generated insight
-
Interviewed 5 users with print disabilities and 2 library stakeholders from the CELA Team