Accessible Ui Component Library for React

Abstract

"The project began by identifying a significant shortcoming in the available UI component libraries for React applications namely, their lack of built-in accessibility features. Using both qualitative and expert-driven testing methodologies, the research established the essential criteria for accessibility in UI design, such as keyboard navigation, color contrast, screen reader compatibility, and responsiveness. The Universal UI Component Library was then developed to meet these criteria, incorporating advanced React techniques like contexts, hooks, and state management to ensure components are scalable, performant, and easy to implement in various projects. A thematic testing approach was employed to evaluate the usability and accessibility of the component library. Experts from the fields of web development and accessibility provided insights into its functionality, customization options, and user experience. The results revealed that the library outperformed existing solutions, such as Chakra UI and Semantic UI, by offering enhanced accessibility, improved color contrast, up-to-date WCAG compliance, and a focus on inclusivity. The research demonstrated the feasibility of creating a specialized UI library that addresses accessibility concerns in React development. It also highlighted the importance of continuous iteration and future incorporation of quantitative usability metrics. This library provides a significant contribution to web development by offering developers a tool to build more inclusive digital experiences with minimal complexity."