4Game

Imgur

Hello!

I love playing the role-playing game Mafia, but recently with the wave of popularity of the game Among Us, I found out it and I think that it is the perfect pastime.

After spending several dozen hours playing the game, I came up with the idea to make an auxiliary element for the game. As I am a web developer, I decided to create a map in the form of a site. To be more precise, a map on which you can place placemarks after each round and, if necessary, return to the results of previous rounds, the idea was simple, but over the course of working on it, more and more ideas were coming to mind to improve the map. Thus, such functions as were born:

– choosing the color of allies;

– mark a suspect (with a value that shows how many times you have suspected a player);

– mark the player as exiled;

– mark the player killed (in this case, the icon of a usual character changes to a corpse similar to the game);

​

Also added the ability to adjust to scale the map, because what kind of map is it without such basic functions.

After several tests, playing with the map revealed one big flaw. After each start of a new game, it was necessary to update the web page, thereby erasing all the placemarks and traces of the previous game, but then the color choice for allies was erased too and each game had to be set up again. The solution was simple, you had to add a button that would erase the progress of the previous game while leaving a choice of colors. Done!

I missed it all. I thought, since the map is interactive, then there should be interactive elements on it, which means it would be logical to add ventilation hatches along which traitors move, and so clicking on one hatch will open all related to it. Done!

As a result, I got a good functional map, but it still lacked something… Precisely! It needs to reproduce the exact scene from the game of a particular map, namely, add the ability to fly the ship through space and animate its engines. Done!

And this is the day when I can provide a map for everyone, in just a week I managed to make a good, let me think, interactive map.

Also, I wrote a small manual on how to use the map below.

Thank you for your attention!

​

Link to the map: http://among-us-map.web-developer-oleg.com/index-en.html

​

Manual:

1. Start of the game

-First of all, you need to select your team players' colors, go to the menu, the "settings" section and just click on the icons of colors that are in your team, to cancel the selection, just click on them again. To close the menu, click the corresponding button again.

1. Your first voting.

– To place the placemark on the map, you need to click on the "Characters" button, you will open a panel on the left where the characters you previously selected will be located. Click on one of the characters, a submenu will open and the first button will be the placemark. Click on it and then on the map. To cancel the placemark, click the button again.

1. Kill

– If someone died during this round, just click on the 4th button, the character icon will immediately change. To cancel, click again.

1. Suspects.

– To mark suspects, click on the 2nd button, the character icon will change its color to reddish, and the placemark on the map will get the corresponding color glow. Also, this button has a counter of how many times you have chosen this character as a suspect.

1. Exile.

– If you have one of the players expelled from your team, click on the 3rd button. The character icon will turn gray. To cancel, click again.

1. You have started the next round.

– You need to switch the round, just click on the button "Rounds" you will open a window on the right where you need to click on the corresponding round. This way, if you are interested in data from previous rounds, you can quickly switch through them and get the information you need.

1. The end of the game.

– After the end of the game, just click on the "Update" button and all the placemarks on the map will be erased, except for the characters you selected. In case of replacement of characters, do not forget to change the colors in the settings.

​

Congratulations you have passed the training! (Except for those who just squandered to this point)

Thank you for your interest in the map I made!