AIna - Your Intelligent Ally for an Accessible Web

AIna is your AI-powered co-pilot for visual web accessibility—analyzing websites, grading compliance, and guiding improvements to build a safer, more inclusive internet for everyone.

Comment

Inspiration

Over 2.2 billion people globally live with a visual or cognitive disability, yet 96.3% of the top 1 million websites still fail basic accessibility checks (WebAIM, 2024). From low-contrast text and unlabeled elements to flashing visuals that can trigger seizures, accessibility is still an afterthought on most of the web.

We built AIna to change that — making web accessibility smarter, automated, and truly user-centered.

What it does

  • 🧪 Site Scanner: Input any URL to trigger a deep scrape of the site’s code and design.
  • 🧠 AI-Powered Analysis: We use Google's Gemini Flash 2.0 to evaluate HTML, both inner and outer CSS and visual components, and provide accessibility suggestions.
  • 🧾 Accessibility Grade: Get an intuitive, badge-based score out of 7, based on WCAG 2.1.
  • 📋 Detailed Feedback: Actionable improvement tips generated by AI.
  • 🗂 Rankings Dashboard: A public catalogue of scanned websites (stored in MongoDB Atlas).
  • ⚙️ Accessible Mode: High-contrast mode toggle for our own UI, built-in for demo accessibility.
  • 🛡️ Coming Soon: Blockchain-based accessibility certificates for sites that pass compliance.

How we built it

  • Frontend: React + TypeScript
  • Backend: Node.js, Express, JSDOM (for HTML/CSS parsing)
  • Database: MongoDB Atlas on AWS
  • AI Integration: Gemini Flash 2.0 API for evaluation
  • Style: Accessibility-first responsive design with dark/light/contrast toggles

Challenges we ran into

  • Scraping inconsistent or bloated web structures
  • Creating a scoring system that’s both objective and interpretable
  • Prompting Gemini for consistently helpful and accurate suggestions
  • Blockchain integration caused some major bugs, so we will add it later

Accomplishments that we're proud of

  • 🚀 Built a working full-stack accessibility platform over the weekend
  • 🤝 Seamlessly integrated real-time AI accessibility grading
  • 📊 Developed a live public ranking dashboard
  • 🎨 Delivered a fully accessible interface — including a toggleable high-contrast mode

What we learned

  • Web scraping and DOM parsing bring real engineering challenges
  • How to build full-stack platforms
  • How to deploy cloud-based databases and MongoDB Atlas
  • How to use GeminiAPI and efficiently prompt engineer
  • Great accessibility starts with intentional design, not retroactive fixes
  • Costco pizza tastes pretty good at the right time

What's next for AIna - Your Intelligent Ally for an Accessible Web

  • 🧬 Smarter AI Suggestions: Fine-tuning Gemini prompts for specific roles (e.g., developer vs. user).
  • 🔒 Blockchain Certifications: Verifiable tokens for sites that meet compliance.
  • 🧑‍🤝‍🧑 User Stories and Testing: Partnering with people who use assistive tech to test real-world usability.
  • 🌍 Browser Extension: Scan websites on-the-fly as you browse.
  • 📢 Advocacy: Empowering developers and users alike to push for a more inclusive web — one scan at a time.
Share this project:

Updates