Table of Contents

• Introduction
• Goal
• Technologies Used
• Features
• How to Play
• Play Online
• Run Locally
• Future Developments
• Conclusion

Introduction

Flag Match is a digital memory game developed with Phaser.js, where the player must match country flags with their corresponding names.
The mechanics are simple: flip the cards, memorize their positions, and find the correct pairs.

Besides being fun, this project is a great way to explore the potential of PhaserJS, a free and open-source framework for 2D game development in JavaScript. It allows you to create experiences that run directly in the browser and can be exported to multiple platforms, such as desktop and mobile, integrating easily with frameworks like React, Vue, and Svelte.

Goal

The challenge is to find all flag ↔ country name pairs in the shortest possible time.

Technologies Used

• Phaser.js → Free and open-source framework for 2D game development in JavaScript. Phaser integrates easily with frameworks such as React, Vue, and Svelte, offering ready-made templates and a powerful command-line tool. This makes it easier to build games that can be distributed on multiple platforms, such as Discord, YouTube, Facebook, App Store, Google Play, Steam, and more.
• HTML5 and CSS3 → Structure and styling of the interface.
• JavaScript (ES6+) → Core game logic.

Features

• Classic memory game with flags and country names.
• Support for mouse, keyboard, and joystick.
• Automatic shuffle system for every new match.
• Flip animation when revealing cards.
• Music control: pause or resume the soundtrack.

How to Play

1. Click (or press with joystick/keyboard) on a card to reveal it.
2. Find the matching pair: flag ↔ country name.
3. Complete all pairs to win the game!

Play Online

Run Locally

If you want to run Flag Match on your computer:

1. Clone the repository:

2. Install the dependencies:

3. Run the game locally:

The game will be available at http://localhost:3000.

Future Developments

Flag Match can evolve in many directions, such as:

• Ranking: Score system to compete with other players.
• New Stages: Expand the game with different themes (e.g., presidents, capitals, or monuments).
• Publishing on Platforms: Release it on stores like Steam or itch.io to increase visibility.

Conclusion

Flag Match is a lightweight, fun, and educational project, ideal for anyone who wants to train their memory while learning a bit more about the countries of the world.
It is also a practical demonstration of the power of Phaser.js, a free, cross-platform, and beginner-friendly framework for JavaScript game development.

And you? Have you already tested the game or worked with Phaser.js? Share your experience in the comments!