Sumário
- Introdução
- Objetivo
- Tecnologias utilizadas
- Funcionalidades
- Como jogar
- Acesse o jogo online
- Como rodar localmente
- Desenvolvimentos futuros
- Conclusão
Introdução
O Flag Match é um jogo da memória digital desenvolvido com Phaser.js, onde o jogador deve combinar bandeiras de países com seus nomes correspondentes. A mecânica é simples: vire os cards, memorize suas posições e encontre os pares corretos.
Além de divertido, o projeto é uma boa forma de explorar o potencial do PhaserJS, um framework gratuito e open source para desenvolvimento de jogos 2D em JavaScript. Ele permite criar experiências que rodam no navegador e podem ser exportadas para diversas plataformas, como desktop e mobile, integrando-se facilmente com frameworks como React, Vue e Svelte.
Objetivo
O desafio é encontrar todos os pares bandeira ↔ nome do país no menor tempo possível.
Tecnologias utilizadas
- Phaser.js → Framework gratuito e open source para desenvolvimento de jogos 2D em JavaScript. O Phaser se integra facilmente com frameworks como React, Vue e Svelte, e oferece uma variedade de templates prontos e uma excelente ferramenta de linha de comando. Isso facilita a criação de jogos que podem ser distribuídos em diversas plataformas, como Discord, YouTube, Facebook, App Store, Google Play, Steam e muito mais.
- HTML5 e CSS3 → Estrutura e estilização da interface.
- JavaScript (ES6+) → Lógica principal do jogo.
Funcionalidades
- Jogo da memória clássico com cartas de bandeiras e nomes.
- Suporte a mouse, teclado e joystick.
- Sistema de embaralhamento automático a cada nova partida.
- Animação de flip (virar carta).
- Controle de música: pausar ou continuar a trilha sonora.
Como jogar
- Clique (ou pressione no joystick/teclado) sobre um card para revelá-lo.
- Encontre o par correspondente: bandeira ↔ nome do país.
- Complete todos os pares para vencer a partida!
Acesse o jogo online
Como rodar localmente
Se você quiser rodar o Flag Match no seu computador:
Clone o repositório:
git clone https://github.com/AlexCaranha/FlagMatch.git
cd FlagMatch
Instale as dependências:
npm install
Execute o jogo localmente:
npm run dev
O jogo estará disponível em http://localhost:3000.
Desenvolvimentos futuros
O Flag Match pode evoluir em várias direções, entre elas:
- Ranking: Sistema de pontuação para competir com outros jogadores.
- Novas Fases: Ampliar o jogo com diferentes temas (ex.: presidentes, capitais ou monumentos).
- Publicação em Plataformas: Disponibilizar em lojas como Steam ou itch.io, ampliando a visibilidade.
Conclusão
O Flag Match é um projeto leve, divertido e educativo, ideal para quem busca exercitar a memória enquanto aprende um pouco mais sobre os países do mundo.
Além disso, é uma demonstração prática do poder do Phaser.js, um framework gratuito, multiplataforma e de fácil aprendizado para o desenvolvimento de jogos em JavaScript.
E você, já testou o jogo ou trabalhou com Phaser.js?
