Back to Projects
Accessibility QA Engineer – AI Trainer Platform screenshot

Accessibility QA Engineer – AI Trainer Platform

A comprehensive Accessibility QA Engineer – AI Trainer platform built for the DataAnnotation role. It demonstrates five integrated capabilities: an Accessibility Auditor with live WCAG 2.1 color-contrast ratio calculator (AA/AAA), ARIA role and attribute validator with tree visualization, keyboard navigation focus-order auditor, a 14-item WCAG 2.1 AA quick checklist, and a screen-reader output simulator; a Challenge Designer for authoring accessibility-focused coding problems (Modal Dialog, Contrast Checker, ARIA Live Region, Focus Trap, etc.) with live preview and an 8-problem pre-seeded library; a Code Evaluator that statically analyses pasted JavaScript for accessibility patterns (role="dialog", aria-modal, focus trap, Escape handler) with cyclomatic-complexity metrics and an 8-case WCAG-tagged test runner; an AI Feedback Studio for reviewing three pre-loaded AI-generated submissions (keyboard trap, Python alt-text generator, TypeScript ARIA live announcer) across six scoring dimensions (Correctness, Accessibility, WCAG Compliance, Code Clarity, Performance, Robustness) with history table and KPI cards; and an Analytics Dashboard with four Canvas-rendered charts (WCAG issue distribution bar, severity donut, 12-week quality trend, language distribution), a WCAG principle data-quality table, contributor leaderboard, and real-time activity feed.

JavaScriptTypeScriptPythonHTML5CSS3WCAG 2.1ARIACanvas APIAccessibility QAAI TrainingCode Quality Analysis

Interactive Demo

Run the interactive demo directly in this page, or open it in a dedicated tab for full-screen testing.

Open Demo

Demo Size

This interactive demo allows you to try Accessibility QA Engineer – AI Trainer Platform. Use keyboard navigation to interact with the embedded content.

Project Information
Category:
Full Stack
Status:
Completed
Type:
Interactive Demo
Technology Stack
JavaScriptTypeScriptPythonHTML5CSS3WCAG 2.1ARIACanvas APIAccessibility QAAI TrainingCode Quality Analysis

Technical Overview

Watch a technical walkthrough explaining the architecture, key design decisions, and implementation highlights of this project.

Video Presentation Coming Soon

A video walkthrough for this project will be added here soon.