Inspiration
Digital accessibility is often treated as a "nice-to-have" or a last-minute legal check, rather than a fundamental human right. We wanted to build a tool that bridges the gap between design and inclusivity, making it effortless for creators to ensure their content is readable for the 1 in 4 adults living with a disability while handling data responsibly by processing images in memory rather than saving them to a permanent database. This protects user privacy.
What it does
AccessCanvas is an AI-powered accessibility auditor. Users upload an image, and the app instantly performs two critical tasks:
Contrast Auditing: It uses computer vision to detect text and calculate contrast ratios against WCAG 2.2 standards, flagging "Critical" or "Warning" regions.
AI Alt-Text: It leverages Gemini 2.0 Flash to synthesize OCR data into natural, semantic alt-text and long descriptions for screen readers.
How we built it
Frontend: A responsive React (Vite) interface designed for speed and clarity.
Backend: A Python/Flask API that handles image processing via OpenCV and Pillow.
Infrastructure: The backend is fully containerized using Docker to manage system-level dependencies like Tesseract OCR.
AI Orchestration: Integrated OpenRouter to access state-of-the-art LLMs for metadata generation.
Deployment: Hosted on Render using a decoupled architecture (Static Site + Web Service).
Challenges we ran into
The biggest hurdle wasn't the code, it was the environment. Deploying Tesseract OCR required a deep dive into Docker and Linux library management to resolve versioning conflicts (like the libgl1-mesa-glx error on macOS). We also faced the CORS issues. Navigating cross origin headers between a decoupled frontend and backend required a robust, production-grade security configuration.
Accomplishments that we're proud of
We are incredibly proud of successfully building a production-ready Docker pipeline that works seamlessly in the cloud. We managed to turn a complex, multi-step accessibility audit into a "one-click" user experience that produces high-fidelity, human-readable AI results that doesn't replace the artists work but rather assists in it.
What we learned
We learned that 90% of development is deployment. Building a local app is one thing, but managing infrastructure, containerization, and server-side dependencies is where the real engineering happens. We also gained a deep appreciation for the technical nuances of inclusive design.
What's next for AccessCanvas
The goal is to scale AccessCanvas into a browser extension that audits live websites in real-time. We also want to implement bulk processing for social media managers and deeper integration with design tools like Figma to catch accessibility issues before they ever reach the web.
Log in or sign up for Devpost to join the conversation.