ADA Accessible Charts Overhaul

As part of an enterprise level rebrand for the CFA Institute, I designed over 100 WCAG ADA-compliant charts using Figma, addressing the unique challenges of ensuring accessibility for visually impaired users. This involved designing within Figma to be read by screen readers, so that all content in the chart is read in legible order. 

Project Details

  • Duration: 3 months

  • Role: Motion Designer, Web Designer
  • Brief: Created ADA accessible SVG charts so screen readers would not need Alt Text
  • Date: Summer 2024

Tools

  • Figma
  • Screenreader

Skills

  • Accessibility Compliance (WCAG & ADA)
  • Motion Design
  • Web Design
  • Data Visualization
  •  

Situation:

In a web redesign project aimed at enhancing user experience, it became clear that making our charts ADA-compliant was crucial for inclusivity. The team faced challenges in ensuring that visually impaired users could access and understand the data presented in our charts.

Task:

As the designer responsible for creating the charts in Figma, my task was to develop visually appealing and informative graphics while ensuring they met ADA accessibility standards. This included organizing content to be effectively read by screen readers.

Action:

To tackle the challenges of implementing alt text and ensuring screen reader compatibility, I researched best practices for accessibility in chart design. I developed a systematic approach to ordering content within Figma, allowing screen readers to interpret the information accurately and in a logical sequence. This process was new to our organization, so I collaborated closely with team members to refine our methods and ensure consistency.

Resolution:

The ADA-compliant charts were successfully integrated into the redesigned website, significantly improving accessibility for visually impaired users. Our innovative approach to using Figma for chart design not only enhanced the user experience but also set a new standard for future projects within the organization. The positive feedback from users and stakeholders highlighted the importance of our commitment to inclusivity and accessibility. Screen-readers were able to read information of all charts in order without the need of alternative text. 

I do not claim ownership of any content related to the CFA Institute or it’s affiliated societies and brands. All content posted is for purposes of a professional portfolio.