Me Conte uma História

Jogo educativo web que apresenta lendas do folclore brasileiro através de um mapa interativo, cenas ilustradas e diálogos.

Principais pontos
  • Jogo educativo voltado ao público infantil
  • Mapa interativo com diferentes regiões
  • Narrativas baseadas no folclore brasileiro
  • Sistema de diálogos e cenas sequenciais
  • Navegação por mouse e teclado
  • Interface responsiva
  • Projeto estático executado diretamente no navegador
Tecnologias utilizadas
Me Conte uma História

Visão geral

Me Conte uma História é um jogo educativo interativo criado em grupo durante o ensino médio.

O projeto apresenta lendas do folclore brasileiro através de uma experiência inspirada em jogos point-and-click, utilizando um mapa interativo para permitir que o jogador escolha diferentes histórias.

O projeto foi pensado para aproximar crianças e jovens da cultura popular brasileira através de uma experiência visual e interativa.

Como funciona

A experiência começa em um mapa que apresenta diferentes pontos de interação.

Ao selecionar uma região, o jogador é direcionado para a narrativa correspondente.

Cada história é composta por uma sequência de cenas ilustradas e diálogos.

O avanço pode ser realizado através do botão visual da interface ou utilizando as teclas Espaço e Enter.

O fluxo é controlado por uma lógica JavaScript responsável por trocar as cenas, carregar as imagens correspondentes e avançar os diálogos.

Arquitetura

O projeto é totalmente estático e foi construído utilizando tecnologias web fundamentais.

HTML

Responsável pelas páginas do mapa e das histórias.

CSS

Controla a identidade visual, transições, efeitos de interação, fontes e adaptação para diferentes tamanhos de tela.

JavaScript

O arquivo story.js concentra a lógica responsável pelo fluxo das narrativas, incluindo:

  • transição entre cenas;
  • carregamento de imagens;
  • avanço dos diálogos;
  • controle da interação do jogador.

A estrutura das histórias é organizada em diretórios independentes, enquanto os recursos compartilhados ficam na pasta assets.

Funcionalidades

  • Mapa interativo para seleção das histórias.
  • Narrativas ilustradas com cenas sequenciais.
  • Sistema de diálogos com apresentação visual personalizada.
  • Navegação por teclado através de Espaço e Enter.
  • Interface responsiva para diferentes tamanhos de tela.
  • Três lendas disponíveis:
    • Cabeça de Cuia;
    • Papa-Figo;
    • Pedra da Glória.

Screenshots

Capturas de tela do jogo.

Me Conte uma História • 1 de 2
Me Conte uma História - Captura de tela 1
Me Conte uma História • 2 de 2
Me Conte uma História - Captura de tela 2

Aprendizados

Por ter sido desenvolvido durante o ensino médio e em grupo, o projeto representa uma experiência inicial de desenvolvimento de aplicações web com uma proposta diferente de sistemas tradicionais.

Além da implementação técnica, o projeto envolveu a transformação de conteúdo cultural em uma experiência interativa e educativa.

O resultado combina desenvolvimento web, narrativa, ilustração e interação com o usuário em uma aplicação executada diretamente no navegador.

Informações adicionais

Lendas apresentadas

Cabeça de Cuia

A história de Crispim, personagem que, após desobedecer e maltratar sua mãe, recebe uma maldição e se transforma em uma criatura com a cabeça em formato de cuia.

Papa-Figo

Uma lenda popular dos interiores de Pernambuco apresentada através da lembrança de uma senhora sobre sua juventude.

Pedra da Glória

Uma narrativa relacionada a uma rocha em uma cachoeira lendária, envolvendo rituais antigos e seres do imaginário indígena.

O projeto utiliza essas histórias como ponto de partida para apresentar elementos do folclore brasileiro de maneira interativa.