Portal educacional · Acessibilidade
Portal da Educação Municipal
Educação com mais formas de acesso: Libras, leitura em áudio e conteúdos para a comunidade escolar.
SOBRE O PROJETO
Da ideia à experiência.
Portal educacional voltado à comunidade escolar de Bayeux, reunindo notícias, materiais didáticos, atividades e tutoriais em uma interface responsiva. Seu principal diferencial é a acessibilidade: integração com VLibras para tradução de conteúdo para a Língua Brasileira de Sinais e leitura em áudio em português, oferecendo outras formas de explorar as informações do portal.
Funcionalidades.
- Integração com o widget VLibras, acessível pelo botão flutuante de Libras.
- Leitura em áudio de textos ao passar o mouse ou mover o foco pelo teclado, com voz em português do Brasil.
- Controle para ativar e desativar o áudio, com preferência salva no navegador e destaque visual do elemento em leitura.
- Leitura de textos alternativos de imagens e rótulos acessíveis de elementos da interface.
- Notícias da educação municipal, materiais organizados por matérias e tutoriais com videoaulas.
- Assistente Bayeuxinho com opções de navegação para notícias, atividades, tutoriais, acesso do professor e contato.
- Interface responsiva com animações e acesso aos canais de atendimento da Secretaria.
Arquitetura & integração.
Desenvolvido com Next.js App Router, React e TypeScript, com estilização em Tailwind CSS e animações em Framer Motion. Notícias, matérias, conteúdos e tutoriais são organizados em arquivos JSON. O componente de acessibilidade integra o VLibras e utiliza a Web Speech API do navegador para sintetizar a leitura em áudio. A versão de demonstração está publicada na Netlify.
Acessibilidade em destaque.
- VLibras disponível em todo o portal por meio do layout compartilhado.
- Síntese de voz com speechSynthesis e idioma pt-BR, conforme suporte e vozes disponíveis no navegador.
- Leitura acionada por ponteiro ou foco, com identificação de textos por aria-label, conteúdo textual e atributo alt das imagens.
- Botão de áudio com estado aria-pressed e preferência persistida em localStorage.