Accessibility Booster

• 

  estilização

• 

  configurações

• 

  ferramentas

• 

  tela inicial escura

• 

  tela inicial clara

Criar uma web verdadeiramente acessível para todos ainda é um desafio, especialmente para pessoas com deficiência ou barreiras linguísticas. O Accessibility Booster foi inspirado pelo desejo de utilizar a IA para fornecer ferramentas de acessibilidade avançadas, personalizáveis ​​e fáceis de usar diretamente no navegador.

O que faz O Accessibility Booster oferece:

Resumidor: Condense textos longos em diferentes estilos (conciso, detalhado, com marcadores). PromptBox: prompts multimodais (texto e imagem) para explicações, descrições visuais e análises criativas. Tradutor: traduz texto entre 8 idiomas, com detecção automática e preservação de formatação. Revisor: verifica e corrige gramática, ortografia e clareza, com sugestões e explicações. Escritor/Reescritor: Gera ou reescreve conteúdo para vários contextos e públicos. Painel de Acessibilidade: Ajuste fonte, cor, contraste, espaçamento e navegação. Suporta fonte adequada para dislexia, modo escuro, navegação por teclado e muito mais. Integração: tour interativo e dicas de ferramentas contextuais para o primeiro uso. Todas as configurações são mantidas em todas as sessões, tornando a experiência fluida e personalizada. Os usuários podem adicionar facilmente sua própria chave de API de IA do Google nas configurações.

Como eu o construí Desenvolvido com Next.js, React, Tailwind CSS e integrado às APIs do Google Generative AI (Gemini). O projeto segue as melhores práticas de acessibilidade, com foco na usabilidade no mundo real.

Desafios enfrentados Lidar com limitações de modelo/versão de API e erros de usuário com elegância. Garantir que todas as ferramentas estivessem acessíveis com leitores de tela e teclado. Fornecendo uma integração de chave de API simples para não desenvolvedores. O que eu aprendi Como integrar várias APIs de IA em uma única interface. Design de acessibilidade avançado para ferramentas digitais. Técnicas para gerenciar prompts de IA multimodais e processar entradas variadas do usuário. Feedback e reflexão Durante o hackathon, aprendi muito sobre design de acessibilidade prática e integração de recursos de IA multimodal. O principal desafio foi tornar a interface verdadeiramente utilizável para usuários com necessidades diversas e conectar APIs de IA robustas. Com mais tempo, eu refinaria a integração e criaria ferramentas de conteúdo mais adaptáveis.

Built With

• fazer
• generativo
• google
• ia
• next.js-14
• react-18
• sdk
• tailwind-css
• typescript