I led a comprehensive accessibility audit for Excelsior by conducting in-depth research and meticulously reviewing our Angular showcase. This process involved using automated tools to identify common accessibility issues, performing manual testing with assistive technologies like screen readers, and evaluating color contrast to meet WCAG standards. I also assessed keyboard navigation to ensure seamless interaction without a mouse. To validate these findings, I collaborated with real users with disabilities, gathering insights to refine and enhance accessibility further. This thorough approach helped create a more usable and equitable product for all users.

A key focus of the audit was optimizing keyboard navigation to support users who rely on it. I thoroughly tested tab order, focus states, and interactive elements to ensure logical and intuitive navigation throughout the system. This included verifying that buttons, links, dropdowns, and modals were fully operable via keyboard alone, implementing skip navigation links for improved efficiency, and resolving keyboard traps that could hinder usability. One key finding from this audit was that some components lacked proper keyboard focus, and developers occasionally omitted appropriate focus states. See an example below of how we addressed this issue by adding a clear and visible focus state to our card components. By refining these interactions, I helped create a more accessible and seamless experience, reinforcing the design system’s commitment to inclusivity

My Role

Old UI vs. new design system

Old UI

Drawing inspiration from Google's Material Design library, we started developing our own components with a distinctive touch, while carefully considering the accessibility needs of our users. Each of us contributed to designing multiple components, conducting extensive research to ensure usability, consistency, and accessibility, all while refining details to create a more visually engaging and polished product.

Promotional Messages