Through Their Eyes Copy

See your website through different eyes. An interactive accessibility tool that helps designers visualize barriers faced by people with disabilities and create more inclusive digital experiences.

Comment

Inspiration

Most of us use websites every day without thinking about whether everyone else can experience them the same way. Something as simple as distinguishing two buttons, reading a paragraph, or navigating a form can become a significant barrier depending on someone's abilities and how a website is designed.

As someone interested in psychology and human perception, I wanted to explore how technology could help us recognize experiences different from our own.

That led me to a question: What if designers could experience the accessibility barriers in their own websites before other people encounter them?

I created Through Their Eyes to make digital accessibility more understandable, interactive, and actionable.

What it does

Through Their Eyes is an interactive web accessibility platform designed to help developers, designers, and business owners understand how their websites may appear to people with different visual conditions.

Users can upload a screenshot of their website or explore a built-in example. They can then select from different visual simulation modes, including protanopia, deuteranopia, tritanopia, grayscale, reduced clarity, and reduced contrast.

The platform provides interactive before-and-after comparisons, allowing users to examine how different visual conditions may affect their designs.

It also includes a color contrast checker based on WCAG guidelines and educational recommendations for improving accessibility.

The goal is not to perfectly recreate someone's lived experience of disability, but to help designers identify potential barriers and make more inclusive design decisions.

How I built it

I developed Through Their Eyes using Lovable, an AI-assisted development platform, which helped me turn my ideas into a functioning web application despite my limited programming background.

I defined the product concept, planned the features, directed the user experience, and iteratively guided the development process.

The application was built using React, TypeScript, and Tailwind CSS, with browser-based image processing for the visual demonstrations.

My main focus was creating an experience that was intuitive enough for someone without prior accessibility knowledge to use.

AI-assisted development played a significant role in generating and implementing the code, while I focused on the product's purpose, design requirements, and functionality.

Challenges I ran into

One of the biggest conceptual challenges was figuring out how to represent disabilities responsibly.

My initial idea was to let people literally see the world through someone else's eyes. However, I realized that disabilities are complex, individual experiences that cannot be fully reproduced through simple filters.

This led me to distinguish between approximate visual simulations and demonstrations of accessibility barriers.

Another challenge was balancing the number of features with usability. I wanted to make the platform informative without turning it into an overwhelming technical dashboard.

Accomplishments that I'm proud of

I'm proud of turning a concept about empathy and human perception into a publicly accessible, interactive web application.

Rather than simply explaining why accessibility matters, Through Their Eyes allows users to explore the issue through their own website designs.

I'm especially proud of connecting my interests in psychology, technology, and social impact to create something that could have practical value for designers and developers.

Building a software prototype with limited programming experience was also an important personal milestone.

What I learned

This project taught me that accessibility isn't simply about adding features to accommodate certain users. It's about recognizing that people perceive and interact with technology differently from the beginning of the design process.

I also learned how important it is to balance creativity with technical accuracy and responsible representation, particularly when developing tools related to disability.

On the technical side, I gained experience with AI-assisted development, translating product requirements into functioning software, and thinking more critically about user experience.

Most importantly, I realized that technology can help people become more aware of perspectives they may otherwise overlook.

What's next for Through Their Eyes

I want to continue expanding Through Their Eyes beyond visual accessibility.

Future versions could explore motor, reading, and cognitive accessibility through interactive demonstrations designed around real usability barriers.

I also hope to work with people with disabilities and accessibility professionals to improve the platform's accuracy and usefulness.

Eventually, I'd like Through Their Eyes to become a practical resource that helps developers, designers, and businesses create more inclusive digital experiences.

Because good design shouldn't assume everyone experiences the world the same way.

Built With

Share this project:

Updates

Submission history