Inspiration

With the European Accessibility Act approaching, ensuring that web applications meet WCAG AA standards is no longer just a good practice - it's a legal requirement. However, developers often struggle with accessibility rules, and finding out about a11y violations during the QA phase or from user complaints is too late. We wanted to solve this by bringing accessibility analysis directly to where developers spend most of their time: the IDE.

What it does

Our project is a smart plugin for JetBrains IDEs designed to make Frontend development universally accessible. It analyzes code (like React/Next.js components) in real-time. When it detects an accessibility issue (e.g., missing ARIA labels, poor contrast, or un-navigable DOM structures), it not only highlights the problem but uses AI to explain why it's an issue according to EU laws, and provides a ready-to-use code snippet to fix it.

Additionally, we built a web dashboard where teams can track their project's overall accessibility health score.

How we built it

We utilized a robust and diverse tech stack:

  • JetBrains Plugin SDK (Kotlin): To build the native IDE extension, ensuring smooth UI integration and real-time code inspection.
  • Java (Backend): Serves as the middleware, processing requests from the plugin, managing business logic, and securely handling API calls.
  • OpenAI API: Powers the core analysis, taking the problematic AST (Abstract Syntax Tree) nodes and generating context-aware fixes.
  • MongoDB: Acts as our main database to store analysis history, common project-wide violations, and team configurations.
  • Next.js: Used to build a responsive frontend web dashboard for project managers and QA engineers to view the a11y analytics gathered by the plugin.

Challenges we ran into

Integrating real-time code analysis without slowing down the IDE was a major hurdle. We had to learn how to efficiently parse and traverse the syntax tree within the JetBrains environment. Another challenge was prompt engineering: we had to strictly format our OpenAI prompts to ensure the model returned valid, compilable code rather than generic text advice.

What we learned

Our team gained deep, hands-on experience with the JetBrains Plugin SDK - a powerful but complex ecosystem. We also learned a lot about WCAG AA compliance and how challenging, yet crucial, it is to build an inclusive web.

Built With

Share this project:

Updates