Improving IU Libraries website with Accessibility-Driven Design Systems
Project Status - Shipped
Duration
1.4 years - Present
2 UX Designers, 1 Product Owner, 1 Developer
Team Size
Project Overview
This project aimed to enhance the accessibility and usability of the Indiana University Libraries' websites by aligning them with WCAG guidelines. Our goal was to create an inclusive digital experience for users of all abilities while maintaining consistency across IU Libraries' digital properties.
This project primarily focused on accessibility and design systems, ensuring compliance with WCAG guidelines while establishing a structured and scalable design system.
Part 1 - Accessibility Check
Performed exhaustive studies to comprehend the present condition of IU Libraries' site accessibility, recognizing significant obstacles experienced by users.
Our primary concentration was on A and AA Guidelines for designers, emphasizing on aspects such as Content Optimization, Navigation, Links, Images, Alt text, colour contrast etc.
Accessibility Audit of more than 500 pages.
Our Accessibility score went from 83.5 to 90.5
after the audit and the design system implementation.
Part 2 - Updating for Accessibility - Design Systems
It was ensured that the design system was updated to comply with the WCAG accessibility standards. This involved implementing fixes to ensure that elements such as design tokens (colours & typography), and interactive components met accessibility requirements.
Components were designed in a way that ensured that the content we had on the old website would be optimised in a format that is easily digestible.
View IU Rivet Design Components
Documentation within the design system to provide clear guidelines on how to use components and patterns effectively.
This documentation served as a vital resource for us designers and developers, facilitating the consistent implementation of the design system across various projects and platforms.
View IU Rivet Components Library
Part 3 - Iterating and testing
To ensure that our redesign efforts were both effective and user-centric, we implemented preference tests using the newly developed design system.
The insights gathered from the tests had a profound impact on our redesign strategy. They provided a clear direction for adjustments in our design system, website layout and information hierarchy, ensuring that the most critical information was easily accessible and that navigation paths were intuitive
Impact Made
Accessibility Score went from 83.5 to 90.9 .
Faster implementation post design system.
Improved usability by helping users quickly find relevant information, especially benefiting new users.
How to design for Accessibility?
Gaining a deeper understanding of how to incorporate accessibility standards, into every aspect of the design process. It highlighted the necessity ensuring that digital spaces are accessible to users with diverse abilities.
Potential of Design Systems
This project taught me that creating a design system is a crucial initial step that deeply influences how a website is structured. It ensures every part of the website works together seamlessly, providing a unified experience for users. Additionally, design systems streamline the management and expansion of the website.
Data-Driven Design
The value of employing analytical tools and testing methods to inform design decisions and iterate effectively. This experience taught the importance of using data to continuously refine and improve the design system for better user experiences.
What I learned…
Let's create something amazing together
© 2024 by Sanika Patwardhan. I am a work in progress keep visiting for updates :)
View More Projects
