Redesigning FEPBlue: A Commitment to Accessibility and User Experience
In today’s digital landscape, accessibility is not just an option; it’s a necessity. As UX/UI designers, we have a responsibility to create inclusive experiences that cater to all users, including those with disabilities. This principle guided the recent redesign of the FEPBlue app, which serves users enrolled in Blue Cross Blue Shield's Federal Employee Program (FEP). Our goal was to not only enhance the user experience but also to ensure compliance with the Web Content Accessibility Guidelines (WCAG) 2.1 AA standards.
Understanding the Need for Redesign
The FEPBlue app is a vital resource for users managing their health insurance. However, user feedback indicated that many found it challenging to navigate, particularly those with visual impairments or cognitive disabilities. We recognized that the existing design fell short of meeting the WCAG 2.1 AA standards, which are essential for providing a baseline of accessibility.
What Are WCAG 2.1 AA Standards?
WCAG 2.1 AA standards provide a framework to make digital content more accessible. They include guidelines related to text contrast, keyboard navigation, use of clear language, and more. Meeting these standards ensures that users of varying abilities can effectively interact with digital products.
Key Features of the Redesign
Enhanced Navigation: We streamlined the app’s navigation, making it intuitive and easy to use. This involved simplifying the menu structure and ensuring that all interactive elements are easily accessible via keyboard navigation.
Improved Visual Hierarchy: By applying consistent typography, increased contrast ratios, and clear call-to-action buttons, we made important information stand out. This not only benefits users with visual impairments but also enhances the overall user experience.
Responsive Design: The redesign prioritizes responsive layouts, ensuring that the app functions seamlessly across various devices and screen sizes.
Alternative Text and Descriptive Labels: We implemented alternative text for all images and descriptive labels for form fields and other UI elements to enhance usability for screen reader users.
Color and Contrast: Our design adheres to the WCAG standards for color contrast, ensuring that text is legible against background colors.
Creating a New Design System
Alongside the app redesign, we developed a comprehensive design system to support consistent branding and user experience across all platforms. This system includes:
Style Guide: A detailed guide covering typography, color palettes, button styles, and icons, ensuring consistency throughout the app.
Component Library: A library of reusable UI components, facilitating efficient development and ensuring that all components meet accessibility standards.
Documentation: Clear documentation on how to implement and maintain accessibility standards within the design system, making it easier for future updates and designs.
The Outcome
The redesigned FEPBlue app is not only compliant with WCAG 2.1 AA standards but also offers a more engaging and user-friendly experience. Early user testing indicates that users, including those with disabilities, find the app more accessible and easier to navigate.
Conclusion
The redesign of the FEPBlue app underscores our commitment to accessibility and inclusive design. By prioritizing the needs of all users, we’re not just adhering to standards; we’re fostering a more equitable digital landscape. As we continue to refine our processes, we’re excited about the possibilities that a user-centered approach can bring to future projects.
In a world where digital accessibility is paramount, let’s continue to advocate for designs that empower every user to thrive.
Designed while working at MERGE.