The Coding Cartel present POVMAZE

Lose yourself in the maze.

POVMAZE is a game built in just 7 days using React, Phaser, and Firebase. The project began as a 2D version of Pacman, but over the course of the week, the team expanded it into a fully-realized 3D maze runner with raycasting.

The game is designed to be played from a first-person point of view, immersing the player in the game world. The objective is to navigate through the maze, collecting items and avoiding obstacles.

One of the key features of the game is the use of raycasting, a technique that simulates the behavior of light rays to create 3D graphics in real-time. This allows for rendering of the maze and its surroundings.

POVMaze Demo Video | Northcoders Project Presentations

POVMaze Demo Video | Northcoders Project Presentations

The Coding Cartel

Matthew WaldenPreview: Matthew Walden

Matthew Walden

Pawel SzpytmaPreview: Pawel Szpytma

Pawel Szpytma

Muhammad Faizan RasulPreview: Muhammad Faizan Rasul

Muhammad Faizan Rasul

James PorterPreview: James Porter

James Porter

Ben SivyerPreview: Ben Sivyer

Ben Sivyer

Tech Stack

We used: Phaser, React, Firebase, Tiled & Bootstrap.

We chose Phaser as our game development framework to create a game app that runs in a web browser. Phaser provides a lot of useful features such as sprite rendering, physics, input handling, and sound effects.

For backend services such as user authentication and real-time database to store user scores, we chose Firebase as it is a free cloud-based platform.

To simplify the process of building user interfaces for our game app, we used React. It allowed us to connect Phaser with Firebase and efficiently manage the game's state.

To design our game maps, we used Tiled, which is a powerful map editor for creating tile-based game worlds. Its easy-to-use interface and wide range of tilesets and properties helped us design our game maps more efficiently.

Some challenges we faced:

  • learning Phaser due to a lack of the documents during project phase due rebuild of the Phaser website
  • creating our own raycasting
  • connecting the phaser game and react app into one
Tech StackPreview: Tech Stack