teaser-milefiz

3D Webgame Development 

CLIENT                     University Project
TECHNOLOGY      Java, Springboot, Vue, Typescript,                                              Tres.js

MY JOB                     Development & Scrum Master 
TEAM                         I. Henkel (PO)
                                      D. Jöckel (Dev & part-time SM)
                                      L. Kalkum (Dev)
                                      A. Kalwa (Dev)
                                      T. Nguyen (Dev)
                                      M. Rohwedder (Dev)
                                      J. Scharf (Dev)
                                      S. Schwarzer (Dev)
                                      N. Tajja (Dev)
                                      Prof. Dr. W. Weitz (Supervision)

 

MI’lefiz was a university software engineering project developed in a team of ten. The goal was to reinterpret the classic board game Malefiz as a synchronous online multiplayer experience in a modern web environment. The project combined backend game logic, real-time communication, and a 3D browser-based interface to create an interactive and atmospheric gameplay experience.
The application was built using a Spring Boot backend in Java and a Vue 3 frontend with TypeScript, while Tres.js (based on Three.js) was used to render the interactive 3D game board directly in the browser.

Within the team, I worked primarily as a developer while also taking on the Scrum Master role during several sprints. My technical focus was on implementing core gameplay mechanics such as character movement, dynamic obstacles, and the multiplayer lobby system. These systems were essential for translating the traditional board game mechanics into a responsive and intuitive digital experience.

Game Concept

spiel

The goal of MI’lefiz was to reinterpret the classic Malefiz board game as a synchronous online multiplayer experience. Players control five characters and compete to reach the final field first, moving across the board based on independently rolled dice with a short cooldown between rolls.

Several mechanics were introduced to make the gameplay more dynamic in a digital setting. When two players land on the same field, a mini-game duel decides the outcome: the loser is sent back to their starting position while the winner keeps the tile. Another central mechanic are movable barriers, which block paths on the board. If a player lands exactly on a barrier, they can relocate it to another free tile, forcing players to constantly adapt their routes.

To support the gameplay concept, the game was designed with a dark, mystical atmosphere, using stylized environments and music to create a slightly eerie tone that sets it apart from the more playful style usually associated with board games.

My Role in the Project

My main focus in the project was implementing several of the core gameplay systems that directly affect how players interact with the board. These included:

  • the character movement system
  • the dynamic barrier mechanic
  • the multiplayer lobby interface

All of these features required close coordination between frontend interaction, backend game logic, and real-time updates through WebSockets. In addition to the technical work, I also took on the Scrum Master role during multiple sprints, supporting the team’s workflow and communication.

Player Movement and Logic

One of my main responsibilities was implementing the movement system for the characters.

Players move by clicking directional arrows that appear around their character. These arrows are only shown when movement in that direction is actually possible, preventing invalid actions and keeping the interface intuitive.

To determine valid paths, the system calculates reachable tiles using a depth-first search across the board graph while considering dice values, obstacles, and other players. Since new mechanics were introduced throughout development, the movement logic had to be continuously extended and adapted to integrate features like duels and barriers.

Obstacles and path blockers

I implemented the barrier mechanic, which introduces dynamic obstacles to the board.

Barriers block certain paths and force players to adjust their routes. If a player lands exactly on a barrier, they can relocate it to another free tile, potentially disrupting other players’ strategies.

From a technical perspective, this required integrating barriers into the existing movement validation logic and ensuring that barrier placement remained synchronized across all players in the multiplayer game state.

Lobby Frontend

lobby-erstellen

I developed the frontend for the multiplayer lobby and later integrated it with the backend.

Players can create a lobby or join one using a lobby code. Inside the lobby, they can choose a skin, mark themselves as ready, or leave the session. The host selects the level when creating the lobby and can remove players if necessary.

Once all players are marked as ready, the game starts automatically. Implementing this feature required handling real-time state updates so that player actions are immediately reflected for all connected clients.

lobbyview

Role as Scrum Master

During several sprints I also took on the role of Scrum Master, alongside my development work.
In this role I focused on maintaining a smooth development process within the team. My responsibilities included facilitating communication, keeping track of sprint items, and ensuring that priorities and deadlines remained visible for everyone.

I moderated core Scrum ceremonies such as: Daily stand-ups, Sprint planning, Sprint retrospectives

The retrospectives were particularly valuable, as they gave us space to identify friction points in our workflow and introduce concrete improvements for the following sprint. Supporting these discussions helped the team continuously refine both our collaboration and our development process.

Let's Play!

The demo video showcases the core gameplay features of MI’lefiz, including character movement, dynamic barriers, and the multiplayer interaction within the 3D environment. Here you can see a small walkthrough the game with two players. Take a look!

Takeaway

This project gave me hands-on experience with full-stack multiplayer web development, combining real-time communication, gameplay logic, and 3D rendering in the browser.

Working on the movement system and dynamic obstacles required careful coordination between backend game state, frontend visualization, and WebSocket synchronization, while the Scrum Master role allowed me to gain experience facilitating agile teamwork in a larger development group.

View