Inspiration

The idea for Hue & You was inspired by the need to make web content more accessible and inclusive for individuals with color vision deficiency (CVD) and those looking for smarter ways to read and interact with text. The combination of improving readability, providing concise summaries, and addressing accessibility gaps motivated me to build this project.

What it does

Hue & You is a browser extension designed to enhance accessibility and usability for users. It provides:

  1. CVD-Friendly Colors: Allows users to apply customizable, color vision deficiency (CVD)-friendly color palettes to websites.
  2. Bionic Text Conversion: Converts text on websites into Bionic Reading format, highlighting the first few letters of words for better focus and faster reading.
  3. Summarization: Generates concise summaries of web pages using AI, saving time for users.

How I built it

  • Frontend: Developed in React for dynamic rendering and an interactive user experience.
  • APIs: Integrated Google Gemini Pro API to implement Bionic Text and summarization features.
  • Accessibility Design: Included user-friendly settings to adjust color preferences for CVD.
  • Libraries: Used ReactMarkdown for rendering formatted text and other React-based libraries for animations and functionality.

Challenges I ran into

  1. API Integration:
    • Faced difficulties understanding the Gemini Pro API structure and resolving errors in the fetch requests for chrome extension.
  2. Time Constraints:
    • Completing development, testing, and debugging within a tight deadline.
  3. Accessibility Features:
    • Balancing simplicity and functionality to ensure the extension was intuitive yet powerful.
  4. System Constraints:
    • Limited system capabilities prevented the use of advanced built-in AI APIs for tasks, so incorporated Gemini-1.5-Pro currently. Use of built-in AI APIs are planned for future iterations with model compatible system.

Accomplishments that I'm proud of

  • Successfully implementing Bionic Text Conversion and Summarization using advanced AI models.
  • Creating a clean, intuitive interface that supports customization for CVD-friendly colors.
  • Overcoming technical challenges to deliver a functional and accessible extension within the given timeframe.

What I learned

  • Technical Growth: Improved skills in React, API integration, and handling asynchronous operations.
  • Accessibility Awareness: Gained insights into designing tools for users with specific needs, such as CVD.
  • AI Integration: Learned to utilize generative AI APIs for practical applications like text formatting and summarization.
  • Time Management: Prioritized tasks effectively to ensure the project's core features were completed.

What's next for Hue & You

  1. Image Transformation for CVD:
    • Enable real-time adaptation of images to CVD-friendly palettes, helping users distinguish colors they otherwise cannot see.
  2. Advanced AI Features:
    • Integrate multimodal AI APIs for expanded capabilities, including prompt translations and more nuanced summarizations.
  3. User Feedback:
    • Gather user input to enhance usability, accessibility, and features in future updates.
  4. Cross-Platform Availability:
    • Expand support to other browsers and devices for broader accessibility.

Hue & You aims to continue improving web accessibility and readability, making online content more inclusive and user-friendly.

Built With

Share this project:

Updates